MediaWiki:UITest.css: Difference between revisions

Latest revision as of 05:35, 4 March 2023

/* OOUI */

.oo-ui-pendingElement-pending {
    background-color: var(--base-1);
    background-image: linear-gradient(135deg,var(--base-2) 25%,transparent 25%,transparent 50%,var(--base-2) 50%,var(--base-2) 75%,transparent 75%,transparent)
}

.client-js .mw-echo-special-nojs {
    filter: var(--filter);
}

/* OOUI STYLE BUTTONS */

button,
.button,
input[type=submit],
.ui-button, 
.mw-ui-button,
.ui-widget .ui-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background: var(--base-1);
    border: 1px solid var(--contrast-3);
    color: var(--contrast-1);
    font-weight: bold;
    border-radius: 2px;
    transition: all 100ms;
}

.mw-ui-button.mw-ui-quiet, 
.mw-ui-button.mw-ui-quiet.mw-ui-progressive, 
.mw-ui-button.mw-ui-quiet.mw-ui-destructive { 
    color: var(--contrast-1); 
}

button:hover,
.button:hover,
input[type=submit]:hover,
.ui-button:hover, 
.mw-ui-button:hover,
.mw-ui-button:not(:disabled):hover,
.ui-widget .ui-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
.ui-state-hover, 
.ui-widget-content .ui-state-hover, 
.ui-widget-header .ui-state-hover{
    background: var(--base-2);
    border-color: var(--contrast-3);
}

.mw-ui-button:not(:disabled):hover {
    color: var(--contrast-1);
}

button:focus,
.button:focus,
input[type=submit]:focus,
.ui-button:focus, 
.mw-ui-button:focus,
.ui-widget .ui-button:focus,
.ui-state-focus, 
.ui-widget-content .ui-state-focus, 
.ui-widget-header .ui-state-focus{
    background: var(--base-1);
    border-color: var(--contrast-2);
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
    background: var(--base-2);
}

.oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button,
.mw-ui-button.mw-ui-progressive:disabled {
    background: var(--contrast-3);
    border-color: var(--contrast-3);
    color: var(--contrast-2);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
    color: var(--contrast-1);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
    background: var(--base-2);
    background: transparent;
    color: var(--contrast-1);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
    color: var(--link);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
    color: var(--link-hover);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > input.oo-ui-buttonElement-button, 
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus{
    background: var(--base-1);
    background: transparent;
    border-color: var(--contrast-2);
}

.oo-ui-processDialog-actions-safe .oo-ui-actionWidget > .oo-ui-buttonElement-button, 
.oo-ui-processDialog-actions-other .oo-ui-actionWidget > .oo-ui-buttonElement-button {
    border-color: transparent;
    border-right-color: var(--contrast-3);
}

.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button {
    border-color: transparent;
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover,
.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, 
.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active{
    background-color: var(--base-2);
    border-color: transparent;
    border-right-color: var(--contrast-3);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:active,
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:focus {
    background-color: var(--base-1);
    border-color: var(--link);
}

.oo-ui-processDialog-actions-primary .oo-ui-actionWidget > .oo-ui-buttonElement-button {
    border-left-color: var(--contrast-3);
}

.oo-ui-optionWidget.oo-ui-widget-disabled {
    color: var(--contrast-2);
}

.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
    border-left-color: var(--base-2);
}

/* OOUI STYLE INPUTS */

input,
select,
textarea {
	color: var(--contrast-1);
	background: var(--base-2);
	border: 1px solid var(--contrast-3);
	padding: 0.35em;
    border-radius: 2px;
}

input,
select,
textarea,
.oo-ui-inputWidget-input,
.oo-ui-textInputWidget .oo-ui-inputWidget-input, 
form:not(.oo-ui-layout) input,
form:not(.oo-ui-layout) textarea,
.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending),
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
    background: var(--base-1);
    border: 1px solid var(--contrast-3);
    color: var(--contrast-1);
    transition: border-color 250ms, box-shadow 250ms;
}

input:hover,
select:hover,
textarea:hover,
.oo-ui-inputWidget-input,
.oo-ui-textInputWidget .oo-ui-inputWidget-input:hover, 
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input,
form:not(.oo-ui-layout) input:hover,
form:not(.oo-ui-layout) textarea:hover,.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {
    border-color: var(--contrast-2);
    color: var(--contrast-1);
}

input:focus,
select:focus,
textarea:focus,
.oo-ui-inputWidget-input:focus,
.oo-ui-textInputWidget .oo-ui-inputWidget-input:focus,
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus,
form:not(.oo-ui-layout) input:focus,
form:not(.oo-ui-layout) textarea:focus {
    border-color: var(--link);
    box-shadow: inset 0 0 0 1px var(--link);
    outline: 1px solid transparent;
}

input::placeholder {
    color: var(--contrast-1);
    opacity: .5;
}

.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input {
    background: var(--contrast-3);
    -webkit-text-fill-color: var(--contrast-2);
    color: var(--contrast-3);
    border-color: var(--contrast-2);
    text-shadow: 0 1px 1px var(--base-1);
}

.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) {
    background: var(--base-2);
}

/* OOUI ICONS */

.oo-ui-iconElement-icon,
.oo-ui-indicatorElement-indicator,
.wikiEditor-ui-toolbar .tabs span.tab a:before,
.wikiEditor-ui-toolbar .group .tool-select .label:after,
.ve-ui-mwLatexPage-symbol,
.mwe-math-element,
.mw-echo-ui-notificationItemWidget-icon {
    filter: var(--filter);
}

