mediawiki-skins-MinervaNeue/skinStyles/mediawiki.action.history.styles.less

/* stylelint-disable selector-max-id, no-descending-specificity */

@import 'mediawiki.skin.variables';
@import 'mediawiki.mixins.less';
@import '../minerva.less/minerva.variables.less';
@import '../minerva.less/minerva.mixins.less';

/* Simplify default version */
.mw-mf-amc-disabled {
	/** compare feature not available, T353401 */
	#mw-history-compare input,
	.mw-history-compareselectedversions,
	/* Header shows date, so this is superfluous. */
	&.action-history .mw-changeslist-date,
	/* current link is hidden as previous link spans entire row. */
	.mw-history-histlinks-current,
	/* tools are hidden for historic reasons. Feel free to reconsider. */
	&.action-history .mw-tag-markers,
	/* tools are hidden for historic reasons. Feel free to reconsider. */
	.mw-usertoollinks,
	/* Hidden for historic reasons. Feel free to reconsider. */
	.mw-history-revisionactions,
	/* tools are hidden for historic reasons. Feel free to reconsider. */
	.mw-pager-tools {
		display: none;
	}

	.mw-changeslist-time {
		display: block !important;
	}

	.mw-history-histlinks span {
		&::before,
		&::after {
			content: none !important;
		}
	}
	/* Make the previous link cover the entire row. */
	.mw-history-histlinks-previous {
		position: absolute;
		right: 0;
		left: 0;
		top: 0;
		bottom: 0;
		color: transparent;
		z-index: @z-index-above-content;
	}

	&.action-history #pagehistory li {
		padding: 12px 16px 12px 85px;
		font-size: 1rem;
		min-height: 90px;

		.history-user a {
			color: var( --color-subtle );

			bdi {
				word-break: break-word;
			}
		}

		.mw-userlink::before {
			content: '';
			.cdx-mixin-css-icon( @cdx-icon-user-avatar, var(--color-subtle) );
			margin-right: 8px;
		}

		.mw-anonuserlink::before {
			.cdx-mixin-css-icon( @cdx-icon-user-anonymous, var(--color-subtle) );
		}

		.mw-tempuserlink::before {
			.cdx-mixin-css-icon( @cdx-icon-user-temporary, var(--color-subtle) );
		}

		.comment {
			-webkit-line-clamp: 2;
			max-height: 2.6em;
			color: var( --color-subtle );
			line-height: 1.4;
			white-space: normal;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			font-size: 0.875rem;
			font-style: normal;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}

	.mw-diff-bytes,
	.mw-changeslist-time {
		position: absolute;
		top: 12px;
		left: 16px;
		font-size: 0.875rem;
	}

	.mw-diff-bytes {
		top: 36px;
	}
}

.action-history {
	#mw-content-text > form {
		margin: 0;
	}

	// the margin value used to create a "faux" column after the
	// radio buttons.
	@revision-selectors-width: 50px;

	// form element wrapping history page content. Overrides #mw-content-text > form
	// for tablet widths.
	#mw-history-compare {
		width: 100%;
		max-width: 100%;
	}

	// The large "Compare selected revisions" button container
	.mw-history-compareselectedversions {
		background: var( --background-color-base );
		.position-sticky();
		top: 0;
		z-index: @z-index-above-content;

		// "Compare selected revisions" button
		.mw-history-compareselectedversions-button {
			width: 100%;
			max-width: 100%;
			-webkit-appearance: unset;
			font-weight: bold;
			border-radius: @border-radius-base;
			margin: 10px 0;
		}

		.mw-history-revisionactions {
			margin-bottom: 2%;
			white-space: pre-wrap;
		}

		// Admin specific "change visibility of selected revisions" buttons.
		.mw-checkbox-toggle-controls {
			display: none;
		}

		// Second large "Compare selected revisions" button container at bottom of page
		& ~ .mw-history-compareselectedversions {
			// hide second "Compare selected revisions" button near bottom
			.mw-history-compareselectedversions-button {
				display: none;
			}

			// show second "Change visibility of selected revisions" button near bottom
			.mw-history-revisionactions,
			.mw-checkbox-toggle-controls {
				display: block;
			}
		}
	}

	.mw-thanks-thank-link {
		margin-right: 1em;
	}

	.jquery-confirmable-text {
		display: flex;
		align-items: center;
		padding-right: 8px;
	}

	// "Change visibility of selected revisions" button (for admins only)
	.mw-history-revisiondelete-button {
		background-color: var( --background-color-interactive-subtle );
		margin-bottom: 1em;
	}

	#pagehistory {
		margin-bottom: 24px;
		padding: 0;

		li {
			.changeslist-row();
			box-sizing: border-box;
			position: relative;
			min-height: inherit;
			padding: 12px 0 10px 60px;
		}

		li::after {
			.clearfix();
		}

		.mw-history-histlinks {
			float: right;
		}

		// Diff radio buttons, admin revision-delete checkbox.
		input[ type='radio' ],
		input[ type='checkbox' ] {
			// Align checkboxes with text.
			top: 5px;
		}

		input[ type='radio' ] {
			position: absolute;
			top: 16px;
		}

		input[ name='oldid' ] {
			left: 8px;
		}

		input[ name='diff' ] {
			left: 32px;
		}

		// checkbox appears slightly smaller than radio buttons,
		// moving down 6px to vertically center.
		input[ type='checkbox' ] {
			position: absolute;
			top: 46px;
			left: 32px;
		}
	}

	.mw-diff-bytes,
	.mw-changeslist-date {
		display: block;
	}

	// removes space between the .mw-diff-bytes and comments.
	.comment {
		float: left;
		width: 100%;
		margin-bottom: 6px;
	}

	// hide page instructions, article size, double dot separator, thank link
	.mw-history-legend,
	.history-size.mw-diff-bytes,
	.mw-changeslist-separator {
		display: none;
	}

	abbr {
		background: var( --background-color-interactive );
		border-radius: 2px;
		font-size: 0.9em;
		font-weight: bold;
		padding: 0 6px 1px;
	}

	// Disable the parentheseses around the undo and rollback link.
	.mw-changeslist-links:not( .mw-usertoollinks ):not( .mw-history-histlinks ) {
		& > span::after,
		& > span::before {
			content: '';
		}
	}

	.mw-tag-markers {
		// Disable the core margins of tags.
		margin: 0;
		// places the tags on the same line as the float-right undo button.
		display: inline;
	}

	.history-user {
		// (hack) - the history page injects unstyleable whitespace. to keep user aligned with other elements
		// it most be moved to the left.
		.mw-mf-amc-enabled & {
			margin-left: -5px;
		}
	}

	.mw-history-undo {
		float: right;
		// Push the tags down to bottom so undo and tags do not overlay.
		padding-bottom: 10px;

		a {
			// Increase touch area of undo button.
			padding: 5px 8px;
		}
	}
}