mediawiki-skins-Citizen/skinStyles/mediawiki/special/mediawiki.special.changeslist.less

/*
 * Citizen
 *
 * SkinStyles for Special:RecentChanges and Watchlist
 * Module: mediawiki.special.changeslist
 * Version: 1.39.0
 *
 * Date: 2023-05-29
*/

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

/* default.less */
.mw-plusminus {
	&-pos {
		color: var( --color-text-success );
	}

	&-neg {
		color: var( --color-text-error );
	}

	&-null {
		color: var( --color-base--subtle );
	}
}

.mw-changeslist {
	.comment {
		color: var( --color-base );
	}

	// Need additional parent to override
	.mw-changeslist-legend {
		padding: 0.6em; // Sync with rcfilter
		border-color: transparent;
		border-radius: var( --border-radius--small );
		background-color: var( --color-surface-2 );
		font-size: 0.8125rem;

		// Citizen label styles
		strong {
			color: var( --color-base--subtle );
			font-weight: var( --font-weight-normal );
			letter-spacing: 0.05em;
		}

		@media ( max-width: @width-breakpoint-tablet ) {
			margin: 0;
			float: none;
		}
	}

	.mw-tag-markers {
		margin-left: var( --space-xxs );

		.mw-tag-marker {
			padding: 2px 8px;
			border-radius: var( --border-radius--pill );
			background-color: var( --color-surface-2 );
			font-size: 0.8125rem;

			&::after {
				display: none;
			}
		}

		&::before,
		&::after {
			display: none;
		}
	}

	h4 {
		padding: var( --space-sm ) 0;
		border-bottom: 1px solid var( --border-color-base );
		margin-bottom: 0;
		color: var( --color-base--subtle );
		font-size: 0.8125rem;
		font-weight: var( --font-weight-normal );
		letter-spacing: 0.05em;
	}

	&-line {
		padding: var( --space-sm ) 0;
		margin: 0 !important;
		font-size: 0.875rem;
		transition: var( --transition-hover );
		transition-property: background;

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

		&-inner {
			color: var( --color-base--subtle );
		}

		+ .mw-changeslist-line {
			border-top: 1px solid var( --border-color-base ); // Add separator
		}
	}

	&-separator {
		color: var( --color-base--subtle );
	}
}

.rcoptions {
	padding: 0;
	border: 0;
	margin: var( --space-xl ) 0;

	legend {
		width: 100%;
		padding: var( --space-xs ) 0;
		border-bottom: 1px solid var( --border-color-base );
		margin-bottom: var( --space-xs );
		font-size: 0.8125rem;
	}
}

.client-js {
	.mw-changeslist ul {
		margin: 0;
		list-style: none;
	}

	.mw-recentchanges-toplinks {
		padding-left: 0;
	}

	body:not( .mw-rcfilters-ui-initialized ) .mw-rcfilters-head {
		border-radius: var( --border-radius--small );
		background: var( --color-surface-2 );
	}

	.mw-recentchanges-toplinks:not( .mw-recentchanges-toplinks-collapsed ) {
		padding: 0; /* Shift padding to button only */
		border-color: var( --border-color-base );
		border-radius: var( --border-radius--small );
		margin-bottom: 16px; /* Same margin between rcfilter and saved filter */

		/* Extend button to full width */
		.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
			display: block;
			background: var( --color-surface-2 );
			border-top-left-radius: var( --border-radius--small );
			border-top-right-radius: var( --border-radius--small );

			.oo-ui-buttonElement-button {
				display: block;
			}

			.oo-ui-indicatorElement-indicator {
				right: 6px !important;
			}
		}
	}
}

.mw-recentchanges-toplinks {
	.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
		margin: 0;
	}
}

/*
 * Only apply stick header style on the special pages
 * Sometimes wiki transclude those pages and these styles will break regular pages
 */
.ns-special {
	.mw-changeslist h4 {
		.citizen-sticky-header( 0, false, false );
	}

	// Disable sticky header
	#citizen-body-header-sticky-sentinel {
		display: none;
	}
}