MediaWiki:Common.css
Jump to navigation
Jump to search
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all themes */
/* Imported fonts, icons etc */
/* Multi-font import from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Open+Sans:ital,wght@0,600;1,600&family=Source+Code+Pro:wght@500&display=block');
/* -- WARNING -- This is variable heavy (with a lot of redundancy) until styling is settled (and possible themes added)*/
:root {
/* BEGIN -- Sheltered 2 theme variables */
--theme-body-background-image-full: url(/images/0/0f/Site-background-dark.webp);
--theme-logo-image-full: url(/images/e/e6/Site-logo.png?11bb4);
/* -- Page / Article content */
--theme-primary-background-color: #000;
--theme-primary-background-color--rgb: 0, 0, 0;
--theme-secondary-background-color: #404040;
--theme-secondary-background-color--rgb: 64, 64, 64;
--theme-body-header-letter-spacing: .035em;
--theme-body-header-text-color: var(--theme-text-highlight-color--general);
--theme-body-header-text-color--rgb: var(--theme-text-highlight-color--general--rgb);
--theme-body-header-text-font: 'Bebas Neue', sans-serif;
--theme-body-header-text-size: 1.5em;
--theme-body-letter-spacing: .02em;
--theme-body-line-height: 1.75;
--theme-body-text-font: 'Open Sans', sans-serif;
--theme-body-text-size: .875em;
--theme-body-secondary-text-style: italic;
--theme-header-font: var(--theme-body-header-text-size) var(--theme-body-header-text-font);
--theme-link-color--hover: #aeb6cb;
--theme-link-color: #8590b0;
--theme-link-color--rgb: 133, 144, 176;
--theme-page-background-color: rgba(var(--theme-primary-background-color--rgb), .75);
--theme-primary-text-color: #e6e6e6;
--theme-primary-text-color--rgb: 230, 230, 230;
--theme-primary-text-color--darker: #c0c0c0;
--theme-primary-text-color--darker--rgb: 192, 192, 192;
--theme-primary-text-color-note: var(--theme-primary-text-color--darker);
--theme-scrollbar-color: grey var(--theme-primary-background-color);
--theme-scrollbar-width: thin;
--theme-text-highlight-color--bad: #CC2F2F;
--theme-text-highlight-color--bad--rgb: 204, 47, 47;
--theme-text-highlight-color--bad--darker: #ab2a2a;
--theme-text-highlight-color--bad--darker--rgb: 171, 42, 42;
--theme-text-highlight-color--bad--lighter: #ff640b;
--theme-text-highlight-color--bad--lighter--rgb: 255, 100, 11;
--theme-text-highlight-color--general: #ffbf0b;
--theme-text-highlight-color--general--rgb: 255, 191, 11;
--theme-text-highlight-color--general--darker: #eb980a;
--theme-text-highlight-color--general--darker--rgb: 235, 152, 10;
--theme-text-highlight-color--general--lighter: #fdc83f;
--theme-text-highlight-color--general--lighter--rgb: 253, 200, 63;
--theme-text-highlight-color--good: #189300;
--theme-text-highlight-color--good--rgb: 24, 147, 0;
--theme-text-highlight-color--good--lighter: #5abc62;
--theme-text-highlight-color--good--lighter--rgb: 90, 188, 98;
--theme-text-highlight-color--good--darker: #0c6304;
--theme-text-highlight-color--good--darker--rgb: 12, 99, 4;
--theme-text-disabled-color: #808080;
--theme-text-disabled-color--rgb: 128, 128, 128;
--theme-text-color-red: var(--theme-text-highlight-color--bad);
--theme-text-color-green: var(--theme-text-highlight-color--good);
--theme-text-color-note: var(--theme-text-color--darker);
--theme-primary-border-color: #808080;
--theme-primary-border-color--rgb: 128, 128, 128;
--theme-primary-border-color--hover: var(--theme-text-highlight-color--general);
--theme-primary-border-color--hover--rgb: var(--theme-text-highlight-color--general--rgb);
--theme-secondary-border-color: #111;
--theme-secondary-border-color--rgb: 17, 17, 17;
--theme-secondary-border-color--hover: var(--theme-text-highlight-color--general);
--theme-secondary-border-color--hover--rgb: var(--theme-text-highlight-color--general--rgb);
/* -- ToC -- */
--theme-toc-text-color: var(--theme-primary-text-color);
--theme-toc-number-color: var(--theme-primary-text-color);
--theme-toc-background-color: var(--theme-primary-background-color);
--theme-toc-text-hover-color: var(--theme-body-header-text-color);
--theme-toc-font: var(--sidebar-body-font);
/* -- Category links */
--theme-category-links-font: var(--theme-category-links-text-size) var(--theme-category-links-text-font);
--theme-category-links-text-font: var(--theme-body-text-font);
--theme-category-links-text-size: calc(1.2 * var(--theme-body-text-size));
/* -- Footer */
--theme-footer-text-color: #d3d3d3;
--theme-header-line-primary-color: #b4b4b4;
--theme-header-line-gradient-underline: linear-gradient(to right, rgba(180, 180, 180, 0) 0, var(--theme-header-line-primary-color) 33%, var(--theme-header-line-primary-color) 66%, rgba(180, 180, 180, 0) 100%);
--theme-header-line-gradient-active-underline: linear-gradient(to right, rgba(var(--theme-body-header-text-color--rgb), 0) 0, var(--theme-body-header-text-color) 50%, rgba(var(--theme-body-header-text-color--rgb), 0) 100%);
--theme-header-line-gradient-sideline: linear-gradient(to bottom, rgba(180, 180, 180, 0) 0, var(--theme-header-line-primary-color) 33%, var(--theme-header-line-primary-color) 66%, rgba(180, 180, 180, 0) 100%);
--theme-header-underline-size: 100% 2px;
--theme-header-sideline-size: 2px 100%;
--theme-header-sideline-position: 2% 90%;
--theme-header-underline-position: center 95%;
--theme-header-underline: var(--theme-header-line-gradient-underline) var(--theme-header-underline-position) / var(--theme-header-underline-size) no-repeat;
--theme-header-sideline: var(--theme-header-line-gradient-sideline) var(--theme-header-sideline-position) / var(--theme-header-sideline-size) no-repeat;
--theme-header-underline-active: var(--theme-header-line-gradient-active-underline) var(--theme-header-underline-position) / var(--theme-header-underline-size) no-repeat;
/* -- MediaWiki message boxes */
--theme-message-box-background-color: var(--theme-primary-background-color);
--theme-message-box-text-color: var(--theme-body-header-text-color);
/* -- Icon color filters */
--theme-icon-filter-link-color: invert(60%) sepia(8%) saturate(1056%) hue-rotate(187deg) brightness(94%) contrast(87%);
--theme-icon-filter-content-color: invert(92%) sepia(0%) saturate(1742%) hue-rotate(174deg) brightness(99%) contrast(99%);
--theme-icon-filter-selected-color: invert(88%) sepia(41%) saturate(6932%) hue-rotate(351deg) brightness(100%) contrast(104%);
/* END -- Sheltered 2 theme variables */
/* BEGIN -- Global layout / style variables */
/* -- Top navigation */
--navigation-tab-background: var(--theme-page-background-color);
--navigation-tab-font: var(--navigation-tab-text-size) var(--navigation-tab-text-font);
--navigation-tab-height: calc(var(--navigation-tab-text-size) + (3 * var(--navigation-tab-padding-y)));
--navigation-tab-padding-x: .5em;
--navigation-tab-padding-y: .25em;
--navigation-tab-padding: var(--navigation-tab-padding-y) var(--navigation-tab-padding-x);
--navigation-tab-text-color: var(--theme-primary-text-color);
--navigation-tab-text-font: var(--theme-body-header-text-font);
--navigation-tab-text-letter-spacing: var(--theme-body-header-letter-spacing);
--navigation-tab-text-size: 1.25em;
/* -- Search box */
--search-box-background: var(--theme-page-background-color);
/* -- Sidebar navigation */
--sidebar-background: var(--theme-page-background-color);
--sidebar-body-font: var(--sidebar-body-text-size) var(--theme-body-text-font);
--sidebar-body-line-height: 1.2;
--sidebar-body-text-font: var(--theme-body-text-font);
--sidebar-body-text-size: var(--theme-body-text-size);
--sidebar-header-font: var(--sidebar-header-text-size) var(--sidebar-header-text-font);
--sidebar-header-letter-spacing: .1em;
--sidebar-header-text-color: var(--theme-body-header-text-color);
--sidebar-header-text-font: var(--theme-body-header-text-font);
--sidebar-header-text-size: calc(1.25 * var(--sidebar-body-text-size));
/* -- Category links */
--category-links-font: var(--category-links-text-size) var(--category-links-text-font);
--category-links-text-font: var(--theme-body-text-font);
--category-links-text-size: calc(1.1 * var(--theme-body-text-size));
/* -- Image Gallery */
--image-gallery-font: var(--theme-body-header-text-size) var(--theme-body-header-text-font);
--image-gallery-text-color: var(--theme-body-header-text-color);
/* -- Footer */
--footer-font: .9em var(--theme-body-text-font);
--footer-padding: .5em .5em .5em .5em;
/* END -- Global layout / style variables */
/* BEGIN -- Global custom icons */
/* Use SVG and 'fill' to be removed for live filtering */
/* -- External Link */
--icon-external-link: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><path fill-rule='evenodd' d='M11 1H6l2 2 .3.3-4 4 .6.7 4-4H9l2 2V1ZM2 2h2v1H2v7h7V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1Z' clip-rule='evenodd'/></svg>");
/* -- Open / Close section/tab icon */
--icon-expand-section: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><path d='m11.05 3.996-.965-1.053-4.035 3.86-3.947-3.86L1.05 3.996l5 5 5-5'/></svg>");
}
/* END -- Global custom icons */
/* Set scrollbar colour to dark -- may remove this later by fixing elements in desktop with a custom scrollbar */
html {
color-scheme: dark;
}
/* BEGIN -- Primary body/page styling */
#p-logo .mw-wiki-logo {
background-size: contain;
}
body {
background: var(--theme-body-background-image-full);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
font-family: var(--theme-body-text-font);
color: var(--theme-primary-text-color);
}
.mw-body {
background: var(--theme-page-background-color);
color: var(--theme-primary-text-color);
scrollbar-color: var(--theme-scrollbar-color);
border: 1px solid var(--theme-primary-border-color);
}
.mw-body .mw-body-content .mw-parser-output p {
line-height: var(--theme-body-line-height);
}
/* Force link colors regardless of state */
/* Optimise the selector to cover a wider range */
.mw-body a,
.mw-body a:visited,
.mw-body a.external,
.mw-body a.external:visited,
.mw-body a.extiw,
.mw-body a.extiw:visited {
color: var(--theme-link-color);
}
.mw-parser-output a.new {
color: var(--theme-text-highlight-color--bad);
text-decoration: underline;
text-decoration-color: var(--theme-text-highlight-color--bad);
text-decoration-style: dashed;
}
/* Content subdirectory under article header */
.mw-body .content-body #contentSub {
font-size: 1em;
}
pre,
code,
.mw-code {
background: unset;
color: inherit;
}
/* Hacked in stylable 'external link icon' */
/* Remove existing 'background image to the side' */
.mw-parser-output a.extiw,
.mw-parser-output a.external {
background: unset;
padding: 0;
}
/* Add new filterable background-image ':after' to filter separately from the text */
.mw-parser-output a.extiw::after,
.mw-parser-output a.external::after {
content: '';
display: inline-block;
height: 1em;
width: 1em;
background-image: var(--icon-external-link);
background-position: center right;
background-repeat: no-repeat;
filter: var(--theme-icon-filter-link-color);
}
#catlinks {
background: unset;
font: var(--theme-category-links-font);
}
:focus {
outline-color: var(--theme-border-highlight-color);
}
#toc.toc {
background-color: var(--theme-toc-background-color);
font-family: var(--theme-toc-font-family);
font-size: var(--theme-toc-font-size);
}
#toc.toc a {
color: var(--theme-toc-text-color);
}
#toc.toc a:hover {
color: var(--theme-toc-text-hover-color);
text-decoration: none;
}
#toc.toc .tocnumber {
color: inherit;
}
#toc.toc h2#mw-toc-heading {
font-size: var(--theme-body-header-text-size);
background: var(--theme-header-underline);
}
#toc.toc .toctogglespan {
font-size: calc(var(--theme-body-header-text-size) * 0.8);
float: right;
}
#toc.toc .toctogglespan label {
color: var(--theme-link-color);
}
button, input, optgroup, select, textarea {
background-color: var(--theme-primary-background-color);
color: var(--theme-primary-text-color);
}
option:hover {
background-color: unset;
color: var(--theme-body-header-text-color);
}
/* Top navigation */
#mw-head-base {
margin-bottom: .5em
}
/* Strip hover underline on links where we want the gradient line */
.vector-menu-tabs a:hover,
.vector-menu-portal a:hover,
.vector-menu-content a:hover {
text-decoration: none;
}
.vector-menu-tabs,
.vector-menu-dropdown,
.vector-menu-dropdown .vector-menu-content {
background: var(--navigation-tab-background);
border: unset;
}
.vector-menu-tabs,
.vector-menu-tabs li,
.vector-menu-tabs .selected,
.vector-menu-dropdown {
height: var(--navigation-tab-height);
line-height: var(--theme-body-header-text-size);
}
.vector-menu-tabs li a,
.vector-menu-dropdown .vector-menu-heading,
.vector-menu-dropdown .mw-list-item a {
font: var(--navigation-tab-font);
letter-spacing: var(--navigation-tab-text-letter-spacing);
padding: var(--navigation-tab-padding);
color: var(--navigation-tab-text-color);
background: unset;
height: inherit;
text-decoration: unset;
}
.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited,
.vector-menu-tabs a:hover,
.vector-menu-tabs a:visited:hover,
.vector-menu-dropdown .vector-menu-heading-label:hover,
.vector-menu-dropdown .vector-menu-content li a:hover {
color: var(--theme-body-header-text-color);
}
#mw-page-base {
background: unset;
}
.vector-menu-tabs li,
.vector-menu-tabs .selected,
#mw-head .vector-menu-dropdown .vector-menu-heading {
background: unset;
}
/* Add gradient side-line to replicate game menu */
#mw-navigation .vector-menu-tabs li.selected,
#mw-navigation .vector-menu-tabs li:hover:not(.mw-watchlink),
#mw-navigation .vector-menu-dropdown .vector-menu-content li:hover {
background: var(--theme-header-sideline);
}
.vector-menu-dropdown .mw-list-item a:not(.mw-ui-icon) {
font-size: calc(var(--navigation-tab-text-size) * .9);
padding-left: 1em;
}
/* Add quality star / hollow quality star as watch 1icons */
.vector-menu-tabs .mw-watchlink.icon {
width: var(--navigation-tab-height);
height: var(--navigation-tab-height);
}
.vector-menu-tabs .mw-watchlink.icon a {
padding: 0;
width: 100%;
height: 100%;
}
.vector-menu-tabs .mw-watchlink.icon a:before {
position: relative;
top: auto;
left: middle;
height: var(--navigation-tab-height);
}
.vector-menu-tabs #ca-watch.icon a:before,
.vector-menu-tabs #ca-unwatch.icon a:hover:before,
.vector-menu-tabs #ca-watch.icon a:focus:before {
content: '★';
color: #000;
font-size: 1em;
-webkit-text-stroke-width: .025em;
-webkit-text-stroke-color: var(--pi-secondary-text-color);
background: unset;
}
.vector-menu-tabs #ca-unwatch.icon a:before,
.vector-menu-tabs #ca-watch.icon a:hover:before,
.vector-menu-tabs #ca-unwatch.icon a:focus:before {
content: '★';
color: var(--theme-body-header-text-color);
font-size: 1em;
background: unset;
}
.vector-menu-tabs #ca-unwatch.icon .loading:before,
.vector-menu-tabs #ca-watch.icon .loading:before {
animation: rotate 700ms infinite linear;
outline: 0;
cursor: default;
pointer-events: none;
transform-origin: 40% 40%
/* Weird number because of odd formatting, maybe look into this */
}
/* Clear potential ring-border around the dropdown trigger on click */
.vector-menu-dropdown .vector-menu-heading:focus-visible {
outline: unset;
}
/* Hacked in stylable 'up down' dropdown expansion icon */
#mw-head .vector-menu-dropdown .vector-menu-heading:after {
/* content: '\2228'; */
content: '';
background-image: var(--icon-expand-section);
filter: var(--theme-icon-filter-content-color);
background-size: 1em 1em;
background-repeat: no-repeat;
background-position: center;
margin-left: .25em;
}
.vector-menu-checkbox:checked+.vector-menu-heading:after {
content: '';
background-image: var(--icon-expand-section);
filter: var(--theme-icon-filter-selected-color);
background-size: 1em 1em;
background-repeat: no-repeat;
background-position: center;
margin-left: .25em;
}
/* Search box */
.vector-search-box form {
margin: 0 .125em;
}
.vector-search-box-input {
background: var(--search-box-background);
color: var(--theme-primary-text-color);
font: var(--theme-font);
height: var(--navigation-tab-height);
}
.vector-search-box-input:focus,
.vector-search-box-inner:hover .vector-search-box-input:focus {
border-color: var(--theme-border-highlight-color);
box-shadow: inset 0 0 0 1px var(--theme-border-highlight-color);
}
.searchButton[name=go] {
filter: invert(1);
}
/* Sidebar Navigation */
#t-print {
display: none;
}
#mw-panel {
background: var(--sidebar-background);
margin-top: -2.5em;
}
.vector-menu-portal .vector-menu-content {
margin-left: unset;
}
.vector-menu-portal .vector-menu-content li {
padding: .125em 0 .125em .5em;
}
.vector-menu-portal .vector-menu-content li:hover {
background: var(--theme-header-sideline);
}
.vector-menu-portal .vector-menu-heading {
font: var(--sidebar-header-font);
color: var(--sidebar-header-text-color);
letter-spacing: var(--sidebar-header-letter-spacing);
text-align: center;
background: var(--theme-header-underline);
}
.vector-menu-portal .vector-menu-content li {
font: var(--sidebar-body-font);
}
.vector-menu-portal .vector-menu-content li a,
.vector-menu-portal .vector-menu-content li a:visited {
color: var(--theme-primary-text-color);
}
.vector-menu-portal .vector-menu-content li a:hover,
.vector-menu-portal .vector-menu-content li a:visited:hover {
color: var(--sidebar-header-text-color);
}
/* Adjust header sizes */
.mw-body h1 {
font-size: calc(var(--theme-body-header-text-size) * 1.3);
}
.mw-body-content h2 {
font-size: calc(var(--theme-body-header-text-size) * 1.2);
}
.mw-body-content h3 {
font-size: calc(var(--theme-body-header-text-size) * 1.1);
}
.mw-body-content h4 {
font-size: calc(var(--theme-body-header-text-size) * 1);
}
.mw-body-content h5 {
font-size: calc(var(--theme-body-header-text-size) * .8);
}
.mw-body-content h2 > span:first-child,
.mw-body-content h3 > span:first-child,
.mw-body-content h4 > span:first-child,
.mw-body-content h5 > span:first-child {
/* 'Heading' underlines */
background: var(--theme-header-underline);
}
/* Unbold and standardise headers */
.mw-body h1,
.mw-body-content h2,
.mw-body-content h2:not(.pi-data-label):not(.pi-header):not(.pi-title),
.mw-body-content h3:not(.pi-data-label):not(.pi-header),
.mw-body-content h4,
.mw-body-content h5 {
font-family: var(--theme-body-header-text-font);
color: var(--theme-body-header-text-color);
letter-spacing: var(--theme-body-header-letter-spacing);
text-transform: uppercase;
font-weight: normal;
}
h2 .mw-editsection,
h3 .mw-editsection,
h4 .mw-editsection,
h5 .mw-editsection {
text-transform: uppercase;
padding-right: 1em;
background: none;
}
/* Image gallery */
.gallery .gallerybox .thumb,
.gallery .gallerybox .gallerytext pre {
background-color: unset;
font: var(--image-gallery-font);
}
.gallery .gallerybox .gallerytext a,
.gallery .gallerybox .gallerytext a:visited {
color: var(--image-gallery-text-color);
align-content: center;
}
.mw-message-box {
background-color: var(--theme-message-box-background-color);
color: var(--theme-message-box-text-color);
}
/* Tables */
table {
white-space: normal;
}
/* Block Quotes */
blockquote.pull-quote {
font-style: italic;
background: var(--theme-header-sideline);
border: 1px solid var(--theme-primary-border-color);
}
/* Definition Lists */
div:not(.mw-changeslist-legend) > div > dl > dt {
font: var(--theme-header-font);
color: var(--theme-body-header-text-color);
background: var(--theme-header-underline);
display: inline;
letter-spacing: var(--theme-body-header-letter-spacing);
}
/* Category page styling */
/* .mw-category .mw-category-group h3 {
display: inline;
background: var(--theme-header-underline);
} */
/* Footer Styling -- Thanks to Terraria wiki for this :) */
#footer {
padding: var(--footer-padding);
position: relative;
/* grid */
display: grid;
grid-template-columns: [l] 1fr 0fr [r];
grid-template-rows: [t] auto auto [b] auto;
z-index: 0;
/* covered by content */
}
#footer a {
color: var(--theme-link-color);
}
#footer a:hover {
color: var(--theme-link-color-hover);
}
#footer ul li {
color: var(--theme-footer-text-color);
font: var(--footer-font);
line-height: inherit;
padding: 0;
}
#footer #footer-info {
display: contents;
}
#footer #footer-icons {
grid-column: span 1/r;
grid-row: t/b;
place-self: end;
}
#footer #footer-info-lastmod {
grid-column: l/span 1;
grid-row: t/span 1;
place-self: start;
margin-bottom: 1em;
}
#footer #footer-info-copyright {
grid-column: l/span 1;
grid-row: span 1/b;
place-self: end stretch;
position: relative;
padding-right: 100px;
}
#footer #footer-info-copyright img {
position: absolute;
right: 0;
bottom: 0;
height: 31px;
width: auto;
}
#footer #footer-places {
grid-column: l/span 1;
grid-row: b/span 1;
}
/* END -- Primary body/page styling */
.mw-plusminus-pos {
color: var(--theme-text-highlight-color--good);
}
.mw-plusminus-neg {
color: var(--theme-text-highlight-color--bad);
}
/* BEGIN -- Article & Code Editor styling */
:root {
/* Editor variables -- Colours are temporary until friendlier shades are found */
--diff-context-color: var(--theme-primary-text-color);
--diff-addedline-background: var(--theme-text-highlight-color--good);
--diff-addedline-border: var(--theme-text-highlight-color--good);
--diff-deletedline-background: var(--theme-text-highlight-color--bad);
--diff-deletedline-border: var(--theme-text-highlight-color--bad);
--editor-text-color: var(--theme-primary-text-color);
--editor-text-size: 1.05em;
--editor-background-color: var(--theme-primary-background-color);
--editor-active-line-color: var(--theme-primary-background-color);
--editor-active-line-background: var(--theme-text-highlight-color--general);
--editor-options-color: var(--theme-primary-text-color);
--editor-selected-text-color: var(--editor-header-text-color);
--editor-header-font: var(--theme-header-font);
--editor-header-text-color: var(--theme-body-header-text-color);
}
/* Editor styling */
.diff-context {
background: unset;
color: var(--diff-context-color);
}
.diff-addedline .diffchange {
background: var(--diff-addedline-background);
}
.diff-addedline {
border-color: var(--diff-addedline-border);
}
.diff-deletedline .diffchange {
background: var(--diff-deletedline-background);
}
.diff-deletedline {
border-color: var(--diff-deletedline-border);
}
.wikiEditor-ui-toolbar {
background: unset;
}
.ace-tm,
.ace-tm .ace_gutter,
.codeEditor-status,
.wikiEditor-ui,
.CodeMirror {
background-color: var(--editor-background-color);
font-size: var(--editor-text-size);
}
#msupload-div,
#msupload-dropzone,
.ace-tm,
.wikiEditor-ui textarea,
.CodeMirror-code {
background: unset;
color: var(--editor-text-color);
}
#msupload-dropzone {
font: var(--editor-header-font);
color: var(--editor-header-text-color);
}
#msupload-select {
filter: brightness(0) invert(90);
}
#msupload-select:hover {
filter: brightness(0) var(--ooui--icon-progressive-filter);
}
.wikiEditor-ui-toolbar .tabs span.tab a,
.wikiEditor-ui-toolbar .tabs span.tab a.current,
.wikiEditor-ui-toolbar .group .tool-select .label,
.wikiEditor-ui-toolbar .group .label,
.wikiEditor-ui-toolbar .page-table th {
color: inherit;
text-transform: uppercase;
}
.wikiEditor-ui-toolbar .tabs span.tab a.current {
color: var(--editor-header-text-color);
}
.wikiEditor-ui-toolbar .tabs span.tab a:hover,
.wikiEditor-ui-toolbar .tool-select:hover {
color: var(--editor-header-text-color);
text-decoration: none;
}
/* Pointer arrow for closed / opened tab */
/* -- Add in-game icon for this later */
.wikiEditor-ui-toolbar .tabs span.tab a:before {
background-image: var(--icon-expand-section);
filter: var(--theme-icon-filter-content-color);
}
.wikiEditor-ui-toolbar .tabs span.tab a.current:before,
.wikiEditor-ui-toolbar .tabs span.tab a:hover:before {
background-image: var(--icon-expand-section);
filter: var(--theme-icon-filter-selected-color);
}
.wikiEditor-ui-toolbar .booklet>.index>.current,
.wikiEditor-ui-toolbar .group .tool-select .options,
.wikiEditor-ui-toolbar .group .tool-select .menu .options .option:hover {
background-color: var(--editor-background-color);
color: var(--editor-header-text-color);
}
.wikiEditor-ui-toolbar .page-characters div span,
.wikiEditor-ui-toolbar .page-table td,
.wikiEditor-ui-toolbar .group .tool-select .options .option {
color: var(--editor-text-color);
}
.wikiEditor-ui-toolbar .page-characters div span:hover,
.wikiEditor-ui-toolbar .booklet>.index>div:hover {
background-color: unset;
color: var(--editor-selected-text-color);
}
.ace-tm .ace_gutter-active-line {
background-color: var(--editor-active-line-background);
color: var(--editor-active-line-color);
}
.ace-tm .ace_print-margin {
background: grey;
}
/* -- ?action=edit -- */
/* Override styling of: https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.action/mediawiki.action.edit.styles.less */
.editOptions {
background-color: var(--ooui--messagewidget-notice-background-color);
color: var(--theme-primary-text-color);
border-color: var(--ooui--messagewidget-notice-border-color);
}
/* -- ?action=history -- */
/* Override styling of: https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.action/mediawiki.action.history.styles.less */
#pagehistory li.selected {
background-color: transparent;
color: inherit;
}
.updatedmarker {
background-color: var(--oouihelper--yellow);
}
/* -- changeslist -- */
/* Special:Watchlist, Special:RecentChanges, etc. */
/* Override styling of: https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.special.changeslist/default.less */
/* Colored byte change numbers */
.mw-plusminus-pos {
color: var(--theme-text-color-green);
}
.mw-plusminus-neg {
color: var(--theme-text-color-red);
}
.mw-plusminus-null {
color: var(--theme-text-color-note);
}
/* To do:
- Button hover colour
- Check boxes
*/
#mw-indicator-mw-helplink a:before {
content: '';
display: inline-block;
height: 20px;
padding-left: 25px;
line-height: 20px;
background-image: url(/resources/src/mediawiki.helplink/images/helpNotice.svg?46d34);
background-position: left center;
background-repeat: no-repeat;
filter: invert(1);
}
#mw-indicator-mw-helplink a {
background: none;
}
/* -- HTMLForm -- */
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {
background-color: var(--oouihelper--textinput-background-lighter);
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
background-color: var(--oouihelper--textinput-background);
}
/* ace related text colors
.ace_support
.ace_variable
.ace_constant
.ace_paren
.ace_punctuation
.ace_string
.ace_comment
*/
div.mw-highlight {
background-color: #000;
}
.mw-content-ltr.mw-highlight-lines pre,
.mw-content-ltr.content .mw-highlight-lines pre {
box-shadow: inset 2.75em 0 0 #000;
}
.mw-content-ltr.mw-highlight .linenos {
color: var(--theme-primary-text-color);
}
/* preformatted text colors
.mw-highlight
.nv (variables?)
.nd (:before :after :hover etc)
.nf
.nc (specifiers)
.c (comments)
.p (puntuation)
.s1
.n (invalids)
-- Properties & Values --
.k (properties)
.kc (property word values)
.kt (unit name - % px em etc)
.mi (integers)
.mf (floats)
.mh (#numbers)
*/
/* CodeMirror syntax colours */
.cm-mw-link-pagename, .cm-mw-link-bracket, .cm-mw-link-delimiter, .cm-mw-extlink, .cm-mw-free-extlink {
color: var(--theme-link-color);
}
/* Portable Infobox debugger output */
.pi-error-info.pi-error-info, .pi-debug.pi-debug {
background-color: var(--pi-header-background);
}
.pi-error-info.pi-error-info {
color: var(--theme-text-highlight-color--bad);
border-color: var(--theme-text-highlight-color--bad);
border-style: solid;
}
/* END -- Article & Code Editor styling */
/* BEGIN -- Portable Infobox styling */
/* Portable Infobox Variables */
:root {
--pi-background: unset;
--pi-body-text-color: var(--theme-primary-text-color);
--pi-body-text-color--rgb: var(--theme-primary-text-color--rgb);
--pi-body-text-font: var(--theme-body-text-font);
--pi-body-text-size: var(--theme-body-text-size);
--pi-body-text-style: var(--theme-body-secondary-text-style);
--pi-border-color: var(--theme-primary-border-color);
--pi-border-color--rgb: var(--theme-primary-border-color--rgb);
--pi-border-style: solid;
--pi-border-width: 1px;
--pi-border: var(--pi-border-width) var(--pi-border-style) var(--pi-border-color);
--pi-border-divider-width: 3px;
--pi-header-background: #000;
--pi-header-font: var(--pi-header-text-size) var(--pi-header-text-font);
--pi-header-text-font: var(--theme-body-header-text-font);
--pi-header-text-size: 1.25em;
--pi-tab-inactive-color: var(--pi-border-color);
--pi-tab-section-header-text-size: 1.2em;
--pi-secondary-background: var(--theme-body-header-text-color);
--pi-secondary-background--rgb: 0, 0, 0;
--pi-secondary-text-color: var(--theme-body-header-text-color);
--pi-secondary-text-color--rgb: var(--theme-body-header-text-color--rgb);
--pi-title-background: var(--pi-secondary-text-color);
--pi-title-background--rgb: var(--pi-secondary-text-color--rgb);
--pi-title-font: var(--pi-title-text-size) var(--pi-title-text-font);
--pi-title-text-color: #000;
--pi-title-text-color--rgb: 0, 0, 0;
--pi-title-text-font: var(--theme-body-header-text-font);
--pi-title-text-size: 2em;
--pi-header-underline-primary-color: #b6b6b6;
--pi-header-underline-primary-color--rgb: 180, 180, 180;
--pi-header-underline-gradient: linear-gradient(to right, rgba(var(--pi-header-underline-primary-color--rgb), 0) 0, var(--pi-header-underline-primary-color) 50%, rgba(var(--pi-header-underline-primary-color--rgb), 0) 100%);
--pi-header-active-underline-gradient: linear-gradient(to right, rgba(var(--pi-secondary-background--rgb), 0) 0, var(--pi-secondary-background) 50%, rgba(var(--pi-secondary-background--rgb), 0) 100%);
--pi-header-underline-size: var(--theme-header-underline-size);
--pi-header-underline-position: var(--theme-header-underline-position);
--pi-header-underline: var(--pi-header-underline-gradient) var(--pi-header-underline-position) / var(--pi-header-underline-size) no-repeat;
--pi-header-underline-active: var(--pi-header-active-underline-gradient) var(--pi-header-underline-position) / var(--pi-header-underline-size) no-repeat;
}
.portable-infobox {
font-size: inherit;
font-style: var(--pi-body-text-style);
border: var(--pi-border);
}
.portable-infobox section.pi-panel {
border-top-width: var(--pi-border-divider-width);
}
.portable-infobox .pi-title {
font: var(--pi-title-font);
color: var(--pi-title-text-color);
background-color: var(--pi-title-background);
}
.portable-infobox .pi-title,
.portable-infobox .pi-header,
.portable-infobox .pi-group[data-item-name=Tier-Group] {
text-align: center;
border-width: 1px 0 1px 0;
text-transform: uppercase;
font-style: normal;
}
.portable-infobox section.pi-group .pi-header,
.portable-infobox section .pi-section-label {
font: var(--pi-header-font);
color: var(--pi-secondary-text-color);
letter-spacing: 0.5px;
}
.portable-infobox .pi-data-label {
font-size: 1.1em;
color: var(--pi-body-text-color);
text-transform: uppercase;
display: inline-flex;
align-items: center;
}
.portable-infobox .pi-data-value {
hyphens: manual;
}
.portable-infobox .pi-caption {
font-size: 1.2em;
}
.pi-section-navigation .pi-section-tab.pi-section-active,
.pi-section-navigation .pi-section-tab.current,
.pi-media-collection .pi-tab-link.current {
background: unset;
}
.pi-panel-scroll-wrapper,
.pi-media-collection .pi-tab-link {
border: var(--pi-border);
}
.pi-section-navigation {
background-color: var(--pi-header-background);
}
.portable-infobox .pi-header {
background-color: var(--pi-header-background);
}
.pi-section-navigation .pi-section-tab .pi-section-label {
font-size: calc(1.2 * var(--pi-header-text-size));
text-transform: uppercase;
}
.portable-infobox section.pi-item,
.pi-section-navigation .pi-section-tab {
border: none;
}
/* Tab labels / areas styling */
/* Default style for all tab labels */
.portable-infobox .pi-panel>.pi-panel-scroll-wrapper .pi-section-navigation .pi-section-tab,
.portable-infobox section.pi-group[data-item-name=Tier-Group] .pi-data-value {
color: var(--pi-secondary-text-color);
flex-grow: 1;
flex-shrink: 1;
/* Let panels spread across the row */
}
/* Set tab size / spread across rows */
.portable-infobox section.pi-group[data-item-name=Tier-Group] .pi-data-value {
flex-basis: 50%;
/* Usually 1 or 2 entries in this row */
}
.portable-infobox .pi-panel[data-item-name=Quality-Panel] > .pi-panel-scroll-wrapper .pi-section-navigation .pi-section-tab {
flex-basis: 33%;
}
/* Gradient underline of headings */
/* Standard grey fade out */
.portable-infobox .pi-section-navigation .pi-section-tab:not(.pi-section-active),
.portable-infobox section.pi-group .pi-header,
.portable-infobox section.pi-group.pi-collapse-closed .pi-header,
.portable-infobox .pi-media-collection .pi-tab-link {
background: var(--pi-header-underline), var(--pi-header-background);
}
/* 'Selected/Active' highlight fade out */
.portable-infobox .pi-section-navigation .pi-section-tab.pi-section-active,
.portable-infobox .pi-section-navigation .pi-section-tab:hover,
.portable-infobox section.pi-collapse:not(.pi-collapse-closed) > .pi-header,
.portable-infobox section.pi-collapse > .pi-header:hover {
background: var(--pi-header-underline-active), var(--pi-header-background);
}
/* Grey out 'unselected' panel text tabs or collapsible headers */
.portable-infobox .pi-panel>.pi-panel-scroll-wrapper .pi-section-navigation .pi-section-tab:not(.pi-section-active):not(:hover) .pi-section-label,
.portable-infobox .pi-collapse.pi-collapse-closed .pi-header:not(:hover) {
color: var(--pi-tab-inactive-color);
}
/* Hollow 'unselected' panel quality tab */
.portable-infobox .pi-panel[data-item-name=Quality-Panel]>.pi-panel-scroll-wrapper .pi-section-navigation .pi-section-tab:not(.pi-section-active) .pi-section-label {
color: #000;
-webkit-text-stroke-width: .025em;
-webkit-text-stroke-color: var(--pi-secondary-text-color);
}
.portable-infobox section.pi-group[data-item-name=Tier-Group] {
font-family: var(--pi-title-text-font);
font-size: var(--pi-header-text-size);
}
/* Padding and alignment of text in PI elements */
.portable-infobox section.pi-group[data-item-name=Text-Group] .pi-data-value {
padding-left: 15px;
padding-right: 15px;
text-align: center;
}
/* Add better framing / spacing for Item/Object/Location list sections of infoboxes */
.portable-infobox section.pi-group[data-item-name=Padded-Group] .pi-data-value {
padding-left: 25px;
padding-right: 25px;
}
.portable-infobox section.pi-group[data-item-name=Padded-Group] .pi-data-value {
padding-left: 25px;
padding-right: 25px;
}
/* Game style, might look stupid on the web */
.portable-infobox .pi-font a {
color: var(--pi-secondary-text-color);
}
.portable-infobox.type-Faction .pi-data[data-source=HomeBiome]>.pi-data-label,
.portable-infobox.type-Faction .pi-data[data-source=HomeBiome]>.pi-data-value,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowLocation]>.pi-data-label,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMin]>.pi-data-value,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMax]>.pi-data-value
{
font-size: 16px;
}
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMin]>.pi-data-label,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMax]>.pi-data-label,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMin]>.pi-data-value,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMax]>.pi-data-value,
.portable-infobox.pi-type-Seed .pi-data[data-source=YieldMin]>.pi-data-label {
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
}
.portable-infobox section.pi-group[data-item-name=Stats] .pi-data-value {
font-style: normal;
font-size: 1.1em;
}
/* Temporary standalone unset italics until styling more settled */
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMin]>.pi-data-label,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMax]>.pi-data-label,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMin]>.pi-data-value,
.portable-infobox.pi-type-Seed .pi-data[data-source=GrowTempMax]>.pi-data-value {
font-style: normal;
}
/* Force Tier data content to not highlight links, broken or not
.portable-infobox section.pi-group[data-item-name=Tier-Group] .pi-data-value a.new,
.portable-infobox section.pi-group[data-item-name=Tier-Group] .pi-data-value a {
color: var(--pi-secondary-text-color);
}
/* END MIGRATED */
/* -------------*/
/* BEGIN UMIGRATED
.portable-infobox.type-Faction .pi-data[data-source=HomeBiome],
.portable-infobox.type-Seed .pi-data[data-source=GrowLocation],
.portable-infobox.type-Seed .pi-data[data-source=GrowTempMin],
.portable-infobox.type-Seed .pi-data[data-source=GrowTempMax] {
padding-left: 25px;
padding-right: 25px;
}
/* Multi-line horizontal data values get concatenated with inline-flex
.portable-infobox.type-Seed .pi-data[data-source=GrowLocation] > .pi-data-value {
display: block;
}
/* Style function section instead of using {{Highlight}}
.portable-infobox .pi-group[data-item-name=Text-Group] .pi-data[data-source=Function] {
color: var(--pi-secondary-text-color);
}
.portable-infobox.type-Faction .pi-caption {
font-size: 18px;
}
/* Item & Object infoboxes
/* Tabbed section specific styling
/* Expand tab label spacing
.portable-infobox section.pi-panel[data-item-name=Quality-Panel] .wds-tabs__wrapper li.wds-tabs__tab,
.portable-infobox section.pi-panel.wds-tabber[data-item-name=Data-Panel] li.wds-tabs__tab,
.portable-infobox section.pi-panel[data-item-name=Upgrade-Panel] .wds-tabs__wrapper li.wds-tabs__tab,
.portable-infobox section.pi-panel[data-item-name=Tier-Panel] .wds-tabs__wrapper li.wds-tabs__tab{
text-align: center;
text-transform: uppercase;
flex-grow: 1;
}
/* Test replacement with flex-grow
.portable-infobox section.pi-panel[data-item-name=Quality-Panel] .wds-tabs__wrapper li.wds-tabs__tab,
.portable-infobox section.pi-panel[data-item-name=Upgrade-Panel] .wds-tabs__wrapper li.wds-tabs__tab {
flex-grow: 1;
}
.portable-infobox section.pi-panel[data-item-name=Upgrade-Tier-Panel] .wds-tabs__wrapper li.wds-tabs__tab {
flex-basis: 25%;
}
.portable-infobox section.pi-panel.wds-tabber[data-item-name=Data-Panel] li.wds-tabs__tab {
flex-basis: 50%;
}
.portable-infobox .wds-tabs__tab-label {
font-size: 16px;
}
/* Item Infoboxes only
/* Default infobox tab style for all 'Data-Panel' items
.portable-infobox section.pi-group[data-item-name=Centered-Group] .pi-data-value {
text-align: center;
}
/* END -- Portable Infobox styling */
/* -- WikiTable styling -- */
.wikitable {
background-color: unset;
color: var(--theme-primary-text-color);
}
.wikitable>tr>th,
.wikitable>*>tr>th {
background-color: #333;
}
/* Special page filters */
/* .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled,
.oo-ui-menuSelectWidget,
.oo-ui-menuSectionOptionWidget,
.mw-rcfilters-ui-itemMenuOptionWidget .mw-rcfilters-ui-table,
.mw-rcfilters-ui-filterMenuHeaderWidget-header{
background-color: #333;
color: var(--theme-primary-text-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title,
.mw-rcfilters-ui-itemMenuOptionWidget-label-title {
color: var(--theme-primary-text-color);
}
*/
/* Edge cases to investigate / clean up later */
body.rootpage-Special_Version table {
white-space: normal;
}
/* -- Documentation Specific -- */
.doc-contentbox div.doc-header-row {
background: var(--theme-header-underline);
}
.doc-contentbox span.doc-header {
font: var(--theme-header-font);
font-size: calc(var(--theme-body-header-text-size) * 1.2);
color: var(--theme-body-header-text-color);
letter-spacing: var(--theme-body-header-letter-spacing);
vertical-align: middle;
}
/* -- DRUID BEGIN -- */
.druid-container {
/* These variables are designed to inherit from your wiki's color variables.
If your wiki uses a different naming scheme, change the inner names to match yours.
If your wiki doesn't use color variables you should consider doing so,
otherwise you can replace the inner variables or the fallback values with colors that match your wiki.
*/
--druid-background-color: var(--pi-background, #ffffff);
--druid-background-color--rgb: var(--pi-background--rgb, 255, 255, 255);
--druid-secondary-background-color: var(--pi-secondary-background, #36c);
--druid-secondary-background-color--rgb: var(--pi-secondary-background--rgb, 51, 102, 204);
--druid-secondary-background-label-color: var(--pi-secondary-text-color, #fff);
--druid-secondary-background-label-color--rgb: var(--pi-secondary-text-color--rgb, 255, 255, 255);
--druid-tertiary-background-color: var(--pi-background, #eaecf0);
--druid-tertiary-background-color--rgb: var(--pi-background--rgb, 234, 236, 240);
--druid-border-color: var(--theme-primary-border-color, #a7d7f9);
--druid-border-color--rgb: var(--theme-primary-border-color--rgb, 167, 215, 249);
--druid-link-color: var(--theme-link-color, #0645ad);
--druid-link-color--rgb: var(--theme-link-color--rgb, 6, 69, 173);
--druid-link-label-color: var(--theme-link-label-color, #fff);
--druid-link-label-color--rgb: var(--theme-link-label-color--rgb, 255, 255, 255);
}
/* -- DRUID END -- */
/* OOUI Theme Variables -- Thanks Terraria :) */
:root {
--oouihelper--red: var(--theme-text-highlight-color--bad);
--oouihelper--red-darker: var(--theme-text-highlight-color--bad--darker);
--oouihelper--red-lighter: var(--theme-text-highlight-color--bad--lighter);
--oouihelper--red-lighter-transparent: rgba(var(--theme-text-highlight-color--bad--lighter--rgb), 0.6);
--oouihelper--yellow: var(--theme-text-highlight-color--general);
--oouihelper--yellow-darker: var(--theme-text-highlight-color--general--darker);
--oouihelper--yellow-lighter: var(--theme-text-highlight-color--general--lighter);
--oouihelper--green: var(--theme-text-highlight-color--good);
--oouihelper--green-darker: var(--theme-text-highlight-color--good--darker);
--oouihelper--green-lighter: var(--theme-text-highlight-color--good--lighter);
--oouihelper--progressive: var(--theme-text-highlight-color--general);
--oouihelper--progressive-transparent: rgba(0, 0, 0, 0.6); /* #000; */
--oouihelper--progressive-lighter: var(--theme-text-highlight-color--general--lighter);
--oouihelper--disabled: var(--theme-text-disabled-color);
--oouihelper--disabled-background: var(--theme-primary-background-color);
--oouihelper--disabled-darker-transparent: rgba(128, 128, 128, 0.5);
--oouihelper--border: var(--theme-primary-border-color);
--oouihelper--borderdark: #000;
--oouihelper--borderdark-lighter: rgb(90, 90, 90);
--oouihelper--borderdark-hover: rgb(118, 117, 117);
--oouihelper--borderdark-focus: var(--oouihelper--progressive);
--oouihelper--textinput-background: rgba(0, 0, 0, .75);
--oouihelper--textinput-background-lighter: rgba(30, 30, 30, 1);
--oouihelper--textinput-background-darker: rgba(10, 10, 10, 1);
--oouihelper--placeholdertext: var(--oouihelper--disabled);
--oouihelper--themerelated: var(--theme-primary-border-color);
--oouihelper--themerelated-lighter: 0;
--oouihelper--themerelated-lighter-transparent: 0;
--oouihelper--themerelated-lightest: 0;
--oouihelper--themerelated-darker: 0;
--oouihelper--themerelated-darkest: 0;
--oouihelper--themerelated-disabled: 0;
--oouihelper--themerelated-disabled-lighter: 0;
--oouihelper--text-background: var(--theme-primary-background-color);
/* Actual OOUI variables, grouped by element type */
/* misc */
--ooui--inlinehelp-color: var(--theme-primary-text-color-note);
--ooui--disabled-color: var(--oouihelper--disabled);
/* all buttons */
--ooui--button-background: var(--theme-primary-background-color);
--ooui--button-background--hover: var(--theme-secondary-background-color);
--ooui--button-box-shadow: rgba(10, 10, 10, 0.5) 2px 2px 3px;
--ooui--button-box-shadow--focus: inset var(--oouihelper--themerelated-lighter-transparent) 0 0 0 2px;
/* "normal" button */
--ooui--button-border-top: 2px solid var(--theme-primary-border-color);
--ooui--button-border-right: var(--ooui--button-border-top);
--ooui--button-border-bottom: var(--ooui--button-border-right);
--ooui--button-border-left: var(--ooui--button-border-top);
--ooui--button-border-top--hover: 2px solid var(--theme-primary-border-color--hover);
--ooui--button-border-right--hover: var(--ooui--button-border-top--hover);
--ooui--button-border-bottom--hover: var(--ooui--button-border-right--hover);
--ooui--button-border-left--hover: var(--ooui--button-border-top--hover);
--ooui--button-color: var(--theme-primary-text-color);
--ooui--button-color--hover: var(--oouihelper--progressive);
--ooui--button-selected-color: var(--oouihelper--progressive);
/* "progressive" button */
--ooui--button-progressive-color: var(--oouihelper--progressive);
--ooui--button-progressive-color--hover: var(--oouihelper--progressive-lighter);
--ooui--button-progressive-box-shadow--focus: inset var(--oouihelper--progressive-transparent) 0 0 0 2px;
--ooui--button-progressive-primary-border-color: var(--oouihelper--progressive);
--ooui--button-progressive-primary-border-color--hover: var(--oouihelper--progressive-lighter);
/* "destructive" button */
--ooui--button-destructive-color: var(--oouihelper--red-lighter);
--ooui--button-destructive-color--hover: var(--oouihelper--red-lighter);
--ooui--button-destructive-box-shadow--focus: inset var(--oouihelper--red-lighter-transparent) 0 0 0 2px;
--ooui--button-destructive-primary-border-color: var(--oouihelper--red-lighter);
--ooui--button-destructive-primary-border-color--hover: var(--oouihelper--red-lighter);
/* disabled button */
--ooui--button-disabled-color: var(--oouihelper--disabled);
--ooui--button-disabled-background: var(--oouihelper--disabled-background);
--ooui--button-disabled-border-top: 1px solid ;
--ooui--button-disabled-border-right: 1px solid ;
--ooui--button-disabled-border-bottom: var(--ooui--button-disabled-border-right);
--ooui--button-disabled-border-left: var(--ooui--button-disabled-border-top);
/* frameless button */
--ooui--button-frameless-on-color: var(--theme-primary-text-color-highlight);
/* textarea */
--ooui--textarea-background-color: var(--oouihelper--textinput-background);
--ooui--textarea-placeholder-color: var(--oouihelper--placeholdertext);
--ooui--textarea-border-color: var(--oouihelper--borderdark-lighter);
--ooui--textarea-border-color--hover: var(--oouihelper--borderdark-hover);
--ooui--textarea-border-color--focus: var(--oouihelper--borderdark-focus);
--ooui--textarea-invalid-border-color: var(--oouihelper--red-lighter);
--ooui--textarea-readonly-background-color: var(--oouihelper--textinput-background-darker);
--ooui--textarea-disabled-color: var(--oouihelper--disabled);
--ooui--textarea-disabled-border-color: var(--oouihelper--disabled-lighter-transparent);
--ooui--textarea-disabled-background-color: var(--oouihelper--disabled-darker-transparent);
--ooui--textarea-pending-background-color-1: rgba(20, 20, 20, 0.9);
--ooui--textarea-pending-background-color-2: #000;
/* checkbox */
--ooui--checkbox-border-color: var(--oouihelper--themerelated);
--ooui--checkbox-border-color--hover: var(--oouihelper--progressive);
--ooui--checkbox-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E check %3C/title%3E%3Cpath d='M7 14.2 2.8 10l-1.4 1.4L7 17 19 5l-1.4-1.4z'/%3E%3C/svg%3E");
--ooui--checkbox-icon--hover: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Echeck%3C/title%3E%3Cpath d=%22M7 14.17L2.83 10l-1.41 1.41L7 17 19 5l-1.41-1.42z%22/%3E%3C/g%3E%3C/svg%3E");
--ooui--checkbox-box-shadow--focus: var(--oouihelper--themerelated-darkest);
--ooui--checkbox-selected-background-color: var(--oouihelper--progressive);
--ooui--checkbox-disabled-background-color: var(--oouihelper--themerelated-disabled);
--ooui--checkbox-disabled-icon: var(--ooui--checkbox-icon);
/* radiobutton */
--ooui--radiobutton-border-color: var(--oouihelper--themerelated);
--ooui--radiobutton-border-color--hover: var(--oouihelper--themerelated-lighter);
--ooui--radiobutton-box-shadow--focus: var(--oouihelper--themerelated-darkest);
--ooui--radiobutton-disabled-background-color: var(--oouihelper--themerelated-disabled);
/* toggleswitch */
--ooui--toggleswitch-border-color: var(--oouihelper--themerelated);
--ooui--toggleswitch-border-color--hover: var(--oouihelper--themerelated-lighter);
--ooui--toggleswitch-color--active: var(--oouihelper--themerelated-darker);
--ooui--toggleswitch-grip-color: var(--oouihelper--themerelated-lightest);
--ooui--toggleswitch-box-shadow--focus: var(--oouihelper--themerelated-darkest);
--ooui--toggleswitch-disabled-background-color: var(--oouihelper--themerelated-disabled);
--ooui--toggleswitch-disabled-grip-color: var(--oouihelper--themerelated-disabled-lighter);
/* dropdown */
--ooui--dropdown-background-color: var(--oouihelper--textinput-background);
--ooui--dropdown-background-color--hover: var(--oouihelper--textinput-background-lighter);
--ooui--dropdown-border-color: var(--oouihelper--borderdark);
--ooui--dropdown-border-color--hover: var(--oouihelper--borderdark-hover);
--ooui--dropdown-border-color--focus: var(--oouihelper--borderdark-focus);
--ooui--dropdown-disabled-color: var(--oouihelper--disabled);
--ooui--dropdown-disabled-border-color: var(--oouihelper--disabled-lighter-transparent);
--ooui--dropdown-disabled-background-color: var(--oouihelper--disabled-darker-transparent);
/* selectfile */
--ooui--selectfile-border-color: #72777d;
--ooui--selectfile-background-color: var(--oouihelper--textinput-background);
--ooui--selectfile-candrop-background-color: #514743;
/* tag item */
--ooui--tagitem-background-color: rgba(20, 20, 20, 0.75);
--ooui--tagitem-border-color: var(--oouihelper--borderdark);
--ooui--tagitem-border-color--hover: var(--oouihelper--borderdark-hover);
--ooui--tagitem-border-color--focus: var(--oouihelper--themerelated-darkest);
--ooui--tagitem-invalid-border-color: var(--oouihelper--red-lighter);
--ooui--tagitem-color--hover: #efeadc;
--ooui--tagitem-disabled-color: var(--oouihelper--disabled);
--ooui--tagitem-disabled-border-color: var(--oouihelper--disabled-lighter-transparent);
--ooui--tagitem-disabled-background-color: rgba(20, 20, 20, 0.5);
/* multioption */
--ooui--multioption-disabled-color: var(--oouihelper--disabled);
/* progressbar */
--ooui--progressbar-border-color: var(--oouihelper--themerelated);
--ooui--progressbar-bar-background-color: var(--oouihelper--themerelated);
--ooui--progressbar-disabled-border-color: var(--oouihelper--themerelated-disabled);
--ooui--progressbar-pending-background-color-1: #7a6a52;
--ooui--progressbar-pending-background-color-2: #4d4233;
/* messagewidget */
--ooui--messagewidget-notice-background-color: var(--theme-primary-background-color);
--ooui--messagewidget-notice-border-color: var(--theme-primary-border-color);
--ooui--messagewidget-error-background-color: var(--oouihelper--red);
--ooui--messagewidget-error-border-color: var(--oouihelper--red-darker);
--ooui--messagewidget-error-color: var(--oouihelper--red-lighter);
--ooui--messagewidget-warning-background-color: var(--oouihelper--yellow);
--ooui--messagewidget-warning-border-color: var(--oouihelper--yellow-darker);
--ooui--messagewidget-success-background-color: var(--oouihelper--green);
--ooui--messagewidget-success-border-color: var(--oouihelper--green-darker);
--ooui--messagewidget-success-color: var(--oouihelper--green-lighter);
/* menuselectwidget */
--ooui--menuselect-background-color: var(--oouihelper--text-background);
--ooui--menuselect-selected-background-color: var(--oouihelper--textinput-background-darker);
--ooui--menuselect-highlighted-background-color: var(--oouihelper--textinput-background-lighter);
--ooui--menuselect-border-color: var(--oouihelper--borderdark);
--ooui--menusectionoption-color: var(--oouihelper--placeholdertext);
/* tabselectwidget */
--ooui--tabselect-background-color: var(--oouihelper--text-background);
--ooui--tabselect-selected-background-color: var(--theme-content-background);
--ooui--tabselect-highlighted-background-color: var(--oouihelper--textinput-background-lighter);s
--ooui--tabselect-frameless-box-shadow-color: var(--oouihelper--borderdark-lighter);
--ooui--tabselect-frameless-selected-color: var(--theme-link-color);
--ooui--tabselect-frameless-selected-box-shadow-color: var(--theme-link-color);
--ooui--tabselect-frameless-highlighted-color: #bcd1d2;
--ooui--tabselect-frameless-highlighted-box-shadow-color: #bcd1d2;
--ooui--taboption-color: var(--oouihelper--placeholdertext);
/* outlineselectwidget */
--ooui--outlineselect-box-shadow--focus: inset var(--oouihelper--themerelated-lighter-transparent) 0 0 0 2px;
--ooui--outlineoption-background-color: var(--oouihelper--text-background);
--ooui--outlineoption-border-color: var(--oouihelper--borderdark);
--ooui--outlineoption-selected-background-color: var(--oouihelper--textinput-background-darker);
--ooui--outlineoption-highlighted-background-color: var(--oouihelper--textinput-background-lighter);
--ooui--outlineoption-pressed-background-color: #22292a;
/* popupwidget */
--ooui--popup-background-color: var(--oouihelper--text-background);
--ooui--popup-border-color: var(--oouihelper--borderdark);
/* layouts */
--ooui--bookletlayout-border-color: var(--oouihelper--borderdark);
--ooui--panellayout-border-color: var(--oouihelper--borderdark);
/* dialog */
--ooui--dialog-border-color: var(--oouihelper--borderdark);
--ooui--dialog-border-color--lighter: var(--oouihelper--borderdark-lighter);
/* window */
--ooui--window-background-color: var(--oouihelper--text-background);
--ooui--window-border-color: var(--oouihelper--borderdark);
/* toolbar */
--ooui--toolbar-bar-background-color: var(--oouihelper--text-background);
--ooui--toolbar-bar-color: var(--theme-primary-text-color);
/* syntaxhighlight */
/* edit */
/* indicators */
/* tools like https://isotropic.co/tool/hex-color-to-css-filter/ allow converting the desired color into a filter */
--ooui--indicator-filter: brightness(0) invert(90%) sepia(28%) saturate(107%) hue-rotate(5deg) brightness(96%) contrast(93%);
--ooui--indicator-invert-filter: none;
/* icon filters */
--ooui--icon-normal-filter: brightness(0) invert(1);
--ooui--icon-progressive-filter: brightness(0) invert(78%) sepia(67%) saturate(1967%) hue-rotate(352deg) brightness(102%) contrast(103%); /* var(--theme-test-highlight-general */
--ooui--icon-destructive-filter: brightness(0) invert(43%) sepia(14%) saturate(3288%) hue-rotate(315deg) brightness(78%) contrast(124%); /* var(--theme-text-highlight-bad) */
--ooui--icon-invert-filter: none;
--ooui--icon-success-filter: brightness(0) invert(32%) sepia(44%) saturate(4543%) hue-rotate(80deg) brightness(102%) contrast(104%); /* var(--theme-text-highlight-good) */
--ooui--icon-warning-filter: var(--ooui--icon-progressive-filter);
--ooui--icon-error-filter: var(--ooui--icon-destructive-filter);
}
/* -- OOUI: Icon replacements -- */
/* Override icons from (or with):
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/images/icons/ */
:root {
--ooui--edit-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'> <title> highlight </title> <path d='M15.14 2.27a1 1 0 0 0-1.41 0l-10 10a1 1 0 0 0 0 1.41L4 14l-3 4h5l1-1 .29.29a1 1 0 0 0 1.41 0l10-10a1 1 0 0 0 .03-1.43zM7 15l-2-2 9-9 2 2z'/> </svg>"); /* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/images/icons/highlight.svg */
--ooui--indicator-down: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><title> down </title><path d='M9.9 2.9 6 6.8 2.1 2.9 1 4l5 5 5-5z'/></svg>"); /* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/images/indicators/down.svg -- For some reason this was base64 encoded and larger than the source */
}
/* -- OOUI: MessageDialog -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/dialogs/MessageDialog.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/windows.less */
.oo-ui-messageDialog-content > .oo-ui-window-foot {
outline-color: var(--ooui--dialog-border-color);
}
.oo-ui-messageDialog-title {
color: var(--theme-primary-text-color);
}
.oo-ui-messageDialog-message {
color: var(--theme-primary-text-color);
}
.oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:active {
background: var(--ooui--button-background);
}
.oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:active {
background: var(--ooui--button-background);
}
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
border-right-color: var(--ooui--dialog-border-color);
}
.oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
border-bottom-color: var(--ooui--dialog-border-color--lighter);
}
/* -- OOUI: ProcessDialog -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/dialogs/ProcessDialog.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/windows.less */
.oo-ui-processDialog-content .oo-ui-window-head,
.oo-ui-processDialog-content .oo-ui-window-foot {
outline-color: var(--ooui--dialog-border-color--lighter);
}
.oo-ui-processDialog-actions-primary .oo-ui-actionWidget > .oo-ui-buttonElement-button {
border-left-color: var(--ooui--dialog-border-color--lighter);
}
.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active {
border-left-color: var(--ooui--dialog-border-color--lighter);
}
.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:focus {
border-color: var(--ooui--button-progressive-primary-border-color);
}
.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-right-color: var(--ooui--dialog-border-color--lighter);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover {
background: var(--ooui--button-background--hover);
border-right: var(--ooui--button-border-right--hover);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:active {
background: var(--ooui--button-background);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:focus {
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
/* -- OOUI: ButtonElement -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/elements/ButtonElement.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/elements.less */
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
color: var(--ooui--button-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
background-color: unset;
color: var(--ooui--button-color--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
box-shadow: var(--ooui--button-box-shadow--focus);
}
.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 {
background-color: unset;
color: var(--ooui--button-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
color: var(--ooui--button-progressive-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-progressive-color--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
color: var(--ooui--button-progressive-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
color: var(--ooui--button-destructive-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-destructive-color--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
color: var(--ooui--button-destructive-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
color: var(--ooui--button-disabled-color);
}
.oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
border-radius: 4px;
}
.oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
background: var(--ooui--button-disabled-background);
color: var(--ooui--button-disabled-color);
border-top: var(--ooui--button-disabled-border-top);
border-right: var(--ooui--button-disabled-border-right);
border-bottom: var(--ooui--button-disabled-border-bottom);
border-left: var(--ooui--button-disabled-border-left);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
background: var(--ooui--button-background);
color: var(--ooui--button-color);
border-top: var(--ooui--button-border-top);
border-right: var(--ooui--button-border-right);
border-bottom: var(--ooui--button-border-bottom);
border-left: var(--ooui--button-border-left);
box-shadow: var(--ooui--button-box-shadow);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
background: var(--ooui--button-background--hover);
color: var(--ooui--button-color--hover);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-box-shadow--focus);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
background: var(--ooui--button-background);
color: var(--ooui--button-selected-color);
border-color: var(--ooui--button-progressive-primary-border-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus {
border-color: var(--ooui--button-progressive-primary-border-color);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-progressive-box-shadow--focus);
}
.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: var(--ooui--button-background);
color: var(--ooui--button-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
color: var(--ooui--button-progressive-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-progressive-color--hover);
background: var(--ooui--button-background--hover);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
border-top: var(--ooui--button-border-top);
border-right: var(--ooui--button-border-right);
border-bottom: var(--ooui--button-border-bottom);
border-left: var(--ooui--button-border-left);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-progressive-box-shadow--focus);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
background: var(--ooui--button-background);
color: var(--ooui--button-progressive-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
color: var(--ooui--button-destructive-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-destructive-color--hover);
background: var(--ooui--button-background--hover);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
border-top: var(--ooui--button-border-top);
border-right: var(--ooui--button-border-right);
border-bottom: var(--ooui--button-border-bottom);
border-left: var(--ooui--button-border-left);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-destructive-box-shadow--focus);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
background: var(--ooui--button-background);
color: var(--ooui--button-destructive-color);
border-top: var(--ooui--button-border-top--hover);
border-right: var(--ooui--button-border-right--hover);
border-bottom: var(--ooui--button-border-bottom--hover);
border-left: var(--ooui--button-border-left--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
color: var(--ooui--button-progressive-color);
background: var(--ooui--button-background);
border-color: var(--ooui--button-progressive-primary-border-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-progressive-color--hover);
background: var(--ooui--button-background--hover);
border-color: var(--ooui--button-progressive-primary-border-color--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
border-color: var(--ooui--button-progressive-primary-border-color);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-progressive-box-shadow--focus);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
color: var(--ooui--button-progressive-color);
background: var(--ooui--button-background);
border-color: var(--ooui--button-progressive-primary-border-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
color: var(--ooui--button-destructive-color);
background: var(--ooui--button-background);
border-color: var(--ooui--button-destructive-primary-border-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
color: var(--ooui--button-destructive-color--hover);
background: var(--ooui--button-background--hover);
border-color: var(--ooui--button-destructive-primary-border-color--hover);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
border-color: var(--ooui--button-destructive-primary-border-color);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-destructive-box-shadow--focus);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
color: var(--ooui--button-destructive-color);
background: var(--ooui--button-background);
border-color: var(--ooui--button-destructive-primary-border-color);
}
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle,
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
background-color: var(--ooui--button-background);
}
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:focus {
outline-color: var(--ooui--button-progressive-primary-border-color);
box-shadow: var(--ooui--button-box-shadow--focus);
}
.oo-ui-popupToolGroup-tools {
background-color: var(--theme-primary-background-color);
}
.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, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
background-color: var(--ooui--menuselect-highlighted-background-color);
}
.oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover,
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
background-color: var(--oouihelper--text-background);
color: var(--oouihelper--progressive);
}
/* -- OOUI: PendingElement -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/elements/PendingElement.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/elements.less */
.oo-ui-pendingElement-pending {
background-color: var(--ooui--textarea-pending-background-color-1);
background-image: linear-gradient(135deg, var(--ooui--textarea-pending-background-color-2) 25%, transparent 25%, transparent 50%, var(--ooui--textarea-pending-background-color-2) 50%, var(--ooui--textarea-pending-background-color-2) 75%, transparent 75%, transparent);
}
/* -- OOUI: icons -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/elements/IconElement.less */
.oo-ui-iconElement-icon {
filter: var(--ooui--icon-normal-filter);
}
/*
.oo-ui-iconElement-icon:hover {
filter: brightness(0) var(--ooui--icon-progressive-filter);
} */
/* -- OOUI: ToolBar
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/Toolbar.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/tools.less */
.oo-ui-toolbar-bar {
background-color: var(--ooui--toolbar-bar-background-color);
color: var(--ooui--toolbar-bar-color);
}
.oo-ui-toolbar-tools, .oo-ui-toolbar-popups {
background: inherit;
}
.oo-ui-widget:hover > * > .oo-ui-iconElement-icon,
.oo-ui-widget:hover > * > .oo-ui-indicatorElement-indicator {
filter: var(--ooui--icon-progressive-filter);
}
.oo-ui-widget:hover > * > .oo-ui-tool-link,
.oo-ui-widget:hover > * > .oo-ui-labelElement-label {
color: var(--editor-header-text-color);
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
color: var(--ooui--button-progressive-color);
background-color: var(--ooui--button-background);
border-color: var(--ooui--button-progressive-primary-border-color);
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
background-color: var(--ooui--button-background--hover);
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link {
color: var(--ooui--button-progressive-color);
background-color: var(--ooui--button-background);
border-color: var(--ooui--button-progressive-primary-border-color);
}
.oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
color: var(--editor-header-text-color);
}
/* -- Icon re-colouring -- */
.oo-ui-iconElement-icon.oo-ui-image-invert {
filter: var(--ooui--icon-invert-filter);
}
.oo-ui-iconElement-icon.oo-ui-image-progressive {
filter: var(--ooui--icon-progressive-filter);
}
.oo-ui-iconElement-icon.oo-ui-image-destructive {
filter: var(--ooui--icon-destructive-filter);
}
.oo-ui-iconElement-icon.oo-ui-image-error {
filter: var(--ooui--icon-error-filter);
}
.oo-ui-iconElement-icon.oo-ui-image-warning {
filter: var(--ooui--icon-warning-filter);
}
.oo-ui-iconElement-icon.oo-ui-image-success {
filter: var(--ooui--icon-success-filter);
}
/* -- OOUI: indicators -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/indicators.json */
.oo-ui-indicator-clear {
filter: var(--ooui--indicator-filter);
}
.oo-ui-image-invert.oo-ui-indicator-clear {
filter: var(--ooui--indicator-invert-filter);
}
.oo-ui-indicator-up {
filter: var(--ooui--indicator-filter);
}
.oo-ui-image-invert.oo-ui-indicator-up {
filter: var(--ooui--indicator-invert-filter);
}
.oo-ui-indicator-down {
filter: var(--ooui--indicator-filter);
}
.oo-ui-image-invert.oo-ui-indicator-down {
filter: var(--ooui--indicator-invert-filter);
}
.oo-ui-indicator-required {
filter: var(--ooui--indicator-filter);
}
.oo-ui-image-invert.oo-ui-indicator-required {
filter: var(--ooui--indicator-invert-filter);
}
/* -- OOUI: BookletLayout -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/layouts/BookletLayout.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/layouts.less */
.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
border-top-color: var(--ooui--bookletlayout-border-color);
}
.oo-ui-bookletLayout > .oo-ui-menuLayout-menu {
border-right-color: var(--ooui--bookletlayout-border-color);
}
/* -- OOUI: FieldLayout -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/layouts/FieldLayout.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/layouts.less */
.oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
color: var(--ooui--dropdown-disabled-color);
}
/* -- OOUI: PanelLayout -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/layouts/PanelLayout.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/layouts.less */
.oo-ui-panelLayout-framed {
border-color: var(--ooui--panellayout-border-color);
}
/* -- OOUI: ButtonGroupWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/ButtonGroupWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
border-left-color: var(--ooui--button-disabled-border-left);
}
.oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button,
.oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button:active {
border-left-color: var(--ooui--button-border-left);
}
/* -- OOUI: ButtonSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/ButtonSelectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
border-left: var(--ooui--button-disabled-border-left);
}
.oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
border-color: var(--ooui--button-progressive-primary-border-color);
box-shadow: var(--ooui--button-box-shadow), var(--ooui--button-progressive-box-shadow--focus);
}
/* -- OOUI: CheckboxInputWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/CheckboxInputWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-checkboxInputWidget [type=checkbox] + span {
background-color: transparent;
border-color: var(--ooui--checkbox-border-color);
border-width: 2px;
filter: none;
}
.oo-ui-checkboxInputWidget [type=checkbox]:indeterminate + span::before {
background-color: var(--ooui--checkbox-border-color);
}
.oo-ui-checkboxInputWidget [type=checkbox]:disabled + span {
background-color: var(--ooui--checkbox-disabled-background-color);
border-color: var(--ooui--checkbox-border-color);
background-image: linear-gradient(transparent, transparent), var(--ooui--checkbox-icon);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:focus + span {
border-color: var(--ooui--checkbox-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--checkbox-box-shadow--focus);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:hover + span {
border-color: var(--ooui--checkbox-border-color--hover);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:active + span {
background-color: var(--ooui--checkbox-border-color);
border-color: var(--ooui--checkbox-border-color);
box-shadow: none;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate + span {
background-color: var(--ooui--checkbox-selected-background-color);
border-color: var(--ooui--checkbox-border-color);
border-width: 2px;
background-image: linear-gradient(transparent, transparent), var(--ooui--checkbox-icon);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:focus + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:focus + span {
background-color: transparent;
border-color: var(--ooui--checkbox-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--checkbox-box-shadow--focus);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:hover + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:hover + span {
background-color: var(--ooui--button-background--hover);
border-color: var(--ooui--checkbox-border-color--hover);
background-image: var(--ooui--checkbox-icon);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:active + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:active + span {
background-color: transparent;
border-color: var(--ooui--checkbox-border-color);
box-shadow: none;
}
/* -- OOUI: DropdownInputWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/DropdownInputWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-dropdownInputWidget select {
border-color: var(--ooui--dropdown-border-color);
}
.oo-ui-dropdownInputWidget option {
color: initial;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled {
background-color: transparent;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover {
background-color: transparent;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
color: var(--theme-primary-text-color);
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {
color: var(--theme-primary-text-color);
border-color: transparent;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:active {
color: var(--theme-primary-text-color);
border-color: transparent;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus {
border-color: transparent;
box-shadow: none;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-disabled {
background-color: transparent;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-disabled select {
color: var(--ooui--dropdown-disabled-color);
border-color: transparent;
}
/* -- OOUI: DropdownWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/DropdownWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-dropdownWidget-handle {
border-color: var(--ooui--dropdown-border-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
background-color: var(--ooui--dropdown-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
background-color: var(--ooui--dropdown-background-color--hover);
color: var(--theme-primary-text-color);
border-color: var(--ooui--dropdown-border-color--hover);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active {
color: var(--theme-primary-text-color);
border-color: var(--ooui--dropdown-border-color--hover);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
border-color: var(--ooui--dropdown-border-color--focus);
box-shadow: inset 0 0 0 1px var(--ooui--dropdown-border-color--focus);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
background-color: var(--ooui--dropdown-background-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {
color: var(--ooui--dropdown-disabled-color);
text-shadow: none;
border-color: var(--ooui--dropdown-disabled-border-color);
background-color: var(--ooui--dropdown-disabled-background-color);
}
/* -- OOUI: LabelWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/LabelWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-labelWidget.oo-ui-inline-help {
color: var(--ooui--inlinehelp-color);
}
/* -- OOUI: MenuOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/MenuOptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
background-color: var(--ooui--menuselect-highlighted-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
background-color: var(--ooui--menuselect-selected-background-color);
color: var(--theme-primary-text-color);
}
.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(--ooui--menuselect-selected-background-color);
color: var(--theme-link-color);
}
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
color: var(--theme-primary-text-color);
}
/* -- OOUI: MenuSectionOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/MenuSectionOptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-menuSectionOptionWidget {
color: var(--ooui--menusectionoption-color);
}
/* -- OOUI: MenuSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/MenuSelectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-menuSelectWidget {
background-color: var(--ooui--menuselect-background-color);
border-color: var(--ooui--menuselect-border-color);
}
/* -- OOUI: MessageWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/MessageWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error {
background-color: var(--ooui--messagewidget-error-background-color);
border-color: var(--ooui--messagewidget-error-border-color);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {
background-color: var(--ooui--messagewidget-warning-background-color);
border-color: var(--ooui--messagewidget-warning-border-color);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-success {
background-color: var(--ooui--messagewidget-success-background-color);
border-color: var(--ooui--messagewidget-success-border-color);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice {
background-color: var(--ooui--messagewidget-notice-background-color);
border-color: var(--ooui--messagewidget-notice-border-color);
}
.oo-ui-messageWidget.oo-ui-flaggedElement-error:not(.oo-ui-messageWidget-block) {
color: var(--ooui--messagewidget-error-color);
}
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
color: var(--ooui--messagewidget-success-color);
}
/* -- OOUI: MultioptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/MultioptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-multioptionWidget.oo-ui-widget-disabled {
color: var(--ooui--multioption-disabled-color);
}
/* -- OOUI: OptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/OptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-optionWidget.oo-ui-widget-disabled {
color: var(--ooui--disabled-color);
}
/* -- OOUI: OutlineOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/OutlineOptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted {
background-color: var(--ooui--outlineoption-highlighted-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
background-color: var(--ooui--outlineoption-selected-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-outlineOptionWidget.oo-ui-optionWidget-pressed {
background-color: var(--ooui--outlineoption-pressed-background-color);
color: var(--theme-link-color);
}
/* -- OOUI: OutlineSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/OutlineSelectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-outlineSelectWidget:focus {
box-shadow: var(--ooui--outlineselect-box-shadow--focus);
}
/* -- OOUI: PopupWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/PopupWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-popupWidget-popup {
background-color: var(--ooui--popup-background-color);
border-color: var(--ooui--popup-border-color);
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
border-bottom-color: var(--ooui--popup-border-color);
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::after {
border-bottom-color: var(--ooui--popup-background-color);
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::before {
border-top-color: var(--ooui--popup-border-color);
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::after {
border-top-color: var(--ooui--popup-background-color);
}
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::before {
border-right-color: var(--ooui--popup-border-color);
}
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::after {
border-right-color: var(--ooui--popup-background-color);
}
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::before {
border-left-color: var(--ooui--popup-border-color);
}
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::after {
border-left-color: var(--ooui--popup-background-color);
}
/* -- OOUI: ProgressBarWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/ProgressBarWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-progressBarWidget {
border-color: var(--ooui--progressbar-border-color);
}
.oo-ui-progressBarWidget:not(.oo-ui-pendingElement-pending) {
background-color: transparent;
}
.oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {
background-color: var(--ooui--progressbar-bar-background-color);
}
.oo-ui-progressBarWidget.oo-ui-widget-disabled .oo-ui-progressBarWidget-bar {
background-color: var(--ooui--progressbar-disabled-border-color);
}
.oo-ui-progressBarWidget.oo-ui-pendingElement-pending {
background-color: var(--ooui--progressbar-pending-background-color-1);
background-image: linear-gradient(135deg, var(--ooui--progressbar-pending-background-color-2) 25%, transparent 25%, transparent 50%, var(--ooui--progressbar-pending-background-color-2) 50%, var(--ooui--progressbar-pending-background-color-2) 75%, transparent 75%, transparent);
}
/* -- OOUI: RadioInputWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/RadioInputWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-radioInputWidget [type=radio] + span {
background-color: transparent;
border-color: var(--ooui--radiobutton-border-color);
border-width: 3px;
}
.oo-ui-radioInputWidget [type=radio] + span::before {
top: 2.5px;
left: 2.5px;
right: 2.5px;
bottom: 2.5px;
}
.oo-ui-radioInputWidget [type=radio]:checked + span, .oo-ui-radioInputWidget [type=radio]:checked:hover + span, .oo-ui-radioInputWidget [type=radio]:checked:focus:hover + span {
border-width: 3px;
}
.oo-ui-radioInputWidget [type=radio]:checked + span:before, .oo-ui-radioInputWidget [type=radio]:checked:hover + span:before, .oo-ui-radioInputWidget [type=radio]:checked:focus:hover + span:before {
background-color: var(--ooui--radiobutton-border-color);
}
.oo-ui-radioInputWidget [type=radio]:disabled + span {
background-color: var(--ooui--radiobutton-disabled-background-color);
border-color: var(--ooui--radiobutton-border-color);
}
.oo-ui-radioInputWidget [type=radio]:disabled:checked + span {
background-color: var(--ooui--radiobutton-disabled-background-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:hover + span {
border-color: var(--ooui--radiobutton-border-color--hover);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:active + span {
background-color: var(--ooui--radiobutton-border-color);
border-color: var(--ooui--radiobutton-border-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked + span {
border-color: var(--ooui--radiobutton-border-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:focus + span {
box-shadow: inset 0 0 0 1px var(--ooui--radiobutton-box-shadow--focus);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:focus + span::before {
border-color: transparent;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:hover + span {
border-color: var(--ooui--radiobutton-border-color--hover);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:active + span {
border-color: var(--ooui--radiobutton-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--radiobutton-box-shadow--focus);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:active + span::before {
border-color: transparent;
}
/* -- OOUI: RadioSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/RadioSelectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-radioSelectWidget:focus [type=radio]:checked + span::before {
border-color: transparent;
}
/* -- OOUI: SelectFileWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/SelectFileWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-selectFileWidget-dropTarget {
background-color: var(--ooui--selectfile-background-color);
border: 1px solid var(--ooui--selectfile-border-color);
}
.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
background-color: var(--ooui--selectfile-background-color);
}
.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget:hover {
border-color: var(--ooui--selectfile-border-color);
}
.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop.oo-ui-selectFileWidget-dropTarget,
.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileInputWidget-info > .oo-ui-inputWidget-input {
background-color: var(--ooui--selectfile-candrop-background-color);
color: var(--theme-link-color);
}
.oo-ui-selectFileWidget.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget, .oo-ui-selectFileWidget.oo-ui-selectFileInputWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget {
background-color: var(--ooui--textarea-disabled-background-color);
border-color: var(--ooui--selectfile-border-color);
}
/* -- OOUI: TabOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TabOptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-tabOptionWidget {
color: var(--ooui--taboption-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
background-color: var(--ooui--tabselect-selected-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
border-bottom-color: var(--ooui--tabselect-selected-background-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
background-color: var(--ooui--tabselect-highlighted-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
background-color: var(--ooui--tabselect-selected-background-color);
color: var(--theme-primary-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
background-color: var(--ooui--tabselect-selected-background-color);
}
.oo-ui-tabSelectWidget-framed.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
border-bottom-color: var(--theme-primary-text-color);
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
color: var(--ooui--tabselect-frameless-selected-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-selected-box-shadow-color);
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:not(.oo-ui-optionWidget-selected):hover {
color: var(--ooui--tabselect-frameless-highlighted-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-highlighted-color);
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:not(.oo-ui-optionWidget-selected):active {
color: var(--ooui--tabselect-frameless-selected-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-selected-color);
}
.oo-ui-tabSelectWidget-frameless.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
box-shadow: inset 0 0 0 2px var(--ooui--tabselect-frameless-selected-box-shadow-color);
}
/* -- OOUI: TabSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TabSelectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-tabSelectWidget-framed {
background-color: var(--ooui--tabselect-background-color);
}
.oo-ui-tabSelectWidget-frameless {
box-shadow: inset 0 -1px 0 0 var(--ooui--tabselect-frameless-box-shadow-color);
}
/* -- OOUI: TagItemWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TagItemWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-tagItemWidget {
border-color: var(--ooui--tagitem-border-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled {
color: var(--theme-primary-text-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
background-color: var(--ooui--tagitem-background-color);
color: var(--ooui--tagitem-color--hover);
border-color: var(--ooui--tagitem-border-color--hover);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {
border-color: var(--ooui--tagitem-border-color--focus);
box-shadow: inset 0 0 0 1px var(--ooui--tagitem-border-color--focus);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed) {
background-color: var(--ooui--tagitem-background-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid {
border-color: var(--ooui--tagitem-invalid-border-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:hover {
border-color: var(--ooui--tagitem-invalid-border-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:focus {
border-color: var(--ooui--tagitem-invalid-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--tagitem-invalid-border-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
background-color: var(--ooui--textarea-background-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:focus {
border: 0;
box-shadow: none;
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
background-color: var(--ooui--tagitem-border-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-disabled {
background-color: var(--ooui--tagitem-disabled-background-color);
color: var(--ooui--tagitem-disabled-color);
border-color: var(--ooui--tagitem-disabled-border-color);
text-shadow: none;
}
/* -- OOUI: TagMultiselectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TagMultiselectWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-tagMultiselectWidget-handle {
border: 1px solid var(--ooui--textarea-border-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input {
color: var(--theme-primary-text-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input::-webkit-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input:-ms-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input::-moz-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input::placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle {
background-color: var(--ooui--textarea-readonly-background-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled {
background-color: var(--ooui--textarea-background-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle {
border-color: var(--ooui--textarea-border-color--hover);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {
border-color: var(--ooui--textarea-border-color--focus);
box-shadow: inset 0 0 0 1px var(--ooui--textarea-border-color--focus);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid .oo-ui-tagMultiselectWidget-handle, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid:hover .oo-ui-tagMultiselectWidget-handle {
border-color: var(--ooui--textarea-invalid-border-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {
background-color: var(--ooui--textarea-readonly-background-color);
background-color: transparent;
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
background-color: var(--ooui--tagitem-background-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
border-color: var(--ooui--textarea-invalid-border-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
color: var(--ooui--textarea-invalid-border-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {
background-color: var(--ooui--textarea-disabled-background-color);
color: var(--ooui--textarea-disabled-color);
text-shadow: none;
border-color: var(--ooui--textarea-disabled-border-color);
}
/* -- OOUI: TextInputWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TextInputWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: var(--ooui--textarea-background-color);
color: var(--theme-primary-text-color);
border-color: var(--ooui--textarea-border-color);
}
.oo-ui-textInputWidget .oo-ui-pendingElement-pending {
background-color: var(--ooui--textarea-pending-background-color-1);
}
.oo-ui-textInputWidget > .oo-ui-labelElement-label {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::-webkit-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:-ms-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::-moz-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {
border-color: var(--ooui--textarea-border-color--focus);
box-shadow: inset 0 0 0 1px var(--ooui--textarea-border-color--focus);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) {
background-color: var(--ooui--textarea-readonly-background-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input {
border-color: var(--ooui--textarea-border-color--hover);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {
border-color: var(--ooui--textarea-border-color--focus);
}
@media screen and (min-width: 0) {
.oo-ui-textInputWidget.oo-ui-widget-enabled textarea.oo-ui-inputWidget-input:focus {
outline-color: var(--ooui--textarea-border-color--focus);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea.oo-ui-inputWidget-input:focus {
outline-color: var(--ooui--textarea-invalid-border-color);
}
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
border-color: var(--ooui--textarea-invalid-border-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:hover {
border-color: var(--ooui--textarea-invalid-border-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:focus {
border-color: var(--ooui--textarea-invalid-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--textarea-invalid-border-color);
}
.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input {
background-color: var(--ooui--textarea-disabled-background-color);
-webkit-text-fill-color: var(--ooui--textarea-disabled-color);
color: var(--ooui--textarea-disabled-color);
text-shadow: none;
border-color: var(--ooui--textarea-disabled-border-color);
}
.oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-labelElement-label {
color: var(--ooui--textarea-placeholder-color);
text-shadow: none;
}
/* -- OOUI: ToggleButtonWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/ToggleButtonWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-toggleButtonWidget.oo-ui-widget-enabled.oo-ui-buttonElement-frameless.oo-ui-toggleWidget-on .oo-ui-buttonElement-button {
background-color: transparent;
color: var(--ooui--button-frameless-on-color);
}
/* -- OOUI: ToggleSwitchWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/ToggleSwitchWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-toggleSwitchWidget {
background-color: transparent;
border: 3px solid var(--ooui--toggleswitch-border-color);
}
.oo-ui-toggleSwitchWidget-grip {
top: 0.2142857143em;
}
.oo-ui-toggleSwitchWidget.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
left: 1.7142857143em;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
background-color: transparent;
border: 3px solid var(--ooui--toggleswitch-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
background-color: transparent;
border-color: var(--ooui--toggleswitch-border-color--hover);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
background-color: transparent;
border-color: var(--ooui--toggleswitch-border-color--hover);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus {
background-color: var(--ooui--toggleswitch-color--active);
border-color: var(--ooui--toggleswitch-color--active);
box-shadow: inset 0 0 0 1px var(--ooui--toggleswitch-color--active);
}
.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 {
background-color: var(--ooui--toggleswitch-grip-color);
border-color: var(--ooui--toggleswitch-grip-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
border-color: var(--ooui--toggleswitch-border-color);
box-shadow: inset 0 0 0 1px var(--ooui--toggleswitch-box-shadow--focus);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {
border-color: var(--ooui--toggleswitch-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
background-color: var(--ooui--toggleswitch-border-color);
border-color: var(--ooui--toggleswitch-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
background-color: var(--ooui--toggleswitch-grip-color);
border-color: var(--ooui--toggleswitch-grip-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {
background-color: var(--ooui--toggleswitch-border-color--hover);
border-color: var(--ooui--toggleswitch-border-color--hover);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active:hover {
background-color: var(--ooui--toggleswitch-color--active);
border-color: var(--ooui--toggleswitch-color--active);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus {
border-color: var(--ooui--toggleswitch-border-color);
box-shadow: none;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus::before {
border-color: var(--ooui--toggleswitch-grip-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
background-color: var(--ooui--toggleswitch-disabled-background-color);
border-color: var(--ooui--toggleswitch-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
background-color: transparent;
border: 3px solid var(--ooui--toggleswitch-border-color);
box-shadow: none;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
background-color: var(--ooui--toggleswitch-disabled-grip-color);
}
/* -- OOUI: WindowManager -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/WindowManager.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/windows.less */
.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
background-color: var(--ooui--window-background-color);
}
.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
border-color: var(--ooui--window-border-color);
}
/* -------------------------------------------------------------------------------- */
/* -- RCFilters -- */
/* Filtering interface at the top of [[Special:RecentChanges]], [[Special:Watchlist]], and [[Special:RelatedChanges]].
* For documentation of the project, see https://www.mediawiki.org/wiki/Edit_Review_Improvements/New_filters_for_edit_review */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.less */
.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
border-color: var(--ooui--dialog-border-color--lighter);
}
.client-js .mw-rcfilters-spinner .mw-rcfilters-spinner-bounce, .client-js .mw-rcfilters-spinner:before, .client-js .mw-rcfilters-spinner:after {
background-color: var(--ooui--checkbox-border-color);
}
/* -- RCFilters: ChangesListWrapperWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.less */
.mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator {
border-top-color: var(--oouihelper--disabled);
}
.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey td:not(:nth-child(-n+2)) {
background-color: var(--oouihelper--themerelated-disabled);
}
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
background-color: var(--ooui--messagewidget-notice-background-color);
border-radius: 4px;
border: 2px solid var(--ooui--messagewidget-notice-border-color);
}
.mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c1,
.mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c1 tr:first-child,
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c1.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c1.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
background-color: var(--theme-notice-blue-background-color);
}
.mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c2,
.mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c2 tr:first-child,
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c2.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c2.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
background-color: var(--theme-notice-green-background-color);
}
.mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c3,
.mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c3 tr:first-child,
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c3.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c3.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
background-color: var(--theme-notice-yellow-background-color);
}
.mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c4,
.mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c4 tr:first-child,
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c4.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c4.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
background-color: var(--theme-notice-orange-background-color);
}
.mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c5,
.mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c5 tr:first-child,
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c5.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
.mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c5.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
background-color: var(--theme-notice-red-background-color);
}
/* the mixing of two and more colors is impossible with CSS variables, unless of course each mixed color is hardcoded */
/* -- RCFilters: DatePopupWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.DatePopupWidget.less */
.mw-rcfilters-ui-datePopupWidget {
border-top-color: var(--ooui--textarea-border-color);
}
.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {
color: var(--theme-primary-text-color-note);
}
/* -- RCFilters: FilterItemHighlightButton -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterItemHighlightButton.less */
.oo-ui-buttonWidget.oo-ui-popupButtonWidget .oo-ui-buttonElement-button > .mw-rcfilters-ui-filterItemHighlightButton-circle {
/* override the rule from base OOUI where we apply a filter to all ".oo-ui-iconElement-icon"
* elements, which prevents this circle's color from being displayed properly */
filter: none;
}
/* -- RCFilters: FilterMenuHeaderWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less */
.mw-rcfilters-ui-filterMenuHeaderWidget-title {
color: var(--theme-body-header-text-color);
text-transform: uppercase;
font: var(--theme-header-font);
letter-spacing: var(--theme-body-header-letter-spacing);
}
.mw-rcfilters-ui-filterMenuHeaderWidget-header {
border-bottom-color: var(--ooui--textarea-border-color);
background-color: var(--ooui--textarea-readonly-background-color);
}
/* -- RCFilters: FilterMenuOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuOptionWidget.less */
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {
background-color: transparent;
}
.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 {
color: var(--ooui--dropdown-disabled-color);
}
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-highlighted {
background-color: var(--ooui--menuselect-highlighted-background-color);
color: var(--theme-primary-text-color);
}
/* -- RCFilters: FilterMenuSectionOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuSectionOptionWidget.less */
.mw-rcfilters-ui-filterMenuSectionOptionWidget {
background-color: var(--ooui--dropdown-disabled-background-color);
}
.mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label {
color: var(--ooui--dropdown-disabled-color);
}
/* -- RCFilters: FilterTagMultiselectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterTagMultiselectWidget.less */
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
background-color: var(--ooui--textarea-readonly-background-color);
border-color: var(--ooui--textarea-border-color);
}
.mw-rcfilters-collapsed .mw-rcfilters-ui-filterTagMultiselectWidget {
border-bottom-color: var(--ooui--textarea-border-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled .mw-rcfilters-ui-filterTagMultiselectWidget-emphasize.oo-ui-tagMultiselectWidget-handle {
background-color: var(--ooui--textarea-background-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
color: var(--theme-primary-text-color-note);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-savedQueryTitle {
color: var(--theme-primary-text-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {
border-color: var(--ooui--textarea-border-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-emptyFilters {
color: var(--theme-primary-text-color-note);
}
/* -- RCFilters: FilterTagMultiselectWidgetMobile -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterTagMultiselectWidgetMobile.less */
.mw-rcfilters-ui-filterTagMultiselectWidget-mobile .oo-ui-tagMultiselectWidget-input.oo-ui-textInputWidget input[readonly] {
background-color: var(--ooui--textarea-readonly-background-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-mobile .oo-ui-tagMultiselectWidget-input.oo-ui-textInputWidget input[readonly]::-webkit-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-mobile .oo-ui-tagMultiselectWidget-input.oo-ui-textInputWidget input[readonly]:-ms-input-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-mobile .oo-ui-tagMultiselectWidget-input.oo-ui-textInputWidget input[readonly]::-moz-placeholder {
color: var(--ooui--textarea-placeholder-color);
}
.mw-rcfilters-ui-filterTagMultiselectWidget-mobile .oo-ui-tagMultiselectWidget-input.oo-ui-textInputWidget input[readonly]::placeholder {
color: var(--ooui--textarea-placeholder-color);
}
/* -- RCFilters: HighlightColorPickerWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.HighlightColorPickerWidget.less */
.mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color .oo-ui-iconElement-icon.oo-ui-icon-check {
/* Override the rule from base OOUI where we apply a filter to all ".oo-ui-iconElement-icon"
* elements. This is not necessary here because the six circles have the same color in all
* themes, so this checkmark needs to be the same in all themes as well. */
filter: none;
}
/* -- RCFilters: ItemMenuOptionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ItemMenuOptionWidget.less */
.mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) {
border-bottom-color: var(--ooui--menuselect-border-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget-view-namespaces {
border-top-width: 3px;
border-top-color: var(--ooui--menuselect-border-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget:hover {
background-color: var(--ooui--menuselect-highlighted-background-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected {
background-color: var(--ooui--menuselect-selected-background-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget-label-title {
color: var(--theme-primary-text-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
color: var(--theme-primary-text-color-note);
}
.mw-rcfilters-ui-itemMenuOptionWidget-excludeLabel {
color: var(--theme-primary-text-color-note);
}
/* -- RCFilters: LiveUpdateButtonWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.LiveUpdateButtonWidget.less */
.mw-rcfilters-ui-liveUpdateButtonWidget.oo-ui-toggleWidget-on:after {
background: rgba(var(--theme-link-color--rgb), 0.5);
}
/* -- RCFilters: MenuSelectWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.MenuSelectWidget.less */
.mw-rcfilters-ui-menuSelectWidget-noresults {
color: var(--theme-primary-text-color-note);
}
.mw-rcfilters-ui-menuSelectWidget-footer {
background-color: var(--ooui--textarea-readonly-background-color);
border-top-color: var(--ooui--textarea-border-color);
}
/* -- RCFilters: SavedLinksListItemWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.SavedLinksListItemWidget.less */
.mw-rcfilters-ui-savedLinksListItemWidget:hover {
/* Mimicking OOUI optionWidget styles */
background-color: var(--ooui--menuselect-highlighted-background-color);
color: var(--theme-primary-text-color);
}
.mw-rcfilters-ui-savedLinksListItemWidget-label {
color: var(--theme-link-color);
}
/* -- RCFilters: TagItemWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.TagItemWidget.less */
.mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled {
background-color: var(--ooui--tagitem-disabled-background-color);
border-color: var(--ooui--tagitem-disabled-border-color);
}
.mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-labelElement-label {
color: var(--ooui--tagitem-disabled-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
background-color: var(--ooui--tagitem-background-color);
border-color: var(--ooui--tagitem-border-color--focus);
}
.mw-rcfilters-ui-tagItemWidget-popup-content {
color: var(--theme-primary-text-color-note);
}
/* -- RCFilters: ViewSwitchWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ViewSwitchWidget.less */
.mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget {
color: var(--theme-primary-text-color);
}
/* -- RCFilters: WatchlistTopSectionWidget -- */
/* Override styling of:
* https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/refs/heads/master/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.WatchlistTopSectionWidget.less */
.mw-rcfilters-ui-watchlistTopSectionWidget-separator {
border-top-color: var(--ooui--textarea-border-color);
}