User:Tobias Alcaraz/common.css
Jump to navigation
Jump to search
If you find a typo, inconsistency, or error, please sign up and help out the wiki! We can't do it without your help! :D Thank you!
Note: After saving, 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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
@font-face { font-family: 'Volter (Goldfish)'; src: url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.eot'); src: url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.eot?#iefix') format('embedded-opentype'), url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.woff2') format('woff2'), url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.woff') format('woff'), url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.ttf') format('truetype'), url('//db.onlinewebfonts.com/t/0f6a4cfc353039c57fc8eb74dfad73f0.svg#Volter (Goldfish)') format('svg'); font-display: swap; font-style: normal; font-weight: 400; } @font-face { font-family: 'basis33'; src: url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.eot'); src: url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.eot?#iefix') format('embedded-opentype'), url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.woff2') format('woff2'), url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.woff') format('woff'), url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.ttf') format('truetype'), url('//db.onlinewebfonts.com/t/d08bafd725a4cfc309efb5a88e0b63a5.svg#basis33') format('svg'); font-display: swap; font-style: normal; font-weight: 400; } :root { /* --theme-primary: #6200ee; --theme-primary-variant: #3700b3; --theme-secondary: #03dac6; --theme-secondary-variant: #018786; */ --theme-background: #fff; --theme-surface: #fff; --theme-error: #b00020; --theme-on-primary: #fff; --theme-on-secondary: #000; --theme-on-background: #000; --theme-on-surface: #000; --theme-on-error: #fff; --theme-text-primary-on-background: rgba(0, 0, 0, .87); --theme-text-secondary-on-background: rgba(0, 0, 0, .54); --theme-text-hint-on-background: rgba(0, 0, 0, .38); --theme-text-disabled-on-background: rgba(0, 0, 0, .38); --theme-text-icon-on-background: rgba(0, 0, 0, .38); --theme-text-primary-on-light: rgba(0, 0, 0, .87); --theme-text-secondary-on-light: rgba(0, 0, 0, .54); --theme-text-hint-on-light: rgba(0, 0, 0, .38); --theme-text-disabled-on-light: rgba(0, 0, 0, .38); --theme-text-icon-on-light: rgba(0, 0, 0, .38); --theme-text-primary-on-dark: white; --theme-text-secondary-on-dark: rgba(255, 255, 255, .7); --theme-text-hint-on-dark: rgba(255, 255, 255, .5); --theme-text-disabled-on-dark: rgba(255, 255, 255, .5); --theme-text-icon-on-dark: rgba(255, 255, 255, .5); --theme-border-color: rgba(0, 0, 0, .12); --theme-elevation-0dp_-_background-color: var(--theme-background, #fff); --theme-elevation-1dp_-_background-color: var(--theme-background, #fff); --theme-elevation-2dp_-_background-color: var(--theme-background, #fff); --theme-elevation-3dp_-_background-color: var(--theme-background, #fff); --theme-elevation-4dp_-_background-color: var(--theme-background, #fff); --theme-elevation-6dp_-_background-color: var(--theme-background, #fff); --theme-elevation-8dp_-_background-color: var(--theme-background, #fff); --theme-elevation-12dp_-_background-color: var(--theme-background, #fff); --theme-elevation-16dp_-_background-color: var(--theme-background, #fff); --theme-elevation-24dp_-_background-color: var(--theme-background, #fff); --theme-elevation-0dp_-_box-shadow: 0 0 0 0 rgba(0, 0, 0, .2), 0 0 0 0 rgba(0, 0, 0, .14), 0 0 0 0 rgba(0, 0, 0, .12); --theme-elevation-1dp_-_box-shadow: 0 2px 1px -1px rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 1px 3px 0 rgba(0, 0, 0, .12); --theme-elevation-2dp_-_box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12); --theme-elevation-3dp_-_box-shadow: 0 3px 3px -2px rgba(0, 0, 0, .2), 0 3px 4px 0 rgba(0, 0, 0, .14), 0 1px 8px 0 rgba(0, 0, 0, .12); --theme-elevation-4dp_-_box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12); --theme-elevation-6dp_-_box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12); --theme-elevation-8dp_-_box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12); --theme-elevation-12dp_-_box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 12px 17px 2px rgba(0, 0, 0, .14), 0 5px 22px 4px rgba(0, 0, 0, .12); --theme-elevation-16dp_-_box-shadow: 0 8px 10px -5px rgba(0, 0, 0, .2), 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12); --theme-elevation-24dp_-_box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12); --theme-elevation_-_-shadow-transition: 280ms var(--theme-standard-curve-timing-function, cubic-bezier(.4, 0, .2, 1)); --theme-page-text-opacity-primary: .87; --theme-page-text-opacity-secondary: .6; --theme-page-text-opacity-disabled: .38; --deceleration-curve-timing-function: cubic-bezier(0, 0, .2, 1); --standard-curve-timing-function: cubic-bezier(.4, 0, .2, 1); --acceleration-curve-timing-function: cubic-bezier(.4, 0, 1, 1); --sharp-curve-timing-function: cubic-bezier(.4, 0, .6, 1); /* Custom colors. */ --theme-dynamic-color: #000; --theme-dynamic-color--rgb: 0, 0, 0; --theme-dynamic-color__inverse: #fff; --theme-dynamic-color__inverse--rgb: 255, 255, 255; --theme-color__text: #000; --theme-color__text--rgb: 0, 0, 0; --theme-color__red: #f44330; --theme-color__red--rgb: 244, 67, 48; --theme-color__pink: #e91e63; --theme-color__pink--rgb: 233, 30, 99; --theme-color__purple: #e91e63; --theme-color__purple--rgb: 233, 30, 99; --theme-color__deep-purple: #673ab7; --theme-color__deep-purple--rgb: 103, 58, 183; --theme-color__indigo: #3f51b5; --theme-color__indigo--rgb: 63, 81, 181; --theme-color__blue: #2196f3; --theme-color__blue--rgb: 33, 150, 243; --theme-color__dark-blue: #0d47a1; --theme-color__dark-blue--rgb: 13, 71, 161; --theme-color__light-blue: #03a9f4; --theme-color__light-blue--rgb: 3, 169, 244; --theme-color__cyan: #00bcd4; --theme-color__cyan--rgb: 0, 188, 212; --theme-color__teal: #009688; --theme-color__teal--rgb: 0, 150, 136; --theme-color__green: #4caf50; --theme-color__green--rgb: 76, 175, 80; --theme-color__light-green: #8bc34a; --theme-color__light-green--rgb: 139, 195, 74; --theme-color__lime: #cddc39; --theme-color__lime--rgb: 205, 220, 57; --theme-color__yellow: #ffeb3b; --theme-color__yellow--rgb: 255, 235, 59; --theme-color__amber: #ffc107; --theme-color__amber--rgb: 255, 193, 7; --theme-color__orange: #ff9800; --theme-color__orange--rgb: 255, 152, 0; --theme-color__deep-orange: #ff5722; --theme-color__deep-orange--rgb: 255, 87, 34; --theme-color__brown: #795548; --theme-color__brown--rgb: 121, 85, 72; --theme-color__grey: #9e9e9e; --theme-color__grey--rgb: 158, 158, 158; --theme-color__blue-grey: #607d8b; --theme-color__blue-grey--rgb: 96, 125, 139; --theme-color__white: #fff; --theme-color__white--rgb: 255, 255, 255; --theme-color__black: #000; --theme-color__black--rgb: 0, 0, 0; --theme-color__cta: var(--theme-color__dark-blue); --theme-color__cta--rgb: var(--theme-color__dark-blue--rgb); } html, body { accent-color: var(--theme-color__light-blue); color-scheme: light dark; } /* Dark theme-only configurations. */ /* * Since IE nor any old browser supports Dark Mode, we're free to use modern * code without needing polyfills and/or backwards compatibility. */ @media (prefers-color-scheme: dark) { :root { /* --theme-primary: #bb86fc; --theme-primary-variant: #3700b3; --theme-secondary: #03dac6; --theme-secondary-variant: var(--theme-secondary, #03dac6); */ --theme-background: #121212; --theme-surface: #121212; --theme-error: #cf6679; --theme-on-primary: #000; --theme-on-secondary: #000; --theme-on-background: #fff; --theme-on-surface: #fff; --theme-on-error: #000; --theme-text--rgb: 255, 255, 255; --theme-text-primary-on-background: rgba(255, 255, 255, .87); --theme-text-primary-on-background-inverse: rgba(0, 0, 0, .87); --theme-text-secondary-on-background: rgba(255, 255, 255, .6); --theme-text-secondary-on-background-inverse: rgba(0, 0, 0, .6); --theme-text-hint-on-background: rgba(255, 255, 255, .38); --theme-text-hint-on-background-inverse: rgba(0, 0, 0, .38); --theme-text-disabled-on-background: rgba(255, 255, 255, .38); --theme-text-disabled-on-background-inverse: rgba(0, 0, 0, .38); --theme-text-icon-on-background: rgba(255, 255, 255, .38); --theme-text-icon-on-background-inverse: rgba(0, 0, 0, .38); --theme-text-primary-on-light: rgba(0, 0, 0, .87); --theme-text-secondary-on-light: rgba(0, 0, 0, .6); --theme-text-hint-on-light: rgba(0, 0, 0, .38); --theme-text-disabled-on-light: rgba(0, 0, 0, .38); --theme-text-icon-on-light: rgba(0, 0, 0, .38); --theme-text-primary-on-dark: #fff; --theme-text-secondary-on-dark: rgba(255, 255, 255, .7); --theme-text-hint-on-dark: rgba(255, 255, 255, .5); --theme-text-disabled-on-dark: rgba(255, 255, 255, .5); --theme-text-icon-on-dark: rgba(255, 255, 255, .5); --theme-border-color: rgba(255, 255, 255, .12); --theme-elevation-0dp_-_background-color: var(--theme-background, #121212); /* var(--theme-background) + rgba(255, 255, 255, 0) */ --theme-elevation-1dp_-_background-color: #1e1e1e; /* var(--theme-background) + rgba(255, 255, 255, .05) */ --theme-elevation-2dp_-_background-color: #232323; /* var(--theme-background) + rgba(255, 255, 255, .07) */ --theme-elevation-3dp_-_background-color: #252525; /* var(--theme-background) + rgba(255, 255, 255, .08) */ --theme-elevation-4dp_-_background-color: #272727; /* var(--theme-background) + rgba(255, 255, 255, .09) */ --theme-elevation-6dp_-_background-color: #2c2c2c; /* var(--theme-background) + rgba(255, 255, 255, .11) */ --theme-elevation-8dp_-_background-color: #2f2f2f; /* var(--theme-background) + rgba(255, 255, 255, .12) */ --theme-elevation-12dp_-_background-color: #333; /* var(--theme-background) + rgba(255, 255, 255, .14) */ --theme-elevation-16dp_-_background-color: #353535; /* var(--theme-background) + rgba(255, 255, 255, .15) */ --theme-elevation-24dp_-_background-color: #383838; /* var(--theme-background) + rgba(255, 255, 255, .16) */ /* Custom colors. */ --theme-dynamic-color: #fff; --theme-dynamic-color--rgb: 255, 255, 255; --theme-dynamic-color__inverse: #000; --theme-dynamic-color__inverse--rgb: 0, 0, 0; --theme-color__text: #fff; --theme-color__text--rgb: 255, 255, 255; --theme-color__red: #ef9a9a; --theme-color__red--rgb: 239, 154, 154; --theme-color__pink: #f48fb1; --theme-color__pink--rgb: 244, 143, 177; --theme-color__purple: #ce93d8; --theme-color__purple--rgb: 206, 147, 216; --theme-color__deep-purple: #b39ddb; --theme-color__deep-purple--rgb: 179, 157, 219; --theme-color__indigo: #9fa8da; --theme-color__indigo--rgb: 159, 168, 218; --theme-color__indigo--inverse: #605725; --theme-color__indigo--inverse--rgb: 96, 87, 37; --theme-color__blue: #90caf9; --theme-color__blue--rgb: 144, 202, 249; --theme-color__blue--inverse: #6f3506; --theme-color__blue--inverse--rgb: 111, 53, 6; --theme-color__light-blue: #81d4fa; --theme-color__light-blue--rgb: 129, 212, 250; --theme-color__light-blue--inverse: #7e2b05; --theme-color__light-blue--inverse--rgb: 126, 43, 5; --theme-color__cyan: #80deea; --theme-color__cyan--rgb: 128, 222, 234; --theme-color__teal: #80cbc4; --theme-color__teal--rgb: 128, 203, 196; --theme-color__green: #a5d6a7; --theme-color__green--rgb: 165, 214, 167; --theme-color__light-green: #c5e1a5; --theme-color__light-green--rgb: 197, 225, 165; --theme-color__lime: #e6ee9c; --theme-color__lime--rgb: 230, 238, 156; --theme-color__yellow: #fff59d; --theme-color__yellow--rgb: 255, 245, 157; --theme-color__amber: #ffe082; --theme-color__amber--rgb: 255, 224, 130; --theme-color__orange: #ffcc80; --theme-color__orange--rgb: 255, 204, 128; --theme-color__deep-orange: #ffab91; --theme-color__deep-orange--rgb: 255, 171, 145; --theme-color__brown: #bcaaa4; --theme-color__brown--rgb: 188, 170, 164; --theme-color__grey: #eee; --theme-color__grey--rgb: 237, 237, 237; --theme-color__blue-grey: #b0bec5; --theme-color__blue-grey--rgb: 176, 190, 197; --theme-color__cta: var(--theme-color__light-blue); --theme-color__cta--rgb: var(--theme-color__light-blue--rgb); } html, body { color-scheme: dark light; } body { background-image: url(/1/wiki/index.php?title=Special:Filepath/Background-dark.png); } #p-logo a { filter: brightness(.75); } .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon, .vectorMenu h3 span:after, #mw-indicator-mw-helplink a, .oo-ui-indicator-down, .oo-ui-icon-play, .mw-ui-icon-play:before, .oo-ui-icon-menu, .mw-ui-icon-menu:before, .oo-ui-icon-bookmark, .mw-ui-icon-bookmark:before, .oo-ui-icon-trash, .mw-ui-icon-trash:before, .oo-ui-icon-article, .mw-ui-icon-article:before, .oo-ui-icon-tag, .mw-ui-icon-tag:before, .oo-ui-icon-settings, .mw-ui-icon-settings:before, .oo-ui-icon-close, .mw-ui-icon-close:before, .oo-ui-icon-search, .mw-ui-icon-search:before, .oo-ui-icon-helpNotice, .mw-ui-icon-helpNotice:before, .oo-ui-icon-highlight, .mw-ui-icon-highlight:before, .oo-ui-icon-history, .mw-ui-icon-history:before, .client-js .sortable:not(.jquery-tablesorter) > thead > :last-of-type > th:not(.unsortable), .oo-ui-indicator-required, .oo-ui-icon-next, .mw-ui-icon-next:before, .oo-ui-icon-collapse, .mw-ui-icon-collapse:before, .mw-content-ltr .redirectText li:first-child, .oo-ui-icon-edit, .mw-ui-icon-edit:before, body .ui-dialog .ui-icon-closethick, .oo-ui-icon-checkAll, .mw-ui-icon-checkAll:before, .oo-ui-widget-disabled .oo-ui-icon-first, .oo-ui-widget-disabled .mw-ui-icon-first:before, .oo-ui-widget-disabled .oo-ui-icon-previous, .oo-ui-widget-disabled .mw-ui-icon-previous:before, .oo-ui-widget-disabled .oo-ui-icon-next, .oo-ui-widget-disabled .mw-ui-icon-next:before, .oo-ui-widget-disabled .oo-ui-icon-last, .oo-ui-widget-disabled .mw-ui-icon-last:before, .oo-ui-image-invert.oo-ui-icon-check, .mw-ui-icon-check-invert:before, .mw-ui-checkbox:not(#noop) [type='checkbox']:checked + label:before, .oo-ui-image-invert.oo-ui-icon-stop, .mw-ui-icon-stop-invert:before, .oo-ui-icon-previous, .mw-ui-icon-previous:before, .mw-content-ltr div.magnify a, .oo-ui-buttonElement-framed.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon, .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator, .mw-spinner-container { filter: invert(1); } body .ui-dialog .ui-icon-closethick { background: center/contain no-repeat !important; } /* Colored icons code: pastebin.com/MxXr8ebm */ } .mw-body { background-color: var(--theme-background); border: none; color: var(--theme-text-primary-on-background); } a, .mw-body a, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, #mw-navigation #mw-panel .portal .body li a, .wikiEditor-ui-toolbar .tabs span.tab a, .vectorMenu li a, .toctogglelabel, .mw-parser-output a.external, .mw-parser-output a.extiw, .mw-parser-output a.extiw:active { color: var(--theme-color__cta); } @media (prefers-color-scheme: dark) { #mw-indicator-mw-helplink a { color: var(--theme-color__light-blue--inverse); font-weight: 600; } } a:visited, .mw-body a:visited, .wikiEditor-ui-toolbar .tabs span.tab a:visited, #mw-navigation #mw-panel .portal .body li a:visited, .mw-parser-output a:visited.external, .vectorMenu li a:visited { color: var(--theme-color__purple); } a.new, a.new:visited, .vectorTabs li.new a, .vectorTabs li.new a:visited { color: var(--theme-error); } code, pre, .mw-code { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); font: 700 .875rem/1.5 monospace; letter-spacing: .0333333333em; overflow-x: auto; padding: 0 4px; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; word-wrap: break-word; } q { font-style: italic; quotes: "“" "”" "‘" "’"; } q:before { content: open-quote; } q:after { content: close-quote; } /* Page head. */ #mw-page-base, #mw-head-base, #content, #mw-head { min-width: 600px; } div.suggestions { font-size: .875rem; } .suggestions-results, .suggestions-special { background-color: var(--theme-elevation-4dp_-_background-color); border-color: var(--theme-border-color); } .suggestions-special { border: 0; margin: 0; } .suggestions-result, .suggestions a.mw-searchSuggest-link, .suggestions a.mw-searchSuggest-link:hover, .suggestions a.mw-searchSuggest-link:active, .suggestions a.mw-searchSuggest-link:focus { color: var(--theme-text-primary-on-background); } .suggestions-result-current { background-color: rgba(var(--theme-color__light-blue--rgb), .16); } .suggestions-special .special-label { color: var(--theme-text-secondary-on-background); } .suggestions-special .special-query { color: var(--theme-text-primary-on-background); } #left-navigation, #right-navigation { margin-top: 2.438em; } #left-navigation { margin-left: 10.938em; } .vectorTabs, .vectorTabs ul, #mw-head .vectorMenu h3 { background-image: none; } .vectorTabs span, .vectorTabs li, .vectorTabs li.selected { background-color: transparent; background-image: none; } .vectorTabs li, .vectorTabs li.selected, .vectorMenu { background-color: var(--theme-background); background-image: none; position: relative; } .vectorTabs li a:hover { background-color: rgba(var(--theme-dynamic-color--rgb), .08); } .vectorTabs li a:focus, .vectorTabs li a:active { background-color: rgba(var(--theme-dynamic-color--rgb), .16); } .vectorTabs li.selected a:hover { background-color: rgba(var(--theme-color__cta--rgb), .08); } .vectorTabs li.selected a:focus, .vectorTabs li.selected a:active { background-color: rgba(var(--theme-color__cta--rgb), .16); } .vectorTabs li a { color: var(--theme-text-primary-on-background); outline: none; padding: 10px 16px 5px; text-decoration: none; transition: background-color 75ms; } .vectorMenu h3 span { color: var(--theme-on-background); padding: 10px 24px 6px 8px; } .vectorMenu h3 span:after { top: 4px; } #ca-talk { left: -1px; } .vectorTabs li.selected a, .vectorTabs li.selected a:visited { color: var(--theme-color__cta); } .vectorTabs li.selected:after { background-color: var(--theme-color__cta); border-radius: 2px 2px 0 0; bottom: 0; content: ''; height: 2px; left: 12px; position: absolute; width: calc(100% - 24px); } .vectorTabs #ca-unwatch.icon a, .vectorTabs #ca-watch.icon a { padding: 32px 0 0; } .vectorMenu .menu { background-color: var(--theme-elevation-8dp_-_background-color); border: none; box-shadow: var(--theme-elevation-8dp_-_box-shadow); } #p-search { background-color: var(--theme-background); margin: 0; padding: 8px 16px; } #p-search form, #p-search input { margin: 0; } #simpleSearch { background-color: var(--theme-elevation-1dp_-_background-color); background-image: none; border-color: var(--theme-border-color); margin: 0; } #simpleSearch #searchInput { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-text-secondary-on-background); } #simpleSearch #searchButton { background-color: var(--theme-elevation-1dp_-_background-color); } /* Page rail. */ #mw-panel .portal { background-color: var(--theme-background); margin: 0 8px; padding: 0; } #mw-panel .portal h3 { color: var(--theme-on-background); } #mw-panel .portal .body, #mw-panel #p-logo + .portal .body { background-image: none; margin: 0 6px; } #mw-panel .portal .body ul { padding: 0; } #mw-panel .portal .body li { padding: 6px 0; } /* Page body. */ h1, h2, h3, h4, h5, h6 { border-color: var(--theme-border-color); color: var(--theme-on-background); } hr { background-color: var(--theme-border-color); border-color: var(--theme-border-color); color: var(--theme-border-color); } /** Top message. **/ #mw-content-text > :first-child { background-color: rgba(var(--theme-color__light-blue--rgb), .16) !important; } #mw-content-text > :first-child > span { color: var(--theme-text-primary-on-background) !important; } /** Redirected message. **/ #contentSub, #contentSub2 { color: var(--theme-text-secondary-on-background); margin: 0 0 1.4em; } /** Page contents. **/ .error { color: var(--theme-color__red); } .warning { color: var(--theme-color__orange); } .success { color: var(--theme-color__green); } /*** Infobox. ***/ .infobox { --infobox-background: var(--theme-elevation-8dp_-_background-color); --infobox-secondary-background: #55aaee; --infobox-secondary-background-label: #000; --infobox-border-color: var(--theme-border-color); background-color: var(--infobox-background); border: 2px solid #fff; /*box-shadow: var(--theme-elevation-8dp_-_box-shadow);*/ clear: right; float: right; font-family: sans-serif; margin: 0 0 18px 18px; text-align: left; width: 270px; } .infobox > p { display: none; } .infobox-inner { border: 2px solid #000; border-spacing: 0; width: 100%; } .infobox-title { background-color: var(--infobox-secondary-background); border: 0; color: var(--infobox-secondary-background-label); font: 700 1.125rem/1.25 sans-serif; margin: 0; } .infobox-title th { font-size: 125%; padding: 12px 9px 14px; position: relative; text-align: center; } .infobox-title th:after { background-color: #000; bottom: 0; content: ''; height: 2px; left: 0; position: absolute; width: 100%; } .infobox-item { position: relative; } .infobox-item + p { display: none; } .infobox-label { -webkit-hyphens: auto; font: 700 .75rem/1.5 sans-serif; hyphens: auto; margin: 0; overflow: hidden; overflow-wrap: break-word; padding: 8px; vertical-align: top; width: 90px; } .infobox-value { -webkit-hyphens: auto; flex-basis: 180px; font: 400 .75rem/1.5 sans-serif; hyphens: auto; overflow-wrap: break-word; padding: 8px; vertical-align: top; } /*** TOC. ***/ .toc, .mw-warning, toccolours, #filetoc { background-color: var(--theme-background); border-color: var(--theme-border-color); } .tocnumber { color: var(--theme-text-secondary-on-background); } /*** Tables. ***/ .wikitable { background-color: var(--theme-background); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } .wikitable > tr > th, .wikitable > * > tr > th { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-on-background); } .wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td { border-color: var(--theme-border-color); } .mw-datatable, .mw-datatable td, .mw-datatable th { border-color: var(--theme-border-color); } .mw-datatable th { background-color: rgba(var(--theme-color__light-blue--rgb), .08); } .mw-datatable td { background-color: var(--theme-background); } #mw-allmessagestable tbody:hover td, .mw-datatable tr:hover td { background-color: rgba(var(--theme-color__light-blue--rgb), .08); } /* Lists. */ :where(.mw-body ul li)::marker { content: '•\00a0\00a0'; font-size: 1em; font-weight: bold; } .mw-body .toc ul li::marker { content: initial; font-size: initial; font-weight: initial; } /* Galleries and images. */ li.gallerybox div.thumb { background-color: var(--theme-background); border-color: var(--theme-border-color); } .gallerybox .gallerytext { color: var(--theme-text-secondary-on-background); } div.thumbinner { background-color: var(--theme-elevation-2dp_-_background-color); border-color: var(--theme-border-color); } html .thumbimage { background-color: var(--theme-background); border-color: var(--theme-border-color); } html .thumbcaption { color: var(--theme-text-secondary-on-background); padding: 6px 0 3px; } /*** Category links. ***/ .catlinks { background-color: transparent; border: none; border-top: 1px solid var(--theme-border-color); padding-top: 14px; } /* Editor. */ .mw-destfile-warning, .warningbox { background-color: rgba(var(--theme-color__orange--rgb), .08); border: none; border-left: 4px solid var(--theme-color__orange); color: rgba(var(--theme-color__orange--rgb), .87); } .warningbox { display: block; } textarea, fieldset { border-color: var(--theme-border-color); } .wikiEditor-ui .wikiEditor-ui-view, .wikiEditor-ui .wikiEditor-ui-top, .wikiEditor-ui-toolbar .group { border-color: var(--theme-border-color); } .wikiEditor-ui-toolbar { background-color: var(--theme-elevation-8dp_-_background-color); background-image: none; } .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement:hover, .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement:focus-within { background-color: rgba(var(--theme-dynamic-color--rgb), .12); outline-color: var(--theme-border-color); } .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button { outline: none; } .wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited { color: var(--theme-on-background); } .wikiEditor-ui-toolbar .sections .section { background-color: rgba(var(--theme-color__light-blue--rgb), .08); border-color: var(--theme-border-color); } .wikiEditor-ui-toolbar .group .label { color: var(--theme-text-primary-on-background); } .mw-editform #wpTextbox0 { margin-left: -4px !important; } .mw-editform #wpTextbox0, .mw-editform #wpTextbox1 { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); font: 500 .875rem/1.5 monospace; letter-spacing: .0333333333em; padding: 0 4px; -moz-tab-size: 4 !important; -o-tab-size: 4 !important; tab-size: 4 !important; } .editOptions { background-color: rgba(var(--theme-dynamic-color--rgb), .08); border-color: var(--theme-border-color); color: var(--theme-text-secondary-on-background); } /** Special characters section. **/ .wikiEditor-ui-toolbar .booklet .index { resize: initial; } .wikiEditor-ui-toolbar .booklet .index div { color: var(--theme-text-primary-on-background); } .wikiEditor-ui-toolbar .booklet .index div:not(.current):hover { background-color: rgba(var(--theme-dynamic-color--rgb), .08); } .wikiEditor-ui-toolbar .booklet .index div:not(.current):focus, .wikiEditor-ui-toolbar .booklet .index div:not(.current):active { background-color: rgba(var(--theme-dynamic-color--rgb), .16); } .wikiEditor-ui-toolbar .booklet .index .current { background-color: rgba(var(--theme-dynamic-color--rgb), .24); color: var(--theme-on-background); } .wikiEditor-ui-toolbar .booklet .pages { background-color: var(--theme-background); } .wikiEditor-ui-toolbar .page-characters div span { background-color: var(--theme-elevation-2dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } .wikiEditor-ui-toolbar .page-characters div span:hover { background-color: rgba(var(--theme-dynamic-color--rgb), .16); border-color: var(--theme-border-color); } .wikiEditor-ui-toolbar .page-characters div span:active { background-color: rgba(var(--theme-dynamic-color--rgb), .24); color: var(--theme-on-background); outline: none; } /** Help section. **/ .wikiEditor-ui-toolbar .page-table th { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-on-background); } .wikiEditor-ui-toolbar .page-table td { border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } /** Image upload popup. **/ .ui-widget-overlay, .oo-ui-windowManager-modal > .oo-ui-dialog { background-color: rgba(var(--theme-color__black--rgb), .38); } .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame { background-color: var(--theme-elevation-24dp_-_background-color); border: none; box-shadow: var(--theme-elevation-24dp_-_box-shadow); } .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget { background-color: var(--theme-elevation-1dp_-_background-color); border: none; } .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator { height: 24px; margin: 8px 8px 0 0; width: 24px; } .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(--theme-elevation-4dp_-_background-color); color: var(--theme-color__cta); } .oo-ui-processDialog-title { color: var(--theme-on-background); } /* Page history. */ .mw-plusminus-pos { color: var(--theme-color__green); } .mw-plusminus-neg { color: var(--theme-color__red); } #pagehistory { margin: 0; } #pagehistory li { display: block; } #pagehistory li { border-color: var(--theme-border-color); } #pagehistory li:hover { background-color: rgba(var(--theme-dynamic-color--rgb), .08); } #pagehistory li:not(.selected):focus-within { background-color: rgba(var(--theme-dynamic-color--rgb), .16); } #pagehistory li.selected { background-color: rgba(var(--theme-dynamic-color--rgb), .24); border: 1px solid var(--theme-border-color); color: var(--theme-on-background); } .diff-context { background-color: var(--theme-background); border-color: var(--theme-color__grey); color: var(--theme-text-primary-on-background); } .diff-deletedline { border-color: var(--theme-color__red); } .diff-deletedline .diffchange { background-color: var(--theme-color__red); color: var(--theme-dynamic-color__inverse); } .diff-addedline { border-color: var(--theme-color__green); } .diff-addedline .diffchange { background-color: var(--theme-color__green); color: var(--theme-dynamic-color__inverse); } /* Recent Changes. */ .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle, .oo-ui-tagItemWidget, .oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed) { background-color: var(--theme-elevation-2dp_-_background-color); border-color: var(--theme-border-color); } .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title { color: var(--theme-text-primary-on-background); } .mw-rcfilters-ui-filterTagMultiselectWidget-emptyFilters { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-savedLinksListWidget-placeholder-title { color: var(--theme-text-primary-on-background); } .mw-rcfilters-ui-savedLinksListWidget-placeholder-description { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-tagItemWidget-popup-content { background-color: var(--theme-elevation-8dp_-_background-color); box-shadow: var(--theme-elevation-8dp_-_box-shadow); } .mw-rcfilters-ui-tagItemWidget-popup-content { color: var(--theme-text-primary-on-background); } .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before, .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after { border-bottom-color: var(--theme-elevation-8dp_-_background-color); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled { background-color: var(--theme-elevation-2dp_-_background-color); border-color: var(--theme-border-color); box-shadow: var(--theme-elevation-2dp_-_box-shadow); color: var(--theme-text-primary-on-background); transition: var(--theme-elevation_-_-shadow-transition); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover, .oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed), .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover { background-color: var(--theme-elevation-4dp_-_background-color); box-shadow: var(--theme-elevation-4dp_-_box-shadow); } .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover { border-color: var(--theme-border-color); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled:active, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled, .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus { background-color: var(--theme-elevation-8dp_-_background-color); box-shadow: var(--theme-elevation-8dp_-_box-shadow); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled, .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus { border-color: var(--theme-color__light-blue); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue); } .mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button { color: var(--theme-text-primary-on-background); } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend { background-color: var(--theme-elevation-2dp_-_background-color); border-color: var(--theme-border-color); } .oo-ui-popupWidget-popup { background-color: var(--theme-elevation-8dp_-_background-color); box-shadow: var(--theme-elevation-8dp_-_box-shadow); border-color: var(--theme-border-color); } .mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-datePopupWidget { border-color: var(--theme-border-color); } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { color: var(--theme-color__light-blue); } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator { opacity: 1; } .mw-rcfilters-ui-filterMenuHeaderWidget-header, .mw-rcfilters-ui-menuSelectWidget-footer { background-color: rgba(var(--theme-dynamic-color--rgb), .08); border-color: var(--theme-border-color); } .mw-rcfilters-ui-filterMenuSectionOptionWidget { background-color: rgba(var(--theme-dynamic-color--rgb), .04); border-color: var(--theme-border-color); } .mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label { color: var(--theme-text-primary-on-background); } .mw-rcfilters-ui-filterMenuHeaderWidget-title { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) { border-color: var(--theme-border-color); } .mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-title, .mw-rcfilters-ui-itemMenuOptionWidget-label-title { color: var(--theme-text-primary-on-background); } .mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-desc, .mw-rcfilters-ui-itemMenuOptionWidget-label-desc { color: var(--theme-text-secondary-on-background); } .mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget { color: var(--theme-text-secondary-on-background); } /* Email user. */ .oo-ui-panelLayout-framed { border-color: var(--theme-border-color); } /* Special:Preferences. */ .oo-ui-labelWidget.oo-ui-inline-help { color: var(--theme-text-secondary-on-background); } .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed, .mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout { border: none; } .oo-ui-tabSelectWidget { background-color: transparent; } .oo-ui-tabOptionWidget { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; align-items: center; border: 0; border-radius: 0; color: var(--theme-text-primary-on-background); display: inline-flex; font-size: 1em; height: 2.5715em; justify-content: center; line-height: 2.5715em; font-weight: 700; letter-spacing: .0892857143em; margin: 0; padding: 0 1.7143em; text-align: center; } .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { background-color: rgba(var(--theme-dynamic-color--rgb), .08); color: var(--theme-on-background); } .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active { background-color: rgba(var(--theme-dynamic-color--rgb), .16); color: var(--theme-on-background); } .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { background-color: transparent; color: var(--theme-color__light-blue); } .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:after { background-color: currentColor; bottom: 0; content: ''; height: 2px; position: absolute; width: calc(100% - 48px); } .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover { background-color: rgba(var(--theme-color__light-blue--rgb), .08); color: var(--theme-color__light-blue); } .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:active { background-color: rgba(var(--theme-color__light-blue--rgb), .16); color: var(--theme-color__light-blue); } .oo-ui-tabOptionWidget .oo-ui-labelElement-label { border: 0; padding: 0; } .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label { border: none; } .mw-prefs-buttons { background-color: var(--theme-background); border-color: var(--theme-border-color); } /* Special:Blocklist. */ .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button { color: var(--theme-text-disabled-on-background); } /* Special:Search. */ .mw-search-profile-tabs { background-color: transparent; border-color: var(--theme-border-color); } .search-types .current a { color: var(--theme-text-on-background); cursor: pointer; } .search-types li::marker { content: initial; } /* Special:ActiveUsers. */ .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); caret-color: var(--theme-text-primary-on-background); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle { border-color: var(--theme-border-color); } .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle { border-color: var(--theme-color__indigo); box-shadow: inset 0 0 0 1px var(--theme-color__indigo); } .oo-ui-tagItemWidget.oo-ui-widget-enabled { color: var(--theme-text-primary-on-background); } .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover, .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus, .oo-ui-tagItemWidget.oo-ui-widget-enabled:active { color: var(--theme-on-background); } /* Special:ChangeContentModel */ .oo-ui-fieldLayout-messages .oo-ui-fieldLayout-messages-error { color: var(--theme-color__red); } /* Components. */ /** Dialog. **/ .ui-dialog:before { animation: dialog-backdrop-fade-in 250ms 1; background-color: #000; content: ''; height: 100%; left: 0; opacity: .38; position: fixed; pointer-events: none; top: 0; width: 100%; z-index: -1; } @-webkit-keyframes dialog-backdrop-fade-in { from { opacity: 0; } to { opacity: .38; } } @keyframes dialog-backdrop-fade-in { from { opacity: 0; } to { opacity: .38; } } body .ui-dialog { background-color: var(--theme-elevation-24dp_-_background-color); box-shadow: var(--theme-elevation-24dp_-_box-shadow); padding: 0; } .ui-widget-content { background: none; background-color: var(--theme-elevation-24dp_-_background-color); color: var(--theme-text-primary-on-background); } body .ui-dialog .ui-widget-header, body .ui-dialog .ui-dialog-buttonpane { background: none !important; background-color: rgba(var(--theme-dynamic-color--rgb), .08) !important; } body .ui-dialog .ui-widget-header { border: 0; border-bottom: 1px solid var(--theme-border-color); color: var(--theme-on-background); font: 500 1.25rem/2rem sans-serif; letter-spacing: .0.016rem; padding: 9px 24px !important; } .ui-dialog .ui-dialog-title { margin: 0 16px 0 0; } .wikiEditor-toolbar-dialog .ui-dialog-content { background-color: var(--theme-elevation-24dp_-_background-color); padding: 24px !important; } body .ui-dialog .ui-dialog-buttonpane { border-top: 1px solid var(--theme-border-color) !important; } body .wikiEditor-toolbar-dialog .ui-dialog-titlebar-close { height: 24px; right: 24px; top: calc(50% - 2px); width: 24px; } body .ui-dialog .ui-icon-closethick { height: inherit; margin: 0; width: inherit; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 0; background: none; } .previewnote { color: var(--theme-color__red); } /** Forms. **/ .mw-ui-vform .error, .mw-ui-vform .warning, .mw-ui-vform .errorbox, .mw-ui-vform .warningbox, .mw-ui-vform .successbox { padding: .5em 1em; } .mw-ui-vform .error, .errorbox { background-color: rgba(var(--theme-color__red--rgb), .08); border: none; border-left: 4px solid var(--theme-color__red); color: rgba(var(--theme-color__red--rgb), .87); } .mw-ui-vform .warning, .warningbox { background-color: rgba(var(--theme-color__orange--rgb), .08); border: none; border-left: 4px solid var(--theme-color__orange); color: rgba(var(--theme-color__orange--rgb), .87); } .mw-ui-vform .successbox, .mw-ui-vform .success, .successbox { background-color: rgba(var(--theme-color__green--rgb), .08); border: none; border-left: 4px solid var(--theme-color__green); color: rgba(var(--theme-color__green--rgb), .87); } .mw-infobox { border: 2px solid var(--theme-color__deep-orange); } /** Text input. **/ textarea, input { border: 1px solid var(--theme-border-color); } .oo-ui-dropdownInputWidget.oo-ui-widget-enabled, .oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover { background-color: transparent; } .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly], .oo-ui-textInputWidget .oo-ui-inputWidget-input, .mw-widget-dateInputWidget-handle, .mw-ui-input { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } .mw-ui-input { box-shadow: none; } .mw-ui-input::-webkit-input-placeholder, .mw-ui-input:-ms-input-placeholder, .mw-ui-input::-moz-placeholder, .mw-ui-input:-moz-placeholder, .mw-ui-input::placeholder { color: var(--theme-text-secondary-on-background); } .mw-ui-input:hover { border-color: var(--theme-border-color); } .mw-ui-input:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue); } .mw-ui-input:disabled { border-color: var(--theme-border-color); color: var(--theme-text-disabled-on-background); } .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover { background-color: var(--theme-elevation-4dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle { background-color: var(--theme-elevation-8dp_-_background-color); } .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus { border-color: var(--theme-color__light-blue); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue); } .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus { box-shadow: inset 0 0 0 1px var(--theme-color__light-blue); } .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active { border-color: var(--theme-color__indigo); color: var(--theme-on-background); } .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input { border-color: var(--theme-border-color); } .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); color: var(--theme-text-primary-on-background); } .mw-widget-dateInputWidget-empty .mw-widget-dateInputWidget-handle { color: var(--theme-text-secondary-on-background); } .oo-ui-pendingElement-pending { background-image: -webkit-linear-gradient(135deg, rgba(var(--theme-dynamic-color--rgb), .24) 25%, transparent 25%, transparent 50%, rgba(var(--theme-dynamic-color--rgb), .24) 50%, rgba(var(--theme-dynamic-color--rgb), .24) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(135deg, rgba(var(--theme-dynamic-color--rgb), .24) 25%, transparent 25%, transparent 50%, rgba(var(--theme-dynamic-color--rgb), .24) 50%, rgba(var(--theme-dynamic-color--rgb), .24) 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, rgba(var(--theme-dynamic-color--rgb), .24) 25%, transparent 25%, transparent 50%, rgba(var(--theme-dynamic-color--rgb), .24) 50%, rgba(var(--theme-dynamic-color--rgb), .24) 75%, transparent 75%, transparent); } /** Buttons. **/ .mw-ui-button { background-color: var(--theme-elevation-2dp_-_background-color); color: var(--theme-on-background); border-color: var(--theme-elevation-2dp_-_background-color); } .mw-ui-button:visited { color: var(--theme-on-background); } .mw-ui-button:hover { background-color: var(--theme-elevation-4dp_-_background-color); color: var(--theme-on-background); border-color: var(--theme-elevation-4dp_-_background-color); } .mw-ui-button:focus { background-color: var(--theme-elevation-8dp_-_background-color); color: var(--theme-on-background); border-color: var(--theme-elevation-8dp_-_background-color); box-shadow: inset 0 0 0 1px var(--theme-color__indigo), inset 0 0 0 2px var(--theme-color__indigo); outline-width: 0; } .mw-ui-button:focus::-moz-focus-inner { border-color: transparent; padding: 0 } .mw-ui-button:active, .mw-ui-button.is-on { background-color: var(--theme-elevation-8dp_-_background-color); color: var(--theme-on-background); border-color: var(--theme-elevation-8dp_-_background-color); } .mw-ui-button:disabled, .mw-ui-button:disabled:hover, .mw-ui-button:disabled:active { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-text-disabled-on-background); border-color: var(--theme-elevation-1dp_-_background-color); box-shadow: none; } .mw-ui-button.mw-ui-quiet, .mw-ui-button.mw-ui-quiet.mw-ui-progressive, .mw-ui-button.mw-ui-quiet.mw-ui-destructive { color: var(--theme-text-primary-on-background); } .mw-ui-button.mw-ui-quiet:hover, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:hover, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:hover, .mw-ui-button.mw-ui-quiet:active, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:active, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:active, .mw-ui-button.mw-ui-quiet:focus, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:focus, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:focus { color: var(--theme-on-background); } .mw-ui-button.mw-ui-quiet:disabled, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:disabled, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:disabled, .mw-ui-button.mw-ui-quiet:disabled:hover, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:disabled:hover, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:disabled:hover, .mw-ui-button.mw-ui-quiet:disabled:active, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:disabled:active, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:disabled:active { color: var(--theme-text-disabled-on-background); } .mw-ui-button.mw-ui-progressive { background-color: var(--theme-color__light-blue); color: var(--theme-text-primary-on-background-inverse); border: 1px solid var(--theme-color__light-blue); } .mw-ui-button.mw-ui-progressive:hover { background-color: var(--theme-color__blue); border-color: var(--theme-color__blue); } .mw-ui-button.mw-ui-progressive:focus { box-shadow: inset 0 0 0 1px var(--theme-color__indigo), inset 0 0 0 2px var(--theme-color__indigo); } .mw-ui-button.mw-ui-progressive:active, .mw-ui-button.mw-ui-progressive.is-on { background-color: var(--theme-color__indigo); border-color: var(--theme-color__indigo); } .mw-ui-button.mw-ui-progressive:disabled, .mw-ui-button.mw-ui-progressive:disabled:hover, .mw-ui-button.mw-ui-progressive:disabled:active { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-text-disabled-on-background); border-color: var(--theme-elevation-1dp_-_background-color); } .mw-ui-button.mw-ui-progressive.mw-ui-quiet { color: var(--theme-color__light-blue); } .mw-ui-button.mw-ui-progressive.mw-ui-quiet:hover { background-color: rgba(var(--theme-color__blue--rgb), .08); color: var(--theme-color__blue); } .mw-ui-button.mw-ui-progressive.mw-ui-quiet:focus, .mw-ui-button.mw-ui-progressive.mw-ui-quiet:active { background-color: rgba(var(--theme-color__indigo--rgb), .16); color: var(--theme-color__indigo); } .mw-ui-button.mw-ui-destructive { background-color: var(--theme-color__red); color: rgba(var(--theme-color__red--rgb), .87); border-color: var(--theme-color__red); } .mw-ui-button.mw-ui-destructive:hover { background-color: var(--theme-color__red); color: var(--theme-color__red); border-color: var(--theme-color__red); } .mw-ui-button.mw-ui-destructive:focus { box-shadow: inset 0 0 0 1px var(--theme-color__red), inset 0 0 0 2px currentColor; } .mw-ui-button.mw-ui-destructive:active, .mw-ui-button.mw-ui-destructive.is-on { background-color: rgba(var(--theme-color__red--rgb), .8); border-color: rgba(var(--theme-color__red--rgb), .8); } .mw-ui-button.mw-ui-destructive:disabled, .mw-ui-button.mw-ui-destructive:disabled:hover, .mw-ui-button.mw-ui-destructive:disabled:active { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-text-disabled-on-background); border-color: var(--theme-elevation-1dp_-_background-color); } .mw-ui-button.mw-ui-destructive.mw-ui-quiet { color: rgba(var(--theme-color__red--rgb), .87); } .mw-ui-button.mw-ui-destructive.mw-ui-quiet:hover { background-color: rgba(var(--theme-color__red--rgb), .08); color: var(--theme-color__red); } .mw-ui-button.mw-ui-destructive.mw-ui-quiet:active, .mw-ui-button.mw-ui-destructive.mw-ui-quiet:focus { background-color: rgba(var(--theme-color__red--rgb), .16); color: var(--theme-color__red); } .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button { background-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-text-disabled-on-background); border-color: var(--theme-border-color); } .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button { background-color: var(--theme-elevation-8dp_-_background-color); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { background-color: var(--theme-elevation-2dp_-_background-color); color: var(--theme-text-primary-on-background); border-color: var(--theme-border-color); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover { background-color: var(--theme-elevation-4dp_-_background-color); color: var(--theme-text-primary-on-background); border-color: var(--theme-border-color); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { background-color: var(--theme-elevation-8dp_-_background-color); color: var(--theme-on-background); border-color: var(--theme-border-color); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button { background-color: var(--theme-color__indigo); color: var(--theme-dynamic-color__inverse); border-color: var(--theme-color__indigo); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue), inset 0 0 0 2px var(--theme-color__blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { color: var(--theme-color__light-blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background-color: rgba(var(--theme-color__blue--rgb), .16); border-color: var(--theme-color__blue); } .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-color: var(--theme-elevation-1dp_-_background-color); color: var(--theme-color__indigo); border-color: var(--theme-color__indigo); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus { background-color: rgba(var(--theme-color__indigo--rgb), .24); color: var(--theme-color__blue); border-color: var(--theme-color__blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: var(--theme-color__red); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { background-color: rgba(var(--theme-color__red--rgb), .16); border-color: var(--theme-color__red); } .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-button:active:focus, .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-color: rgba(var(--theme-color__red--rgb), .24); color: var(--theme-color__red); border-color: var(--theme-color__red); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__red); box-shadow: inset 0 0 0 1px var(--theme-color__red); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { color: var(--theme-dynamic-color__inverse); background-color: var(--theme-color__light-blue); border-color: var(--theme-color__light-blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background-color: var(--theme-color__blue); border-color: var(--theme-color__blue); } .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-button:active:focus, .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(--theme-dynamic-color__inverse); background-color: var(--theme-color__indigo); border-color: var(--theme-color__indigo); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue)/*, inset 0 0 0 2px #fff*/; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-iconElement > .oo-ui-buttonElement-button:focus, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-labelElement > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: var(--theme-dynamic-color__inverse); background-color: var(--theme-color__red); border-color: var(--theme-color__red); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { background-color: var(--theme-color__red); border-color: var(--theme-color__red); } .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-button:active:focus, .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(--theme-dynamic-color__inverse); background-color: rgba(var(--theme-color__red--rgb), .8); border-color: rgba(var(--theme-color__red--rgb), .8); } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus { border-color: var(--theme-color__red); box-shadow: inset 0 0 0 1px var(--theme-color__red), inset 0 0 0 2px currentColor; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: var(--theme-text-secondary-on-background); } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { color: var(--theme-text-secondary-on-background); } .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-button:active:focus, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { color: var(--theme-text-secondary-on-background); } .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-button:active:focus, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { color: var(--theme-color__light-blue); } body .ui-button, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: none !important; background-color: var(--theme-elevation-2dp_-_background-color) !important; border-color: var(--theme-border-color) !important; box-shadow: var(--theme-elevation-2dp_-_box-shadow); color: var(--theme-text-primary-on-background) !important; transition: background-color 75ms var(--standard-curve-timing-function), box-shadow var(--theme-elevation_-_-shadow-transition); } body .ui-button:hover { background: none !important; background-color: var(--theme-elevation-4dp_-_background-color) !important; border-color: var(--theme-border-color) !important; box-shadow: var(--theme-elevation-4dp_-_box-shadow); } body .ui-button:focus, body .ui-button:active { background: none !important; background-color: var(--theme-elevation-8dp_-_background-color) !important; border-color: var(--theme-border-color) !important; box-shadow: var(--theme-elevation-8dp_-_box-shadow); color: var(--theme-on-background) !important; } .ui-dialog .ui-dialog-buttonpane button:not(:last-child) { margin-right: 12px; } .ui-dialog .ui-dialog-buttonpane button:last-child { margin-right: 0; } /** Checkbox. **/ .mw-ui-checkbox:not(#noop) [type='checkbox'] + label:before, .oo-ui-checkboxInputWidget [type='checkbox'] + span, input[type="checkbox" i] { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span { border-color: var(--theme-color__light-blue); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:hover + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span { border-color: var(--theme-color__light-blue); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:active + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active + span { background-color: var(--theme-color__indigo); border-color: var(--theme-color__indigo); box-shadow: inset 0 0 0 1px var(--theme-color__indigo); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked + span { background-color: var(--theme-color__light-blue); border-color: var(--theme-color__light-blue); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:focus + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:focus + span { background-color: var(--theme-color__blue); border-color: var(--theme-color__blue); box-shadow: inset 0 0 0 1px var(--theme-color__blue)/*, inset 0 0 0 2px #fff*/; } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:hover + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:hover + span { background-color: var(--theme-color__blue); border-color: var(--theme-color__blue); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:active + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:active + span { background-color: var(--theme-color__indigo); border-color: var(--theme-color__indigo); box-shadow: inset 0 0 0 1px var(--theme-color__indigo); } .mw-ui-checkbox:not(#noop) [type='checkbox']:disabled + label:before { background-color: var(--theme-background); border-color: var(--theme-border-color); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:focus + label:before { border-color: var(--theme-color__indigo); box-shadow: inset 0 0 0 1px var(--theme-color__indigo); } /** Dark theme. **/ @media (prefers-color-scheme: dark) { .mw-ui-checkbox:not(#noop) [type='checkbox'] + label:before, .oo-ui-checkboxInputWidget [type='checkbox'] + span, input[type="checkbox" i] { background-color: #e1e1e1; border-color: rgba(0, 0, 0, .12); } .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span { border-color: var(--theme-color__light-blue--inverse); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:hover + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span { border-color: var(--theme-color__light-blue--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:active + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active + span { background-color: var(--theme-color__indigo--inverse); border-color: var(--theme-color__indigo--inverse); box-shadow: inset 0 0 0 1px var(--theme-color__indigo--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked + span { background-color: var(--theme-color__light-blue--inverse); border-color: var(--theme-color__light-blue--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:focus + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:focus + span { background-color: var(--theme-color__blue--inverse); border-color: var(--theme-color__blue--inverse); box-shadow: inset 0 0 0 1px var(--theme-color__blue--inverse)/*, inset 0 0 0 2px #fff*/; } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:hover + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:hover + span { background-color: var(--theme-color__blue--inverse); border-color: var(--theme-color__blue--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:checked:active + label:before, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:active + span { background-color: var(--theme-color__indigo--inverse); border-color: var(--theme-color__indigo--inverse); box-shadow: inset 0 0 0 1px var(--theme-color__indigo--inverse); } .mw-ui-checkbox:not(#noop) [type='checkbox']:disabled + label:before { background-color: #e1e1e1; border-color: rgba(0, 0, 0, .12); } .mw-ui-checkbox:not(#noop) [type='checkbox']:enabled:focus + label:before { border-color: var(--theme-color__indigo--inverse); box-shadow: inset 0 0 0 1px var(--theme-color__indigo--inverse); } } /** Radio buttons. **/ .oo-ui-radioInputWidget [type='radio'] + span { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .oo-ui-radioInputWidget [type='radio']:disabled + span { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); opacity: .38; } .oo-ui-radioInputWidget [type='radio']:disabled:checked + span { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); opacity: .6; } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:hover + span { border-color: var(--theme-color__blue); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:active + span { background-color: rgba(var(--theme-color__indigo--rgb), .24); border-color: var(--theme-color__indigo); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:focus + span { border-color: var(--theme-color__light-blue); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked + span { border-color: var(--theme-color__light-blue); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:focus + span:before { border-color: var(--theme-border-color); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:hover + span { border-color: var(--theme-color__blue); } .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span { border-color: var(--theme-color__indigo); box-shadow: inset 0 0 0 1px var(--theme-color__indigo); } /** Select menu. **/ .wikiEditor-ui-toolbar .group .tool-select { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .wikiEditor-ui-toolbar .group .tool-select .label { color: var(--theme-text-primary-on-background); } .wikiEditor-ui-toolbar .group .tool-select .menu .options { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .wikiEditor-ui-toolbar .group .tool-select .options .option { color: var(--theme-text-primary-on-background); } .wikiEditor-ui-toolbar .group .tool-select .options .option:hover { background-color: rgba(var(--theme-dynamic-color--rgb), .08); } .wikiEditor-ui-toolbar .group .tool-select .options .option:focus, .wikiEditor-ui-toolbar .group .tool-select .options .option:active { background-color: rgba(var(--theme-dynamic-color--rgb), .16); } .oo-ui-menuSelectWidget { background-color: var(--theme-elevation-1dp_-_background-color); border-color: var(--theme-border-color); } .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget { color: var(--theme-text-primary-on-background); } .oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted { background-color: rgba(var(--theme-dynamic-color--rgb), .08); } .mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected), .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, .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { background-color: rgba(var(--theme-dynamic-color--rgb), .24); color: var(--theme-on-background); } .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus { outline: 0; border-color: var(--theme-color__light-blue); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue); } .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button { border-color: var(--theme-color__light-blue--rgb); box-shadow: inset 0 0 0 1px var(--theme-color__light-blue)/*, inset 0 0 0 2px #fff*/; } .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus { border-color: var(--theme-color__light-blue--rgb); } @media screen and (min-width: 0) { .oo-ui-textInputWidget.oo-ui-widget-enabled textarea.oo-ui-inputWidget-input:focus { outline:1px solid var(--theme-color__light-blue); } .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea.oo-ui-inputWidget-input:focus { outline-color: var(--theme-color__red--rgb); } } .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input { border-color: var(--theme-error); } .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:hover { border-color: var(--theme-error); } .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:focus { border-color: var(--theme-error); box-shadow: inset 0 0 0 1px var(--theme-error); } /*** "Snackbar" design for notifications. ***/ /**** Layout. ****/ .postedit-container, .wds-banner-notification__container { align-items: center; bottom: 24px; box-sizing: border-box; cursor: pointer; display: flex; font-size: initial; /*height: 48px;*/ justify-content: flex-start; left: 0; margin: 8px; max-width: 672px; pointer-events: none; position: fixed; right: 0; top: unset; z-index: 5000; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /**** Inner layout. ****/ .postedit-container .postedit, .wds-banner-notification { align-items: center; animation: snackbar-open 150ms 1 0s, snackbar-close 75ms 1 3225ms; background-color: var(--theme-elevation-6dp_-_background-color); border: 0; border-radius: 4px; box-shadow: var(--theme-elevation-6dp_-_box-shadow); box-sizing: border-box; color: var(--theme-text-primary-on-background); display: flex; left: unset; margin: 0; max-width: 672px; opacity: 1; padding: 0; position: relative; top: unset; transform: none; transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1); } /**** Exclusive to notifications. ****/ /***** Removes the 'check' icon at the start of the notificaiton. *****/ .wds-banner-notification__icon { display: none; } /***** Close button styling. *****/ .wds-banner-notification__close { border: 0; margin-inline-end: 8px; pointer-events: initial; } /**** Exclusive 'Saved edit' notification styling. ****/ /***** Adds 'ripple' effect element. *****/ .postedit-container .postedit:before { background-color: var(--theme-on-background); border-radius: 50%; content: ''; height: 36px; opacity: 0; right: 14px; position: absolute; top: 6px; transition: opacity 75ms linear; width: 36px; } /****** Adds 'ripple' interactivity effect on hover and focus/active. ******/ .postedit-container .postedit:hover:before { opacity: 0.08; } .postedit-container .postedit:focus:before, .postedit-container .postedit:active:before { opacity: 0.24; } /***** Removes checkmark icon. *****/ .postedit-icon-checkmark { background-image: none; } .postedit-icon { padding: 14px 16px; line-height: 1; font: 500 .875rem/1.25rem sans-serif; letter-spacing: .016rem; } @-webkit-keyframes snackbar-open { from { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } to { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } @keyframes snackbar-open { from { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } to { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } @-webkit-keyframes snackbar-close { from { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } to { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } } @keyframes snackbar-close { from { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } to { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } } /** Date picker/Calendar. **/ .mw-widget-dateInputWidget-calendar { background-color: var(--theme-elevation-12dp_-_background-color); border: none; border-radius: 4px; box-shadow: var(--theme-elevation-12dp_-_box-shadow); height: 25.75rem; width: 20.5rem; z-index: 12; } .mw-widget-calendarWidget-header { background: rgba(var(--theme-color__light-blue--rgb), .16); border-radius: 4px 4px 0 0; line-height: unset; padding: 1rem 1.5rem; position: relative; } .mw-widget-calendarWidget-header:before { content: 'Select date'; font: 500 .75rem/2rem Roboto, Noto, sans-serif; letter-spacing: 2px; text-decoration: none; text-transform: uppercase; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton { bottom: -2rem; margin: 0; position: absolute; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton { width: 8.5rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton .oo-ui-buttonElement-button { max-width: 8.5rem; white-space: nowrap; overflow: hidden; text-align: initial; text-overflow: ellipsis; width: initial; } .mw-widget-calendarWidget-header .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button { border: none; padding: 0; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton .oo-ui-buttonElement-button .oo-ui-labelElement-label { font: 400 .875rem/1 Rooto, Arial, sans-serif; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-upButton { bottom: -2.25rem; right: 7.5rem; } .mw-widget-calendarWidget-header .oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button { border: 0; height: 1.5rem; padding: 0; width: 1.5rem; } .mw-widget-calendarWidget-header .oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { left: .125rem; } .mw-widget-calendarWidget-header .oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child { bottom: -2.25rem; float: none; position: absolute; right: 4.5rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-nextButton { bottom: -2.25rem; float: none; position: absolute; right: 1.5rem; } .mw-widget-calendarWidget-body-outer-wrapper { height: 17.5rem; margin: 3.5rem .75rem 0; width: 19rem; } .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body { column-gap: .25rem; grid-column-gap: .25rem; } .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day-heading, .mw-widget-calendarWidget-day:nth-child(7n), .mw-widget-calendarWidget-day-heading:nth-child(7n), .mw-widget-calendarWidget-day:nth-child(7n+1), .mw-widget-calendarWidget-day-heading:nth-child(7n+1), .mw-widget-calendarWidget-day:nth-child(42) ~ .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day:nth-child(42) ~ .mw-widget-calendarWidget-day-heading, .mw-widget-calendarWidget-day-heading:nth-child(42) ~ .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day-heading:nth-child(42) ~ .mw-widget-calendarWidget-day-heading, .mw-widget-calendarWidget-month:nth-child(2n), .mw-widget-calendarWidget-month:nth-child(2n+1), .mw-widget-calendarWidget-month:nth-child(10) ~ .mw-widget-calendarWidget-month, .mw-widget-calendarWidget-year:nth-child(5n), .mw-widget-calendarWidget-year:nth-child(5n+1), .mw-widget-calendarWidget-year, .mw-widget-calendarWidget-year:nth-child(15) ~ .mw-widget-calendarWidget-year { line-height: 1; margin: 0; } .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day-heading { border-radius: 50%; height: 2.5rem; width: 2.5rem; } .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day-heading { box-sizing: border-box; font: 400 .875rem/1 Roboto, Arial, sans-serif; padding: .875rem 0; } .mw-widget-calendarWidget-day { color: var(--theme-text-primary-on-background); } .mw-widget-calendarWidget-day-heading { color: var(--theme-text-secondary-on-background); } .mw-widget-calendarWidget-day-additional { color: var(--theme-text-disabled-on-background); } .mw-widget-calendarWidget-item:hover { background-color: rgba(var(--theme-color__blue--rgb), .16); } .mw-widget-calendarWidget-item:active { background-color: rgba(var(--theme-color__blue--rgb), .24); } .mw-widget-calendarWidget-item-selected, .mw-widget-calendarWidget-item-selected:hover { background-color: var(--theme-color__blue); color: #000; } .mw-widget-calendarWidget-day-additional:hover { background-color: rgba(var(--theme-color__blue--rgb), .08); color: var(--theme-text-secondary-on-background); } .mw-widget-calendarWidget-day-additional:active { background-color: rgba(var(--theme-color__blue--rgb), .16); } .mw-widget-calendarWidget-body-wrapper-fade-up, .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body { height: 17.5rem; width: 18rem; } .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-year, .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-duodecade { gap: 4px 8px; grid-gap: 4px 8px; } .mw-widget-calendarWidget-month:nth-child(2n), .mw-widget-calendarWidget-month:nth-child(2n+1) { border-radius: 24px; box-sizing: border-box; padding: .875rem 0; width: calc(9.5rem - 4px); } .mw-widget-calendarWidget-body-wrapper-fade-down .mw-widget-calendarWidget-body:first-child { margin-top: -17.5rem !important; } .mw-widget-calendarWidget-body-wrapper-fade-next .mw-widget-calendarWidget-body:first-child { margin-left: -19rem !important; } .mw-widget-calendarWidget-year { border-radius: 24px; box-sizing: border-box; height: 3.25rem; padding: 1.25rem 0; width: 4.375rem; } .mw-widget-calendarWidget-year:nth-child(5n), .mw-widget-calendarWidget-year:nth-child(5n+1) { width: 4.375rem; } .mw-widget-calendarWidget-body-duodecade { grid-template-columns: auto auto auto auto; } @media only screen and (min-width: 1200px), only screen and (max-height: 480px) { .mw-widget-dateInputWidget-calendar { height: 17.5rem; width: 16rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton { width: 6.5rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-labelButton .oo-ui-buttonElement-button { max-width: 6.5rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-nextButton { right: .5rem; } .mw-widget-calendarWidget-header .oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child { right: 3.5rem; } .mw-widget-calendarWidget-header .mw-widget-calendarWidget-upButton { right: 6.5rem; } .mw-widget-calendarWidget-body-wrapper-fade-previous, .mw-widget-calendarWidget-body-wrapper-fade-next { width: 28rem; height: 13.75rem; } .mw-widget-calendarWidget-body-wrapper-fade-next .mw-widget-calendarWidget-body:first-child { margin-left: -14rem !important; } .mw-widget-calendarWidget-body-wrapper-fade-down .mw-widget-calendarWidget-body:first-child { margin-top: -14rem !important; } .mw-widget-calendarWidget-header { background-color: transparent; padding: 0 .5rem 0 1.5rem; } .mw-widget-calendarWidget-header:before { content: unset; } .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body { gap: 0; grid-gap: 0; } .mw-widget-calendarWidget-body-outer-wrapper { margin: 3.25rem 1rem 0; width: 14rem; height: 13.75rem; } .mw-widget-calendarWidget-body-wrapper-fade-up, .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body { width: 14rem; height: 13.75rem; } .mw-widget-calendarWidget-day, .mw-widget-calendarWidget-day-heading, .mw-widget-calendarWidget-day:nth-child(7n), .mw-widget-calendarWidget-day-heading:nth-child(7n), .mw-widget-calendarWidget-day:nth-child(7n+1), .mw-widget-calendarWidget-day-heading:nth-child(7n+1) { height: 1.75rem; margin: .125rem; padding: .563rem 0; width: 1.75rem; } .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-year, .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-duodecade { gap: 0; grid-gap: 0; } .mw-widget-calendarWidget-body-wrapper-fade-up, .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body-year { width: 14rem; } .mw-widget-calendarWidget-body-wrapper .mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-duodecade { gap: 0 .25rem; grid-gap: 0 .25rem; grid-template-columns: auto auto auto auto; place-items: center; } .mw-widget-calendarWidget-month:nth-child(2n), .mw-widget-calendarWidget-month:nth-child(2n+1) { padding: .675rem; width: 7rem; } .mw-widget-calendarWidget-year:nth-child(5n), .mw-widget-calendarWidget-year:nth-child(5n+1), .mw-widget-calendarWidget-year { height: 1.75rem; padding: .5rem 0; width: 3.25rem; } } /** Loading spinner. **/ .mw-spinner-container { filter: invert(1); } .mw-spinner-container div { display: none; } /** Loading spinner. **/ /*** > 10 will break the round shape ***/ .mw-spinner-container:after { content: ''; position: absolute; top: 0; left: 0; width: 60px; height: 60px; border-radius: 90px; border-bottom: black 2px solid; border-top: transparent 2px solid; border-left: transparent 2px solid; border-right: black 2px solid; margin-left: 15px; margin-top: 15px; -webkit-animation: loading-spinner-spinanim 1.333s infinite linear; animation: loading-spinner-spinanim 1.333s infinite linear; -webkit-animation-direction: normal; animation-direction: normal; } @-webkit-keyframes loading-spinner-spinanim { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes loading-spinner-spinanim { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } /** Accordion. **/ /*** Layout and base colors. ***/ .mat-accordion { --accordion-border-color: #dadce0; --accordion-header-background-color: #fff; --accordion-header-background-color--hover: #efefef; --accordion-link-color: #3367d6; --accordion-link-list-background-color: #e8f0fe; --accordion-link-list-background-color--hover: #d2e3fc; --accordion-text-header-background-color--active: #f1f3f4; } .wikitable .mat-accordion { margin: 0; } /**** Adds arrow icons inside of the previously created pseudo-elements. ****/ /***** Closed / down arrow. *****/ .mat-accordion .dialogue-table .mw-collapsible-toggle-default:after, .mat-accordion .dialogue-table .mw-collapsible-toggle-collapsed:after { border-bottom: 2px solid; border-left: 2px solid; height: 9px; top: 18px; transform: rotate(-45deg); width: 9px; } /***** Opened / up arrow. *****/ .mat-accordion .dialogue-table .mw-collapsible-toggle-expanded:after { top: 24px; transform: rotate(135deg); } /*** Dark theme colors. ***/ .mat-accordion { --accordion-background-color: var(--theme-background); --accordion-border-color: var(--theme-border-color); --accordion-header-background-color: var(--theme-background); --accordion-header-background-color--hover: rgba(var(--theme-dynamic-color--rgb), .06); --accordion-link-color: #8ab4f8; --accordion-link-list-background-color: rgba(var(--theme-dynamic-color--rgb), .03); --accordion-link-list-background-color--hover: rgba(var(--theme-dynamic-color--rgb), .08); --accordion-text-header-background-color--active: #3c4043; align-items: flex-start; border-radius: 0.5rem; display: flex; flex: 100%; flex-direction: column; margin: 2.625rem 0 0; } /**** Adds arrow icons inside of the previously created pseudo-elements. ****/ /***** Closed / down arrow. *****/ .mw-body .mat-accordion.list-accordion ul li::marker { content: none; } .versions-table .mat-accordion:first-child .mw-collapsible-toggle { border: 0; } .versions-table /**** Links' styles. ****/ .mat-accordion.list-accordion tr:last-child a, .mat-accordion.list-accordion tr:last-child a:hover, .mat-accordion.list-accordion tr:last-child a:focus, .mat-accordion .mw-collapsible-toggle:hover, .mat-accordion .mw-collapsible-toggle:focus, .mat-accordion .mw-collapsible-toggle:focus-within a { color: var(--accordion-link-color); } .mw-parser-output .mat-accordion .external { background-image: none; } /**** List/dialog accordions' layout. ****/ .mat-accordion .dialogue-table { display: flex; justify-content: flex-start; width: 100%; } .mat-accordion .dialogue-table tbody, .mat-accordion .dialogue-table tr, .mat-accordion .dialogue-table td { display: inherit; width: 100%; justify-content: stretch; padding: 0; } .mat-accordion .dialogue-table tbody { flex-direction: column; } /**** Dialog accordion - header styles. ****/ .mat-accordion .dialogue-table .mw-collapsible-toggle-default { background-color: var(--theme-page-background-color);/*var(--accordion-link-list-background-color)*/ position: relative; width: 100%; } .mat-accordion .dialogue-table .mw-collapsible-toggle-default:before { content: initial; } /**** * Adds pseudo-elements to both accordion types, so then we can add the arrow * buttons inside of those. ****/ .mat-accordion .dialogue-table .mw-collapsible-toggle-default:after, .mat-accordion .dialogue-table .mw-collapsible-toggle-collapsed:after, .mat-accordion .dialogue-table .mw-collapsible-toggle-expanded:after { border-color: var(--accordion-link-color); content: ''; display: inline-block; position: absolute; right: 1.75rem; } /**** Dialog accordion - more header styles. ****/ .mat-accordion .dialogue-table .mw-collapsible-toggle-default .mw-collapsible-text { color: var(--theme-text-primary-on-background); display: flex; font: 500 .875rem/1.25rem var(--theme-font-2); padding: 1rem 3.25rem 1rem 4rem; text-decoration: none; } .mat-accordion .dialogue-table .mw-collapsible-toggle-collapsed, .mat-accordion .dialogue-table .mw-collapsible-toggle-expanded { outline: 0; } .mat-accordion .dialogue-table .mw-collapsible-toggle-collapsed:hover, .mat-accordion .dialogue-table .mw-collapsible-toggle-collapsed:focus { background-color: var(--accordion-header-background-color--hover); } /**** Adds outer border to the whole List accordion. ****/ .mat-accordion.list-accordion { border: thin solid var(--accordion-border-color); } /**** List accordion - adds borders to the first element of the list. ****/ .mat-accordion.list-accordion .dialogue-table:first-child .mw-collapsible-toggle-default { border-top: none; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; } /**** List accordion - fix last element of the list's borders. ****/ .mat-accordion.list-accordion .dialogue-table:last-child .mw-collapsible-toggle-default { border-bottom: none; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } .mat-accordion.list-accordion .dialogue-table:last-child tr:last-child { border: none; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } /**** Adds borders to each header of the list. ****/ .mat-accordion.list-accordion .mw-collapsible-toggle-default { border-bottom: thin solid var(--accordion-border-color); } .mat-accordion.list-accordion tr:last-child { background-color: var(--accordion-link-list-background-color); border-bottom: thin solid var(--accordion-border-color); } .mat-accordion.list-accordion tr:last-child ul { margin: 10px 0; width: 100%; } .mat-accordion.list-accordion tr:last-child li { color: var(--theme-text-on-background); line-height: 0.875rem; list-style-type: none; margin: 0; } .mat-accordion.list-accordion tr:last-child a { display: block; font-weight: 400; padding: 0.625rem 4rem; text-decoration: none; } /**** List accordion - interactivity styles for the headers. ****/ .mat-accordion.list-accordion tr:last-child a:hover, .mat-accordion.list-accordion tr:last-child a:focus { background-color: var(--accordion-link-list-background-color--hover); outline: none; } .mat-accordion.text-accordion .mw-collapsible-toggle-default { border-top: 0.0625rem solid var(--accordion-border-color); z-index: 1; } .mat-accordion.text-accordion .mw-collapsible-toggle-default .mw-collapsible-text { background-color: transparent; color: var(--accordion-link-color); font: normal 1rem/1.5rem var(--theme-font-2); padding: 1rem 3.125rem 1rem 1rem; } .mat-accordion.text-accordion .mw-collapsible-toggle-default:not(.mw-collapsible-toggle-collapsed) .mw-collapsible-text { background-color: var(--theme-background); } .mat-accordion.text-accordion .mw-collapsible-toggle-default .mw-collapsible-text:active { background-color: var(--accordion-text-header-background-color--active); } .mat-accordion.text-accordion tr:last-child td { flex-direction: column; padding: 0.0625rem 1.625rem 1.1875rem 2.125rem; position: relative; } .mat-accordion.text-accordion tr:last-child td:before { background-color: var(--accordion-border-color); content: ''; height: 100%; left: 1.125rem; position: absolute; top: -1.1875rem; width: 0.125rem; z-index: 0; } .mat-accordion.text-accordion tr:last-child p { margin: 0.25rem 0 0.75rem; line-height: 1.25rem; } /** Tooltips. **/ /*** Mine Blocks-styled tooltip. Original CSS from Minecraft Wiki * (available under the CC-BY-NC-SA 3.0 license: * creativecommons.org/licenses/by-nc-sa/3.0/): * minecraft.fandom.com/wiki/MediaWiki:Common.css by User:Majr. ***/ /**** Adds padding to the wrapper to make space for a shadow ****/ #tooltip-wrapper { padding: 3px 7px 2px 3px; } /**** * Hides tooltips with redlinks, not yet loaded ones and elements containing * tooltip contents for advanced tooltips. ****/ .has-redlinks, .tooltip-loading, .advanced-tooltip .tooltip-contents { content-visibility: none; visibility: none; } .tooltips-init-complete { cursor: help; } /**** Styling for Mine Blocks-styled tooltip ****/ #minetip-tooltip { background-color: rgba(7, 7, 59, .8); font-family: 'Volter (Goldfish)', sans-serif; font-size: 16px; left: 0; line-height: 1.25em; margin: .125em .25em; padding: .375em; pointer-events: none; position: fixed; top: 0; white-space: nowrap; word-spacing: 4px; z-index: 9999; } #minetip-tooltip:before { bottom: .125em; border: .125em solid rgba(7, 59, 114, .8); content: ''; left: -.125em; position: absolute; right: -.125em; top: .125em; } #minetip-tooltip:after { border: .125em solid rgba(7, 32, 86, .8); bottom: .125em; content: ''; left: 0; position: absolute; right: 0; top: .125em; } #minetip-tooltip > .description, #minetip-tooltip > .minetip-description { display: block; margin-top: .25em; } #minetip-tooltip > .minetip-title { font-family: 'Volter (Goldfish)'; } #minetip-tooltip > .minetip-description { font-family: 'basis33'; } /* Templates. */ /** Hatnotes. **/ .hatnote { font-style: italic; margin-bottom: .5em; margin-left: 1em; padding-left: 1.5em; } /** Template:A-slot. **/ /*** Hide all slides. ***/ .ts-container .ts-slide, .ts-container > p { display: none; } /*** Show slide that has class="ts-active". ***/ .ts-container .ts-active { display: block; } /*** Support inline slides as well. ***/ .ts-container.ts-container-inline .ts-active { display: inline; } /** Template:Delete. **/ .delete-notice { background-color: rgba(var(--theme-color__red--rgb), .08); border-left: 4px solid var(--theme-color__red); margin-bottom: 1.5em; padding: .5em 1.5em; } .delete-notice .headline-text { font-size: 1.25em; font-weight: 700; } /** Template:Stub. **/ .stub-notice { background-color: rgba(var(--theme-color__blue--rgb), .08); border-left: 4px solid var(--theme-color__blue); margin-bottom: 1.5em; padding: .5em 1.5em; } .stub-notice .headline-text { font-size: 1.25em; font-weight: 700; } /** Crafting templates. **/ .sc-container, .sb-container, .fc-container, .av-container { background-color: #c6c6c6; border: 2px solid #000; box-shadow: inset 0 0 0 2px #fff; color: #000; display: inline-block; padding: 10px; /* 8px + 2px from box-shadow. */ position: relative; text-align: center; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: bottom; white-space: nowrap; } .sc-container > p, .sb-container > p, .fc-container > p, .av-container > p { margin: 0; } .sc-container > p > *, .sb-container > p > *, .fc-container > p > *, .av-container > p > * { display: inline-block; vertical-align: top; } .sc-input, .sb-input, .sc-output, .sb-output, .av-input, .av-input2, .av-output, .fc-row:first-child, .fc-row:last-child, .fc-output { box-shadow: 0 0 0 2px #282828; } .sc-row, .sb-row, .fc-row, .av-row { display: block; } .invslot-item, .sc-container .ts-container, .sb-container .ts-container, .fc-container .ts-container, .av-container .ts-container { background-color: #b6b6b6; border: 1px solid; border-color: #535353 #898989 #898989 #535353; box-shadow: 0 0 0 1px #6d6d6d; box-sizing: content-box; display: inline-block; height: 32px; line-height: 0; /* Helps to vertically center images. */ position: relative; vertical-align: bottom; width: 32px; } .invslot-item:hover, .sc-container .ts-container:hover, .sb-container .ts-container:hover, .fc-container .ts-container:hover, .av-container .ts-container:hover, .bw-container .ts-container:hover { background-color: #767676; } .invslot-item:active, .sc-container .ts-container:active, .sb-container .ts-container:active, .fc-container .ts-container:active, .av-container .ts-container:active, .bw-container .ts-container:active, .invslot-item:focus-within, .sc-container .ts-container:focus-within, .sb-container .ts-container:focus-within, .fc-container .ts-container:focus-within, .av-container .ts-container:focus-within, .bw-container .ts-container:focus-within { background-color: #767676; border-color: #898989 #535353 #535353 #898989; } .invslot-item a { outline: none; } /* Removes inventory slot styling for slots inside a animated container. */ .ts-container > .invslot-item, .ts-container > .invslot-item, .ts-container > .invslot-item { background: none; border: none; box-shadow: none; padding: 6px 0; margin: 0; } .invslot-item .item-icon[width="18"][height="18"] { padding: 7px; } .invslot-item .item-icon[width="20"][height="20"] { padding: 6px; } .invslot-item .item-icon[width="22"][height="22"] { padding: 5px; } .invslot-item .item-icon[width="24"][height="24"] { padding: 4px; } .invslot-item a[href*="Invisible-sprite"] { pointer-events: none; } .sc-thumb, .sb-thumb, .fc-thumb, .invslot-item .item-icon { padding: 8px; } .item-amount { bottom: 6px; color: #fff; font-family: 'Volter (Goldfish)'; font-weight: 700; pointer-events: none; position: absolute; right: 0px; text-shadow: 2px 2px #000; z-index: 2; } .ts-container .invslot-item .item-amount { bottom: 2px; right: 1px; } .invslot-item .item-durability { background-color: #242424; height: 4px; left: 2px; overflow: hidden; pointer-events: none; position: absolute; top: 2px; width: 29px; } .invslot-item .item-durability[data-durability="undefined"], .invslot-item .item-durability[data-durability="0"] { display: none; } .invslot-item .item-durability:before { content: ''; height: 100%; left: 0; position: absolute; top: 0; width: 0; background-color: rgb(205, 0, 0); } .invslot-item .item-durability[data-durability="10"]:before { background-color: rgb(184, 26, 0); width: 10%; } .invslot-item .item-durability[data-durability="20"]:before { background-color: rgb(163, 51, 0); width: 20%; } .invslot-item .item-durability[data-durability="30"]:before { background-color: rgb(143, 77, 0); width: 30%; } .invslot-item .item-durability[data-durability="40"]:before { background-color: rgb(122, 102, 0); width: 40%; } .invslot-item .item-durability[data-durability="50"]:before { background-color: rgb(102, 128, 0); width: 50%; } .invslot-item .item-durability[data-durability="60"]:before { background-color: rgb(82, 153, 0); width: 60%; } .invslot-item .item-durability[data-durability="70"]:before { background-color: rgb(61, 178, 0); width: 70%; } .invslot-item .item-durability[data-durability="80"]:before { background-color: rgb(41, 204, 0); width: 80%; } .invslot-item .item-durability[data-durability="90"]:before { background-color: rgb(20, 229, 0); width: 90%; } .invslot-item .item-durability[data-durability="100"]:before { background-color: rgb(0, 255, 0); width: 100%; } /*** Template:SmallCrafting. ***/ .sc-output { margin-left: 14px; margin-top: 18px; } .sc-input > .sc-row > :nth-child(2) { margin-left: -4px; } /** Template:BigCrafting. **/ .sb-input > .sb-row > :nth-child(2), .sb-input > .sb-row > :nth-child(3) { margin-left: -4px; } .sb-output { margin-left: 14px; margin-top: 38px; } /** Template:Furnace **/ .fc-container { background-color: #6e6e6e; box-shadow: none; padding: 6px; } .fc-meter { background-color: #000; display: block; height: 24px; margin: 8px auto; width: 8px; } .fc-arrow { margin-left: 2px; margin-top: 43px; } .fc-output { margin-left: 4px; margin-top: 38px; } /** Template:Anvil. **/ .av-container, .bw-container { background-color: #fff; border: 2px solid; border-color: #a3a3a3 #c8c8c8 #c8c8c8 #a3a3a3; border-radius: 13px; box-shadow: 0 0 1px #6c6c6c; padding: 17px 17px 17px 15px; } .av-hammer-icon { background: 0 -48px/96px no-repeat url(//mineblocks.com/1/wiki/images/archive/0/02/20211220041941%21Inventory_anvil.png); display: block; height: 48px; position: absolute; top: 17px; width: 48px; z-index: 2; } .av-title { bottom: 4px; color: #222; font: 400 1rem/1 'Volter (Goldfish)'; margin-left: 40px; position: relative; } .av-textfield { background: 0 -48px/235px repeat-x url(//mineblocks.com/1/wiki/images/0/02/Inventory_anvil.png); display: block; font: 400 1.125rem/1 'Volter (Goldfish)'; height: 1.5rem; margin-left: 57px; overflow: hidden; padding: 2px 0 0 4px; text-align: left; width: 231px; /* 235px - 4px from padding-left. */ } .av-textfield::selection { background-color: #363658; color: #fff; } .av-row { margin-top: 16px; text-align: right; } .av-plus { background: -24px -24px/48px no-repeat url(//mineblocks.com/1/wiki/images/archive/0/02/20211220041941%21Inventory_anvil.png); display: inline-block; height: 24px; margin: 0 15px; position: relative; top: 1px; width: 24px; } .av-arrow { background: 0 -48px/48px no-repeat url(//mineblocks.com/1/wiki/images/archive/0/02/20211220041941%21Inventory_anvil.png); display: inline-block; height: 23px; margin: 0 14px; position: relative; top: 1px; width: 34px; } .av-input, .av-input2, .av-output { display: inline-block; } /** Template:Brewing. **/ .bw-container { display: inline-block; padding: 17px 24px; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .bw-container .invslot-item { box-shadow: inset 1px 1px 0 0 #545454, -1px 0 #272727, -1px -1px #272727, 1px -1px #272727, 1px 1px #272727, -1px 1px #272727; } .bw-input { display: block; text-align: center; } .bw-input .bw-bubbles { background: -32px -40px/89px no-repeat url(//mineblocks.com/1/wiki/images/a/a9/Inventory_brewing.png); display: block; height: 38px; left: 34px; position: absolute; top: 27px; width: 19px; } .bw-input .invslot-item { margin: 0 auto; } .bw-input .bw-arrow { background: -56px 0/89px no-repeat url(//mineblocks.com/1/wiki/images/a/a9/Inventory_brewing.png); display: block; height: 36px; right: 36px; position: absolute; top: 27px; width: 17px; } .bw-paths { background: 0 0/89px no-repeat url(//mineblocks.com/1/wiki/images/a/a9/Inventory_brewing.png); display: block; height: 40px; margin: 0 auto; width: 55px; } .bw-potions { display: block; } .bw-potion.potion-1, .bw-potion.potion-3 { position: relative; bottom: 12px; } .bw-potion.potion-1 { right: 6px; } .bw-potion.potion-3 { left: 6px; } .bw-potion .invslot-item a[title*="Invisible-sprite"] { position: relative; } .bw-potion .invslot-item a[title*="Invisible-sprite"]:after { background: -73px -53px/89px no-repeat url(//mineblocks.com/1/wiki/images/a/a9/Inventory_brewing.png); content: ''; display: block; height: 15px; left: 12px; opacity: .4; position: absolute; top: 4px; width: 10px; } /** Template:Ilink. **/ .icon-link, .icon-link > a { white-space: nowrap; } .sprite-icon { background: url(//mineblocks.com/1/wiki/images/f/fc/Blocks.png) no-repeat; display: inline-block; height: 16.01px; margin-right: .5em; vertical-align: text-top; width: 16.01px; } /** Template:Blocks. **/ .navbox { width: 100%; line-height: 1.6; } #blocks-nav > tbody > tr > td, #items-nav > tbody > tr > td { border: 0; padding: 0; } .navbox > tbody > tr > td > .navbox { border-width: 0 1px; margin: 0; } .navbox .navbox th { width: 120px; } .navbox ul, .navbox li { display: inline; margin: 0; } .navbox li:not(:last-child):after { content: '\00a0•'; font-size: 1em; font-weight: bold; margin: 0 .5em; position: relative; top: 2px; } /** Template:Tasks. **/ .tasks-table > tbody > tr > td:nth-child(2), .tasks-table > tbody > tr > td:nth-child(7), .tasks-table > tbody > tr > td:nth-child(8) { text-align: center; } .tasks-table > tbody > tr > td:nth-child(5) { font-style: italic; } .tasks-table > tbody > tr > td:nth-child(8) { width: 120px; } .tasks { background-image: url(//mineblocks.com/1/wiki/images/d/df/Newgrounds_medals_atlas.jpg); /* For browsers that support .webp format: */ background-image: url(//mineblocks.com/1/wiki/images/4/43/Newgrounds_medals_atlas.webp); background-repeat: no-repeat; background-size: 624px; display: inline-block; height: 52px; width: 52px; } /** Template:Breaking. **/ .breaking-table { line-height: 1.25; } .breaking-table > tbody td { text-align: center; } .breaking-table > tbody > tr:first-child > th, .breaking-table > tbody > tr:first-child > td, .breaking-table > tbody > tr:nth-child(2) > th, .breaking-table > tbody > tr:nth-child(2) > td, .breaking-table > tbody > tr:nth-child(3) > th, .breaking-table > tbody > tr:nth-child(3) > td { padding: 4px 16px; } .breaking-table p { display: none; } .cell-neg { background-color: rgba(var(--theme-color__red--rgb), .24); } .cell-pos { background-color: rgba(var(--theme-color__green--rgb), .24); font-weight: 700; } .cell-eq { background-color: rgba(var(--theme-color__grey--rgb), .24); } /* Footer. */ #footer { padding: 0 0 16px; } #footer ul li { color: var(--theme-text-secondary-on-background); } /* Versions table. */ .versions-table tr > td:nth-child(2) { text-align: center; }