.oo-ui-iconElement-icon.oo-ui-image-invert,
.oo-ui-iconElement-icon.oo-ui-image-progressive,
.oo-ui-iconElement-icon.oo-ui-image-destructive,
.oo-ui-image-warning.oo-ui-icon-alert,
.oo-ui-image-destructive.oo-ui-icon-trash,
.oo-ui-checkboxInputWidget-checkIcon,
.oo-ui-image-error.oo-ui-icon-error, 
.mw-ui-icon-error-error:before {
    filter: none;
}

span.oo-ui-indicatorElement-indicator.oo-ui-indicator-clear {
    top: 50%; 
    transform: translateY(-50%);
}

#mw-indicator-mw-helplink a {
    background: transparent;
    position: relative;
}
#mw-indicator-mw-helplink a:before {
    content: "";
    display: block;
    height: 20px;
    width: 20px;
    position: absolute;
    top: 0;
    left: 0;
    filter: var(--filter);
}
#mw-indicator-mw-helplink a:before {
    background-image: url(/wiki/resources/src/mediawiki.helplink/images/helpNotice.svg);
}

/* OOUI CHECKBOXES, RADIO BUTTONS, TOGGLES */

.mw-ui-checkbox,
.checkbox,
.checkbox strong {
    color: var(--contrast-1);
}

.oo-ui-checkboxInputWidget [type='checkbox'] + span,
.oo-ui-toggleSwitchWidget,
.mw-ui-checkbox [type='checkbox'] + label:before {
	background-color: var(--base-1);
	border-color: var(--contrast-3);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
    background-color: var(--base-1);
}

.oo-ui-checkboxInputWidget [type='checkbox']:disabled + span,
.mw-ui-checkbox  [type='checkbox']:disabled + label:before {
    background-color: var(--contrast-3);
	border-color: var(--contrast-3);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip, 
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip, 
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
    background-color: var(--base-1);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
	border-color: var(--contrast-2);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip, 
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip, 
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus:before {
	border-color: var(--base-1);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
	border-color: var(--contrast-3);
    box-shadow: inset 0 0 0 1px var(--contrast-3);
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
	background-color: var(--base-3);
	border-color: var(--contrast-3);
}

.oo-ui-radioInputWidget [type='radio'] + span {
    background-color: var(--base-2);
}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'] + span,
.client-js .mw-ui-radio [type='radio'] + label:before {
    top: 50%; 
    transform: translateY(-50%);
}

.oo-ui-radioOptionWidget .oo-ui-radioInputWidget, .oo-ui-radioOptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
    vertical-align: middle;
}

/* OOUI SELECT, OPTIONS, DROPDOWNS */

.oo-ui-menuSelectWidget,
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled,
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
    background: var(--base-1);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
    transition: all 100ms;
}

.oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover, 
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
    background: var(--base-1);
    border-color: var(--contrast-2);
    color: var(--contrast-1);
}

.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
    color: var(--contrast-1);
}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
.oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
    background-color: var(--highlight-progressive);
    color: var(--contrast);
}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
    background-color: var(--highlight-progressive);
    color: var(--link);
}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
.oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
    background-color: var(--highlight-progressive);
    color: var(--link);
}

/* OOUI DATE PICKER */

.mw-widget-dateInputWidget-handle,
.mw-widget-dateInputWidget-calendar {
    background: var(--base-1);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
    border-radius: 2px;
}

.mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle:hover {
    border-color: var(--contrast-2);
}


.mw-widget-calendarWidget-day{ 
    color: var(--contrast-1)
}

.mw-widget-dateInputWidget-empty .mw-widget-dateInputWidget-handle,
.mw-widget-calendarWidget-day-heading,
.mw-widget-calendarWidget-day-additional {
    color: var(--contrast-2);
}

.mw-widget-calendarWidget-item-selected {
    background: #36c;
    color: #fff;
    font-weight: bold;
}

/* OOUI TAGS */

