MediaWiki:Common.css/src/extension/TwoColConflict/SplitTwoColConflict/Split.scss

From Terraria Wiki
Jump to navigation Jump to search

This page is one of the SCSS pages which are the basis for MediaWiki:Common.css. After you edit this page, you will need to recompile them for your changes to take effect. See Terraria Wiki:CSS to learn more.

Ancestors: / src / extension / TwoColConflict / SplitTwoColConflict / Split.scss

Siblings:Split.scssTour.scsseditable.scss

Children: (none)

/********* Extension:TwoColConflict (Split) *********/

/* overwriting styles from here:
 * https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/extensions/TwoColConflict/+/refs/heads/REL1_41/modules/SplitTwoColConflict/ext.TwoColConflict.Split.less */

.mw-twocolconflict-split-current-version-header .mw-twocolconflict-revision-label {
	color: #000;
}

.mw-twocolconflict-special-your-version-header .mw-twocolconflict-revision-label,
.mw-twocolconflict-split-your-version-header .mw-twocolconflict-revision-label {
	color: #000;
}

.mw-twocolconflict-split-row {
	&.mw-twocolconflict-no-selection {
		background-color: var(--ooui--messagewidget-error-background-color);
		border-color: var(--ooui--messagewidget-error-border-color);
	}
}

.mw-twocolconflict-single-column,
.mw-twocolconflict-split-column {
	$background-color: var(--ooui--messagewidget-notice-background-color);
	background-color: $background-color;
	color: var(--theme-text-color);

	$diffadd-border-color: #add8ff; // from base stylesheet
	$diffdelete-border-color: #ffe8a6; // from base stylesheet
	$diffadd-background-color: #eaf3ff; // from base stylesheet
	$diffdelete-background-color: #fef6e7; // from base stylesheet

	&.mw-twocolconflict-split-add {
		border-color: $diffadd-border-color;
	}

	&.mw-twocolconflict-split-delete {
		border-color: $diffdelete-border-color;
	}

	&.mw-twocolconflict-split-copy {
		border-color: var(--ooui--messagewidget-notice-border-color);
		background-color: var(--ooui--messagewidget-notice-background-color);
	}

	ins.mw-twocolconflict-diffchange {
		background-color: $diffadd-border-color;
		color: #000;
	}

	del.mw-twocolconflict-diffchange {
		background-color: $diffdelete-border-color;
		color: #000;
	}

	&.mw-twocolconflict-split-unselected {
		color: var(--theme-text-color-note);

		&.mw-twocolconflict-split-add {
			border-color: rgba($diffadd-border-color, 0.4);
		}

		&.mw-twocolconflict-split-delete {
			border-color: rgba($diffdelete-border-color, 0.4);
		}

		//ins.mw-twocolconflict-diffchange {
		//	background-color: rgba($diffadd-background-color, 0.5);
		//	color: var(--theme-text-color-note);
		//}
		//
		//del.mw-twocolconflict-diffchange {
		//	background-color: rgba($diffdelete-background-color, 0.5);
		//	color: var(--theme-text-color-note);
		//}
	}

	.mw-twocolconflict-split-collapsed {
		.mw-twocolconflict-split-fade {
			background-image: linear-gradient(transparent, $background-color);
		}
	}
}

.mw-twocolconflict-split-selector-label {
	.mw-twocolconflict-no-selection & {
		color: var(--theme-text-color);
	}
}

.mw-twocolconflict-split-selection {
	> div:nth-child(1) {
		.oo-ui-radioInputWidget [type='radio']:checked {
			&, &:hover, &:focus:hover {
				+ span:before {
					/* the default "checked" color is a "theme-related" color which doesn't fit well into this yellow border, so just use the yellow as the "checked" color */
					background: #ac6700;
				}
			}
		}
	}

	> div:nth-child(2) {
		.oo-ui-radioInputWidget [type='radio']:checked {
			&, &:hover, &:focus:hover {
				+ span:before {
					/* the default "checked" color is a "theme-related" color which doesn't fit well into this blue border, so just use the blue as the "checked" color */
					background: #2c529d;
				}
			}
		}
	}
}