ext.relatedArticles.readMore.less
No OneTemporary
Actions

Size

1 KB

Referenced Files

None

Subscribers

None

ext.relatedArticles.readMore.less
View Options

	/*
	* Citizen
	*
	* SkinStyles for Extension:RelatedArticles
	* Module: ext.relatedArticles.readMore
	* Version: REL1_43
	*
	* Date: 2025-01-04
	*/

	@import '../../../resources/variables.less';
	@import '../../../resources/mixins.less';

	#mw-data-after-content > .read-more-container {
	display: flex;
	justify-content: center;
	padding-inline: var( --padding-page );

	> .read-more-container {
	width: 100%;
	max-width: var( --width-page );
	padding: 0;
	}
	}

	.ve-activated {
	#mw-data-after-content > .read-more-container {
	/* hide in VisualEditor */
	display: none;
	}
	}

	.read-more-container-heading {
	padding: 0;
	margin: 0;
	.mixin-citizen-font-styles( 'overline' );
	}

	.read-more-container-card-list {
	grid-template-columns: minmax( 0, 1fr );
	gap: var( --space-xs );

	@media ( min-width: @min-width-breakpoint-tablet ) {
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}

	@media ( min-width: @min-width-breakpoint-desktop ) {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	}

	.cdx-card {
	align-items: center;
	// TODO: Remove when we find a way to customize Codex
	border-radius: var( --border-radius-medium );

	&:hover {
	background-color: var( --background-color-button-quiet--hover );
	}

	&:active {
	background-color: var( --background-color-button-quiet--active );
	}
	}

	.cdx-card__text {
	overflow: hidden;

	&__title,
	&__description {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	}

	&__title {
	color: var( --color-emphasized );
	}

	&__description {
	margin-top: 0;
	.mixin-citizen-font-styles( 'small' );
	}
	}
	}