.oo-ui-menuSectionOptionWidget {
    color: var(--contrast-2);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled,
.oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
    color: var(--contrast-1);
}
.oo-ui-tagMultiselectWidget,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {
    background: var(--base-1);
}
.oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed) {
	background: var(--base-1);
	border-color: var(--contrast-3);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-inputWidget-input:focus {
	border: 0; 
	box-shadow: none;
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input {
	color: var(--contrast-1);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
    background: var(--base-1);
    border-color: var(--contrast-3);
}

/* OOUI FORMS & LAYOUT  */

.oo-ui-panelLayout-framed {
    border-color: var(--contrast-3);
    background: var(--base-2);
}

.oo-ui-tabSelectWidget-framed {
    background: var(--base-1);
}

.oo-ui-tabOptionWidget {
    color: var(--contrast-2);
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
    background: var(--base-2);
    color: var(--contrast-2);
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected,
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active,
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover { 
    background: var(--base-2);
    color: var(--contrast-1);
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
    border-color: transparent;
}

.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) {
    background: var(--highlight-contrast);
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {
    background: transparent;
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
    background: var(--highlight-contrast);
}

/* MODALS AND DIALOGS */

.oo-ui-windowManager-modal > .oo-ui-dialog,
.ui-widget-overlay,
.oo-ui-processDialog-errors {
    background: var(--modal-overlay);
    opacity: 1;
}

.oo-ui-popupWidget-popup,
.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame,
.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame,
.ui-dialog.ui-widget,
.ui-dialog.ui-widget.ui-widget-content {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

.oo-ui-messageDialog-title,
.oo-ui-messageDialog-message { 
    color:var(--contrast-1);
}

.ui-dialog.ui-widget, 
.ui-dialog.ui-widget * {
    font-family: inherit;
}
.ui-dialog.ui-widget, .ui-dialog.ui-widget.ui-widget-content {
    font-size: 1em;
    padding: 0;
    border-radius: 0;
}

.ui-widget-content,
.ui-widget-header,
.ui-dialog .ui-dialog-buttonpane {
	background: transparent;
	border-color: var(--contrast-3);
	color: var(--contrast-1);
    border-radius: 0;
}

.wikiEditor-toolbar-dialog .ui-dialog-buttonpane {
	border-color: var(--contrast-3) !important;
}

.oo-ui-bookletLayout > .oo-ui-menuLayout-menu,
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget,
.ve-ui-mwTwoPaneTransclusionDialogLayout > .oo-ui-menuLayout-menu {
    border-color: var(--contrast-3);
}

.oo-ui-processDialog-content .oo-ui-window-head, 
.oo-ui-processDialog-content .oo-ui-window-foot,
.oo-ui-messageDialog-content > .oo-ui-window-foot {
    outline-color: var(--contrast-3);
}

.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before,
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before {
    border-top-color: var(--contrast-3);
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
    border-bottom-color: var(--base-2);
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after {
    border-top-color: var(--base-2);
}

.ui-widget-content{
    color: var(--contrast-1);
}

.ui-widget-header {
    border-width:0 0 1px; 
    text-align: center;
    height: 3em;
}
.ui-dialog .ui-dialog-title,
.ui-dialog .ui-dialog-titlebar {
    float: none;
    line-height: 3em;
    padding: 0;
}

.ui-dialog .ui-dialog-titlebar-close {
    left: 0;
    top: 0;
    margin: 0;
    border: 0;
    border-right: 1px solid transparent;
    width: 3em;
    height: 3em;
    border-radius: 0;
    opacity: .74;
}

.ui-dialog .ui-dialog-titlebar-close:hover,
.ui-dialog .ui-dialog-titlebar-close.ui-state-hover {
    border-right-color: var(--contrast-3);
} 

.ui-dialog .ui-dialog-titlebar-close:focus,
.ui-dialog .ui-dialog-titlebar-close.ui-state-focus {
    border-color: var(--link);
    box-shadow: inset 0 0 0 1px var(--link);
}

.ui-dialog .ui-dialog-titlebar-close .ui-icon-closethick {
    background: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/close.svg) no-repeat center center;
    border: 1px solid transparent;
    margin: 0;
    width: 3em;
    height: 3em;
    background-size: 20px;
    position: relative;
    filter: var(--filter);
}

.ui-dialog .ui-dialog-buttonpane {
    padding: 0 0 0 .5em;
    height: 3em;
    line-height: 3em;
}

/* OOUI WIZARDS */

.ext-templatewizard-templatetitlebar,
.ext-templatewizard-templateform .oo-ui-menuLayout-menu,
.ext-templatewizard-templateform .oo-ui-menuLayout-menu .ext-templatewizard-add-remove-all {
	background: transparent;
	border-color: var(--contrast-3);
}

.ve-ui-mwTransclusionOutlineTemplateWidget-sticky {
    background: var(--base-2);
    
}

.ext-templatewizard-templateform .oo-ui-menuLayout-menu .ext-templatewizard-parameter-list-inner .oo-ui-buttonElement.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive .oo-ui-labelElement-label, 
.ext-templatewizard-templateform .oo-ui-menuLayout-menu .ext-templatewizard-parameter-list-inner .oo-ui-buttonElement.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive .oo-ui-labelElement-label {
    color: var(--contrast-1);
}

.ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.oo-ui-optionWidget-highlighted {
    background-color: var(--highlight-progressive);
    color: var(--contrast);
}

.ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage, 
.ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage:hover, 
.ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage.oo-ui-optionWidget-highlighted {
    background-color: var(--highlight-progressive);
    color: var(--link);
}

.ve-ui-mwTemplatePage-description,
.ve-ui-mwParameterPage-undocumentedLabel,
.ve-ui-mwMediaDialog-panel-imageinfo-details,
.oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
    color: var(--contrast-2);
}

.oo-ui-searchWidget-query,
.ve-ui-mwGalleryDialog-menuLayout-desktop > .oo-ui-menuLayout-menu,
 .ve-ui-mwGalleryDialog-imageListMenuLayout-desktop > .oo-ui-menuLayout-menu,
.ve-ui-mwLatexDialog-menuLayout > .oo-ui-menuLayout-content {
    border-color: var(--contrast-3);
}

.mw-widget-mediaResultWidget-overlay {
    box-shadow: inset 0 0 0 1px var(--contrast-3);
}

.ve-ui-mwGalleryDialog-highlighted-image {
    background-color: var(--base-1);
}
    
/* OOUI ALERTS, ERRORS, WARNINGS */

.mw-message-box {
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error,
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning,
.mw-message-box {
    position: relative;
    color: var(--contrast-1);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error:before,
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning:before,
.mw-message-box:before{
    content:"";
    background: var(--base-1);
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error{
    background: rgb(255 32 32 / 15%);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {
    background: rgb(255 204 51 / 15%);
}
.mw-message-box-error {
    background: rgb(221 51 51 / 15%);
    border-color: #d33;
}
.mw-message-box-warning {
    background: rgb(255 204 51 / 15%);
    border-color: #fc3;
}
.mw-message-box-success {
    background: rgb(20 134 109 / 15%);
    border-color: #14866d;
}

/* CODE */

code, pre, .mw-code {
    background: var(--base-2);
    color: var(--contrast-1);
    border-color: var(--contrast-3);
}

.mw-content-ltr.mw-highlight-lines pre, 
.mw-content-ltr.content .mw-highlight-lines pre {
    box-shadow: inset 2.75em 0 0 var(--base-1);
}

/* EDITOR */

.wikiEditor-ui-text,
.codeEditor-status,
.codeEditor-status-message {
    color: var(--contrast-1);
    background: var(--base-1);
    border-color: var(--contrast-3);
}

.wikiEditor-ui .wikiEditor-ui-text textarea,
.ace-tm,
.CodeMirror,
.ve-ui-mwAceEditorWidget .ace_editor {
    background: var(--base-2);
    color: var(--contrast-1);
    border-color: var(--contrast-3);
}

.wikiEditor-ui textarea#wpTextbox1:hover,
.wikiEditor-ui textarea#wpTextbox1:focus {
    border: 1px solid var(--contrast-3);
    box-shadow:none;
}

.wikiEditor-ui .wikiEditor-ui-top,
.wikiEditor-ui .wikiEditor-ui-view,
.oo-ui-menuToolGroup {
    border-color: var(--contrast-3);
}

/* ACE EDITOR */

.ace-tm .ace_gutter {
    background: var(--base-1);
}

.ace-tm .ace_gutter-active-line,
.ace-tm .ace_marker-layer .ace_active-line,
.ace-tm .ace_print-margin {
    background: var(--highlight-contrast);
}

.ace-tm .ace_cursor {
    color:var(--contrast-1);
}
.ace-tm .ace_line {
    color: #000;
    filter: var(--filter-ace);
}

.ace_gutter-cell.ace_error,
.ace_gutter-cell.ace_warning,
.ace_gutter-cell.ace_info {
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: 5px center;
}
.ace_gutter-cell.ace_error {
    background-image: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/clear-destructive.svg);
}
.ace_gutter-cell.ace_warning {
    background-image: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/alert-warning.svg);
}
.ace_gutter-cell.ace_info {
    background-image: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/notice-progressive.svg);
}
.codeEditor-status .codeEditor-status-worker-cell.ace_gutter-cell{
    background-position: 1px center;
}
.ace-tm .ace_marker-layer .ace_selection,
.ace_editor.ace_autocomplete .ace_marker-layer .ace_active-line {
    background: var(--highlight-progressive);
}

.ace-tm .ace_marker-layer .ace_selected-word {
    background: var(--base-2);
    border-color: var(--highlight-progressive);
}

.ace_search {
    color:var(--contrast-1);
    background: var(--base-0);
    border-color: var(--contrast-3);
}
.ace_search_form *, .ace_replace_form *{
    vertical-align: middle;
}
.ace_search_field {
    padding: 0 0.35em !important;
}
.ace_search_field,
.ace_searchbtn,
.ace_button,
.ace_searchbtn:last-child {
	color: var(--contrast-1);
	background: var(--base-1);
    border-color: var(--contrast-3);
}
.ace_searchbtn:hover,
.ace_button:hover {
    background: var(--base-2);
    border-color: var(--contrast-2);
}

.ace_editor.ace_autocomplete{
    color: var(--contrast-1);
	background: var(--base-1);
    border-color: var(--contrast-3);
}

/* CODEMIRROR */

.CodeMirror-gutters {
    background: var(--base-1);
    border-color: var(--contrast-3);
}
.CodeMirror pre.CodeMirror-line {
    color: #000;
    filter: var(--filter-codemirror);
    font-size: 13px;
	line-height: 20px;
}

/* OOUI TOOLBAR */

.wikiEditor-ui-toolbar, 
.oo-ui-toolbar-bar,
.oo-ui-toolbar-position-top > .oo-ui-toolbar-bar {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

.wikiEditor-ui-toolbar .group, 
.wikiEditor-ui-toolbar .section-secondary .group,
.wikiEditor-ui-toolbar .sections .section,
.oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above,
.wikiEditor-ui-toolbar .page-table td {
    border-color: var(--contrast-3);
}

.wikiEditor-ui-toolbar .tabs span.tab a.current, 
.wikiEditor-ui-toolbar .tabs span.tab a.current:visited,
.wikiEditor-ui-toolbar .group .tool-select .label,
.ve-ui-specialCharacterPage h3,
.wikiEditor-ui-toolbar .page-table th,
.wikiEditor-ui-toolbar .page-table td {
    color: var(--contrast-1);
}

.wikiEditor-ui-toolbar .tabs span.tab a {
    color: var(--link);
}

.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:active, 
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link {
    background: var(--base-1);
    color: var(--link);
}

.oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover{
    border-color: var(--contrast-3);
}

.wikiEditor-ui-toolbar .page-characters div span,
.ve-ui-specialCharacterPage-character {
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

.wikiEditor-ui-toolbar .page-characters div span:hover,
.ve-ui-specialCharacterPage-character:hover {
    background: transparent;
    border-color: var(--contrast-2);
    color: var(--contrast-1);
}

/* OOUI TOOLBAR SELECT, OPTIONS, DROPDOWNS */

.oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link {
    transition: none;
}

.oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link, .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
    background-color: var(--contrast-3);
    border-color: var(--contrast-3);
}

.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover,
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active,
.oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
    background-color:var(--base-1);
    color: var(--contrast-1);
}

.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover,
.oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
    background-color: var(--highlight-progressive);
    color: var(--contrast);
}

.wikiEditor-ui-toolbar .group .tool-select .options,
.wikiEditor-ui-toolbar .group .tool-select .options .option,
.oo-ui-popupToolGroup-tools {
    background-color: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

.oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected,
.wikiEditor-ui-toolbar .booklet > .index > .current,
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
    background-color: var(--base-1);
    color: var(--link);
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
    background-color: var(--base-2);
    color: var(--contrast-1);
    border-color: var(--contrast-3);
}

.oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted,
.wikiEditor-ui-toolbar .group .tool-select .options .option:hover,
.wikiEditor-ui-toolbar .group .tool-select .menu .options .option:hover,
.wikiEditor-ui-toolbar .booklet > .index > :hover,
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover,
.oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover,
select option:hover{
    background-color: var(--highlight-progressive);
    color: var(--contrast);
}

.oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
    color: var(--link);
}

.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {
    color: var(--contrast-1);
    opacity: .6;
}

.ve-ui-contextItem + .ve-ui-contextItem {
    border-color: var(--contrast-3);
}

/* VISUAL EDITOR */

.ve-ce-branchNode-blockSlug, .ve-ce-branchNode-newSlug {
    background: var(--base-2);
    outline-color: var(--contrast-2);
}

/* BELOW EDITOR */

div.editOptions {
    background: var(--base-0);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

/* SCRIBUNTO */

.mw-scribunto-console-fieldset,
.mw-scribunto-message {
    background:transparent;
}
.mw-scribunto-console-fieldset {
    color: var(--contrast-1);
}
#mw-scribunto-input{
    background: var(--base-1);
    color: var(--contrast-1);
    border: 1px solid var(--contrast-3);
}

/* UPLOADS */

#msupload-dropzone, #msupload-bottom{height:auto;}
.wikiEditor-ui #msupload-select, 
#msupload-bottom #msupload-files {
	background-image: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/upload.svg);
}
#msupload-list .file .file-cancel {
    background-image: url(/wiki/resources/lib/ooui/themes/wikimediaui/images/indicators/clear.svg);
}
.wikiEditor-ui #msupload-select, 
#msupload-bottom #msupload-files,
#msupload-list .file .file-cancel {
    filter: var(--filter);
    opacity: .8;
}
.wikiEditor-ui #msupload-select:hover, 
#msupload-bottom #msupload-files:hover,
#msupload-list .file .file-cancel:hover {
    opacity: 1;
}

#msupload-div { background: var(--base-2); border-color:var(--contrast-3); }
#msupload-div a { color: var(--link); }
#msupload-dropzone { color: var(--contrast-1); border-color: var(--contrast-2); }
#msupload-dropzone.drop-over { background: var(--contrast-3); }
#msupload-bottom { height: auto; border-color: var(--contrast-3); }
#msupload-list .file { background: var(--base-2); border-color: var(--contrast-3); }
#msupload-list .file .file-name:hover { background: var(--contrast-3); }
#msupload-list .file .file-size { color: var(--contrast-2); }

.oo-ui-labelWidget.oo-ui-inline-help {
    color: var(--contrast-1);
    opacity: .6;
}

.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget{
    background:var(--base-1);
    border-color: var(--contrast-2);
}
.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget.oo-ui-selectFileWidget-canDrop{
    background:var(--base-2);
    border-color: var(--contrast-2);
}

/* SEARCH, FILES */

ul#filetoc,
.mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend, 
.mw-changeslist-legend, 
.mw-body .mw-search-profile-tabs, 
.mw-body fieldset#mw-searchoptions {
    color: var(--contrast-1);
    background:var(--base-2);
    border-color: var(--contrast-3);
}

.search-types .current a {
    color: var(--contrast-1);
}

#mw-searchoptions .divider {
    border-color: var(--contrast-3);
}

.results-info,
.mw-search-result-data {
    color: var(--contrast-2);
}

/* HISTORY */

#pagehistory li.selected {
    background: var(--base-3); 
    color: var(--contrast-1); 
    outline-color: var(--contrast-3);
}

.mw-revslider-container,
.mw-revslider-slider-wrapper {
    color: var(--contrast-1);
    background: var(--base-2);
    border-color: var(--contrast-3);
}

.mw-plusminus-pos,
.mw-revslider-change-positive,
.mw-revslider-revision-tooltip .mw-revslider-change-positive {
    color:#148d14;
    font-weight:600;
}
.mw-plusminus-neg, 
.mw-revslider-change-negative,
.mw-revslider-revision-tooltip .mw-revslider-change-negative {
    color:#f44336;
    font-weight:600;
}

.mw-revslider-revision {
    border-color: var(--base-0);
    background-color: var(--base-0);
}

.mw-revslider-revision-border-box{
    border-color: var(--base-1);
}

.mw-revslider-revision-highlight .mw-revslider-revision-border-box {
    border-color: var(--contrast-3);
    background-color: var(--contrast-3);
}

.mw-revslider-revision-new .mw-revslider-revision, 
.mw-revslider-revision-old .mw-revslider-revision, 
.mw-revslider-revision-intermediate .mw-revslider-revision {
    border-color: var(--contrast-2);
    background-color: var(--contrast-3);
}

.mw-revslider-revision-wrapper:hover, .mw-revslider-revision-wrapper-hovered {
    background-color: var(--base-2);
}
.mw-revslider-revision-wrapper-hovered .mw-revslider-revision-hovered.mw-revslider-revision-wrapper-up {
    background-color: var(--highlight-progressive);
}

.mw-revslider-spinner .mw-revslider-bounce,
.mw-revslider-spinner:before,
.mw-revslider-spinner:after{
    background-color: var(--contrast-2);
}

/* DIFF */

.mw-diff-movedpara-left:after,
.mw-diff-movedpara-right:after,
.diff-context{background:var(--base-3); color:var(--contrast-1); border-color:var(--contrast-3);}
.diff-deletedline{border-color:rgb(255 148 32 / 45%); background:var(--base-2);}
.diff-deletedline .diffchange { background: rgb(255 148 32 / 45%); }
.diff-addedline{border-color: rgb(71 219 90 / 45%); background:var(--base-2);}
.diff-addedline .diffchange { background: rgb(71 219 90 / 45%); }

/* CARGO */

body div.drilldown-filters-wrapper {
    background: var(--base-2);
    color: var(--contrast-1);
    border: 1px solid var(--contrast-3);
    padding: 0.6em;
}

.drilldown-values-toggle,
div.cargo-table-diagram {
    filter: var(--filter);
}

.cargo-tablelist .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    border-color: var(--contrast-3);
}

/* NOTIFICATIONS */

.mw-notification,
.client-darkmode .mw-notification {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
} 

#pt-notifications-alert .mw-echo-notifications-badge,
#pt-notifications-notice .mw-echo-notifications-badge {
    filter: var(--filter);
}

.mw-echo-ui-notificationItemWidget {
    background: var(--base-1);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}

.mw-echo-ui-notificationItemWidget-unread {
    background: var(--base-2);
}

.mw-echo-ui-notificationItemWidget:hover,
.mw-echo-ui-notificationItemWidget-unread:hover {
    background: var(--highlight-contrast);
}

.mw-echo-ui-notificationItemWidget-content-message-header,
.mw-echo-ui-menuItemWidget > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
.mw-echo-ui-notificationItemWidget-content-actions-timestamp,
.oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
    color: var(--contrast-1);
}

.mw-echo-ui-menuItemWidget > .oo-ui-buttonElement-button {
    vertical-align:middle;
}

.mw-echo-ui-notificationsListWidget:not(:hover) a, 
#p-personal .mw-echo-ui-notificationsListWidget:not(:hover) a.new,
.mw-echo-ui-crossWikiUnreadFilterWidget-subtitle {
    color: var(--contrast-2);
}

.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head,
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-footer,
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-footer .mw-echo-ui-notificationBadgeButtonPopupWidget-footer-buttons .oo-ui-buttonElement:last-child,
.mw-echo-ui-notificationItemWidget:last-child,
.mw-echo-ui-crossWikiUnreadFilterWidget {
    border-color: var(--contrast-3);
}

.mw-echo-ui-toggleReadCircleButtonWidget-circle-unread {
    background-color: var(--base-1);
    border-color: var(--contrast-3);
}

.mw-echo-ui-toggleReadCircleButtonWidget:hover .mw-echo-ui-toggleReadCircleButtonWidget-circle-unread {
    background-color: var(--base-0);
    border-color: var(--contrast-2);
}

.mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
    background: transparent;
}

.mw-echo-ui-pageNotificationsOptionWidget-label-count {
    background: var(--base-2);
    color: var(--contrast-2);
}

.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted {
    background-color: var(--highlight-contrast);
    color: var(--contrast-1);
}

.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-selected,
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-selected.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted,
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-pressed.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted {
    background-color: var(--highlight-progressive);
    color: var(--link);
}

.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-selected.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted,
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-pressed.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted {
    color: var(--contrast-1);
}
@keyframes unseen-fadeout-to-unread {
	from { background-color: var(--highlight-progressive) }
	to { background-color: var(--base-2) }
}
@keyframes unseen-fadeout-to-read {
	from { background-color: var(--highlight-progressive) }
	to { background-color: var(--base-1) }
}

/* WATCHLIST */

.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.mw-rcfilters-ui-filterMenuHeaderWidget-header,
.mw-rcfilters-ui-filterMenuSectionOptionWidget,
.mw-rcfilters-ui-menuSelectWidget-footer {
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title,
.mw-rcfilters-ui-filterMenuHeaderWidget-title,
.mw-rcfilters-ui-itemMenuOptionWidget-label-title,
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc,
.mw-rcfilters-ui-tagItemWidget-popup-content,
.mw-rcfilters-ui-savedLinksListWidget-placeholder.oo-ui-optionWidget .oo-ui-labelElement-label,
.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {
    color: var(--contrast-1);
}
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc,
.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {
    opacity: .6;
}

.mw-rcfilters-ui-filterTagMultiselectWidget-emptyFilters,
.mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget,
.mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label,
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-title, 
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-desc,
.mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-labelElement-label {
    color: var(--contrast-2);
} 
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget,
.mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk),
.mw-rcfilters-ui-datePopupWidget,
.mw-rcfilters-ui-watchlistTopSectionWidget-separator,
.mw-rcfilters-collapsed .mw-rcfilters-ui-filterTagMultiselectWidget {
    border-color: var(--contrast-3);
}
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {
    background: var(--base-2);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
    background: var(--base-1);
}

/* PREFERENCES */

.mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed, 
.mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout {
    border-color: var(--contrast-3);
}

.mw-prefs-buttons {
    background: var(--base-1);
    border-color: var(--contrast-3);
}

/* VE DEBUGGER */

.ve-ui-debugBar-dump > table,
.ve-ui-debugBar-commands-divider {
    border-color: var(--contrast-3);
}

.ve-ui-debugBar-dump th {
    color: var(--contrast-2);
    text-shadow: 0 1px 1px var(--base-0);
}

.ve-ui-debugBar-dump td {
    background: var(--base-1);
}

.ve-ui-debugBar-dump ol {
    color: var(--contrast-2);
}

.ve-ui-debugBar-dump li .ve-ui-debugBar-dump-element {
    background: var(--base-2);
}

.ve-ui-debugBar-dump li .ve-ui-debugBar-dump-element, 
.ve-ui-debugBar-dump li .ve-ui-debugBar-dump-char, 
.ve-ui-debugBar-dump li .ve-ui-debugBar-dump-achar {
    color: var(--contrast-1);
    text-shadow: 0 1px 1px var(--base-0);
}

.ve-ui-debugBar-filibuster {
    background: var(--base-2);
    border-color: var(--contrast-3);
}

.ve-ui-debugBar-transactions > ol > li {
    border-color: var(--base-1);
}

/* SIMPLE SEARCH */

.client-darkmode .mw-no-invert#p-search{
    filter: none;
}

#simpleSearch,
.client-darkmode #simpleSearch { 
    background: transparent;
    border: 0;
}
#simpleSearch #searchInput,
#searchform #searchInput { 
    background:var(--base-2); 
    border:1px solid var(--contrast-3);
}

#simpleSearch #searchInput:hover,
#simpleSearch #searchInput:active,
#searchform #searchInput:hover,
#searchform #searchInput:active { 
    border-color:var(--contrast-2);
}

#simpleSearch #searchInput:focus,
#searchform #searchInput:focus {
    border-color:var(--contrast-2);
    box-shadow: inset 0 0 0 1px var(--link);
    outline: 1px solid transparent;}

#simpleSearch #searchButton,
#simpleSearch #mw-searchButton{
    background: transparent url(/wiki/resources/lib/ooui/themes/wikimediaui/images/icons/search.svg) no-repeat center center;
    border: none;
    filter: var(--filter);
}

.suggestions, 
.suggestions .suggestions-results, 
.suggestions .suggestions-special { 
    color: var(--contrast-1); 
    background: var(--base-2); 
    border-color: var(--contrast-3);
}
.suggestions .suggestions-result, 
.suggestions-special .special-query {
    color: var(--contrast-1);
}
.suggestions-special .special-label {
    color: var(--contrast-1);
    opacity: .6;
}
.suggestions .suggestions-result-current{
    background: #36c;
    color: #fff;
}
.suggestions-result-current .special-label, 
.suggestions-result-current .special-query {
    color: #fff;
}

/* CREATE ACCOUNT */

#mw-createaccount-join{ 
    background-color: #3366cc;
    color: #fff;
    border-color: #3366cc;
}
#mw-createaccount-join:hover {
    background-color: #447ff5;
    border-color: #447ff5;
}
#mw-createaccount-join:active {
    background-color: #2a4b8d;
    color: #fff;
    border-color: #2a4b8d;
}

.mw-body-content .mw-number-text {
    color: var(--contrast-2);
}
.mw-body-content .mw-number-text h3 { 
	color: var(--contrast-1);
}

/* DOCUMENTATION */

.mw-parser-output .documentation, 
.mw-parser-output .documentation-metadata {
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.mw-parser-output .documentation-startbox {
    border-color: var(--contrast-3);
}

/* UNIVERSAL LANGUAGE SELECTOR */

#pt-uls .uls-trigger:before {
    padding-top: 0;
    filter: var(--filter);
}
.uls-menu, 
.skin-vector .uls-menu,
.uls-search,
.skin-vector .uls-search,
.uls-lcd,
#uls-settings-block,
.uls-font-item {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
} 
.uls-input-settings .uls-input-settings-inputmethods-list {
    background: transparent;
}
.uls-lcd-region-title,
.skin-vector .uls-lcd-region-title,
.uls-ui-languages p,
.uls-font-label,
.uls-font-label strong {
    color: var(--contrast-1);
}
.uls-input-settings-disable-info, 
.uls-input-settings-no-inputmethods {
    color: var(--contrast-2);
}
.uls-search-label,
#uls-settings-block > button,
.uls-languagefilter-clear,
.uls-icon-close {
    filter: var(--filter);
}
.uls-language-block > ul > li:hover {
    background: var(--highlight-progressive);
}
.uls-language-block a {
    color: var(--link);
}
.uls-language-block > ul > li:hover a {
    color: var(--link-hover);
}
.uls-filtersuggestion,
.uls-languagefilter {
    color: var(--contrast-1);
	background: var(--base-2);
	border: 1px solid var(--contrast-3);
    padding: 0.35em;
    border-radius: 2px;
}
.uls-icon-back,
.uls-sub-panel,
.uls-font-item:first-child {
    border-color: var(--contrast-3);
}

#content-font-selector {
    padding: 0.35em;
}

.language-settings-buttons {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
} 
#languagesettings-settings-panel,
.uls-language-settings-close-block {
    background: var(--base-2);
    color: var(--contrast-1);
}
.languagesettings-menu .menu-section.display-settings-block,
.languagesettings-menu .menu-section.input-settings-block {
    position:relative;
    background: 0;
}
.languagesettings-menu .menu-section.display-settings-block:before,
.languagesettings-menu .menu-section.input-settings-block:before {
    display:inline-block;
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    left: 15px;
    top: 8px;
    filter: var(--filter);
}
.languagesettings-menu .menu-section.display-settings-block:before {
    background: url(/wiki/extensions/UniversalLanguageSelector/resources/images/display.svg) no-repeat center center;
}
.languagesettings-menu .menu-section.input-settings-block:before {
    background: url(/wiki/extensions/UniversalLanguageSelector/resources/images/input.svg) no-repeat center center;
}
.languagesettings-menu .menu-section.active {
    background: var(--base-2);
    border-color: #36c;
    color: var(--contrast-1);
}
.languagesettings-menu h1,
.languagesettings-menu .menu-section,
#languagesettings-settings-panel h3,
#languagesettings-settings-panel h4 {
    color: var(--contrast-1);
}
.languagesettings-menu .menu-section:hover {
    background: var(--highlight-contrast);
}
.languagesettings-menu .menu-section .settings-text {
    color: var(--contrast-1);
    opacity: .6;
}
.languagesettings-menu .menu-section:hover .settings-text {
    color: var(--contrast-1);
    opacity: 1;
}

.imeselector {
    background-color: var(--base-1);
}
.imeselector:hover {
    background-color: var(--base-2);
}
.imeselector-menu {
    background: var(--base-2);
    border-color: var(--contrast-3);
    color: var(--contrast-1);
}
.imeselector-menu:after {
    border-bottom-color: var(--base-2);
    border-top-color: var(--contrast-3);
}
.imeselector-menu:before {
    border-bottom-color: var(--contrast-3);
}
.imeselector-menu.ime-position-top:after {
    border-top-color: var(--base-2);
}
.imeselector-menu.ime-position-top:before {
    border-top-color: var(--contrast-3);
}
.imeselector a, 
.ime-disable,
.imeselector-menu .selectable-row-item {
    color: var(--contrast-1);
}
.uls-ime-menu-settings-item {
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.uls-ime-disable-link {
    filter: var(--filter)
}
.imeselector-menu .selectable-row:hover {
    background: var(--highlight-contrast);
}
.uls-ime-more-settings-link {
    border-color: var(--contrast-3);
}
.ime-list-title, 
.ime-lang-title {
    border-color: var(--link-hover);
    color: var(--link-hover);
}

.uls-empty-state .uls-empty-state__header, 
.uls-empty-state .uls-empty-state__desc {
    color: var(--contrast-2);
}

/* TRANSLATE */

.mw-pt-translate-header {
	border:0;
}
.ext-translate-language-selector .ext-translate-language-icon,
.ext-translate-language-selector .ext-translate-language-selector-expand {
    filter: var(--filter);
}
.tux-messagetable-loader {
    background: var(--base-2);
    color: var(--contrast-1);
    box-shadow: none;
}
.tux-editor-header,
.tux-breadcrumb,
.tux-message-selector label,
.tux-empty-list-guide {
    color: var(--contrast-1);
}
.tux-messagetable-header,
.tux-messagetable-header.floating {
    border-color: var(--contrast-3);
}
.tux-messagelist {
    background: transparent;
    color: var(--contrast-1);
}
.tux-statsbar {
    background-color: var(--contrast-3);
}
.tux-statsbar-info {
    color: var(--contrast-2);
}
.tux-breadcrumb__item--aggregate,
.tux-message-selector li.selected a {
    color: var(--link);
}
.tux-message-selector .more ul {
    background: var(--base-1);
    border-color: var(--contrast-3);
}
.tux-message-filter-box {
    border-color: var(--contrast-3);
}

.tux-message-item,
.ext-translate-container .tux-messagelist .tux-message-pagemode, 
.ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-pagemode:first-child .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-pagemode:last-child .tux-message-item-compact {
    background: transparent;
    border-color: var(--contrast-3);
}
.ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact:hover,
.tux-message-item:hover,
.tux-message-item.translated, 
.tux-message-item.translated:hover, 
.tux-message-item.proofread, 
.tux-message-item.proofread:hover,
.ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact:hover {
    background: var(--highlight-contrast);
}
.tux-messagelist .tux-message-pagemode .tux-pagemode-source,
.tux-messagelist .tux-message-pagemode .tux-pagemode-translation {
    color: var(--contrast-1);
}

.tux-message-editor,
.tux-message-editor .editcolumn,
.grid .tux-message-editor .infocolumn-block{
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.tux-message-editor__caret:before {
    border-right-color: var(--contrast-3);
}
.tux-message-editor__caret:after {
    border-right-color: var(--base-2);
}

.grid .tux-message-editor .messagekey {
    color: var(--contrast-1);
}
.tux-message-editor textarea,
.tux-editor-editsummary-block input {
    border-color: var(--contrast-3);
}
.tux-message-editor .shortcutinfo {
    color: var(--contrast-2);
}
.tux-editor-editsummary-block input:disabled {
    background: var(--contrast-3);
}
.ext-translate-container .tux-messagelist .tux-message-proofread {
    background: transparent;
}
.ext-translate-container .tux-messagelist .tux-message-proofread.own-translation, 
.ext-translate-container .tux-messagelist .tux-message-proofread.own-translation:hover {
    background: var(--highlight-contrast);
}
.ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-proofread:first-child .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-proofread:last-child .tux-message-item-compact {
    background: transparent;
    border-color: var(--contrast-3);
}
.tux-messagelist .tux-message-proofread .tux-proofread-source,
.tux-messagelist .tux-message-proofread .tux-proofread-translation {
    color: var(--contrast-1);
}

.tux-action-bar,
.tux-action-bar.floating {
    background: var(--base-1);
    border-color: var(--contrast-3);
    box-shadow: none;
}
.tux-action-bar button {
    background: var(--base-2);
    border-color: var(--contrast-3);
}
.tux-action-bar button:hover {
    background: var(--highlight-contrast);
}
.tux-action-bar button:active, 
.tux-action-bar button.down {
    background: #101016;
}
.tux-view-switcher button:before,
.tux-proofread-action,
.grid .tux-message-editor .close,
.tux-message-editor .editor-expand,
.tux-message-editor .editor-contract {
    filter: var(--filter);
}
.tux-view-switcher button.down:before {
    filter: none;
}
.group-warning, 
.tux-notice {
    background-color: rgb(255 148 32 / 45%);
}

.mw-sp-translate-edit-fields fieldset {
    border-color: var(--contrast-3);
}
.mw-sp-translate-message-documentation {
    background: var(--base-0);
}
.mw-sp-translate-edit-definition {
    background: var(--base-2);
}

.mw-pt-languages {
    background: var(--base-2);
    border-color: var(--contrast-3);
    border-radius: 3px;
    box-shadow: var(--box-shadow);
    overflow: hidden;
}
.mw-pt-languages .mw-pt-languages-label {
    background: var(--highlight-contrast);
}
Anonymous

Search

MediaWiki:UITest.css: Difference between revisions

Namespaces

More

Page actions

Latest revision as of 05:35, 4 March 2023

Navigation

Navigation

Characters

Skills

Universe

Features

Additional

Links

Assorted

Wiki tools

Wiki tools

Anonymous

Search

MediaWiki:UITest.css: Difference between revisions

Latest revision as of 05:35, 4 March 2023

Navigation

Wiki tools

Page tools
