MediaWiki:Vector.css: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary |
Blanked the page Tag: Blanking |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* skin error overrides */ |
|||
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child( even ) td { |
|||
background-color: inherit !important; /* avoids white-on-white in dark skin */ |
|||
} |
|||
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td { |
|||
background-color: inherit !important; /* avoids white-on-white in dark skin */ |
|||
} |
|||
/*********************************************************************************************************** |
|||
* css reset for browser default rules and MediaWiki internal rules |
|||
***********************************************************************************************************/ |
|||
* { |
|||
outline: 0; |
|||
} |
|||
table { |
|||
white-space: unset; /* be set to `no-wrap` in MW internal css */ |
|||
} |
|||
html { |
|||
font-size: 16px; /* reset rem size */ |
|||
} |
|||
body { |
|||
overflow-y: unset; |
|||
} |
|||
pre { |
|||
margin: 0; |
|||
} |
|||
h1, h2, h3, h4, h5, h6 { |
|||
padding: 0; |
|||
border: 0 solid transparent; |
|||
} |
|||
table { |
|||
background-color: transparent; |
|||
display: table; |
|||
white-space: unset; |
|||
} |
|||
@media (max-width: calc(639px)) { |
|||
.mw-parser-output table { |
|||
display: table; |
|||
} |
|||
} |
|||
body, code { |
|||
background: none; |
|||
} |
|||
html { |
|||
color-scheme: dark; |
|||
} |
|||
.mw-body { |
|||
background-color: #202020; |
|||
color: #ccc; |
|||
border: 1px solid #ed7117; |
|||
font-family: sans-serif; |
|||
} |
|||
.mw-body h1, |
|||
.mw-body-content h1, |
|||
.mw-body-content h2, |
|||
.vector-body h3, |
|||
.vector-body h4, |
|||
.vector-body h5, |
|||
.vector-body h6 { |
|||
font-family: sans-serif; |
|||
} |
|||
.mw-heading, |
|||
h1, |
|||
h2, |
|||
h3, |
|||
h4, |
|||
h5, |
|||
h6 { |
|||
color: #ccc; |
|||
font-family: sans-serif; |
|||
} |
|||
.mw-footer li { |
|||
color: #ccc; |
|||
} |
|||
#mw-head #p-search .vector-search-box-input { |
|||
color: #ccc; |
|||
background: #202020; |
|||
box-shadow: none; |
|||
} |
|||
#mw-head #p-search .vector-search-box-inner { |
|||
border-color: #ed7117; |
|||
} |
|||
#filetoc { |
|||
background-color: #111; |
|||
border: 1px solid #383838; |
|||
} |
|||
div#simpleSearch { |
|||
background: 202020; |
|||
border: 1px solid #ed7117; |
|||
} |
|||
body { |
|||
background-color: #111; |
|||
} |
|||
ul { |
|||
list-style-image: none; |
|||
} |
|||
a { |
|||
color: #518fce; |
|||
} |
|||
a:visited { |
|||
color: #518fce; |
|||
} |
|||
code { |
|||
border-radius: 2px; |
|||
padding: 1px 4px; |
|||
} |
|||
pre, code, .mw-code { |
|||
color: #fff; |
|||
border: 1px solid #383838; |
|||
background: #181818; |
|||
} |
|||
#mw-page-base { |
|||
background-color: #111; |
|||
background-image: none; |
|||
background-position: bottom left; |
|||
height: 5em; |
|||
} |
|||
.vector-menu-tabs-legacy li { |
|||
float: left; |
|||
height: 100%; |
|||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
background-image: linear-gradient(to top,#ed7117 1px,#101010 0,#111 100%); |
|||
} |
|||
.vector-menu-tabs-legacy li a { |
|||
color: #518fce; |
|||
} |
|||
.vector-menu-tabs-legacy li a:visited { |
|||
color: #518fce; |
|||
} |
|||
.vector-menu-tabs-legacy .selected { |
|||
background: #111; |
|||
background-image: linear-gradient(to top,#202020 0,#111 100%); |
|||
border-bottom: none; |
|||
} |
|||
.vector-menu-tabs-legacy .selected a, .vector-menu-tabs-legacy .selected a:visited { |
|||
color: #ccc; |
|||
} |
|||
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading { |
|||
background-image: linear-gradient(rgba(0,0,0,0) 0,#ed7117 100%); |
|||
background-repeat: no-repeat; |
|||
background-size: 1px 100%; |
|||
} |
|||
.vector-menu-heading-label { |
|||
color: #ae7117; |
|||
font-size: 14px; |
|||
} |
|||
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading { |
|||
display: block; |
|||
color: #ed7117; |
|||
margin: 0.5em 0 0 0.66666667em; |
|||
border: 0; |
|||
padding: 0.25em 0; |
|||
font-size: 0.75em; |
|||
font-weight: normal; |
|||
background-image: linear-gradient(to right,rgba(0,0,0,0) 0, #ed7117 33%, #ed7117 66%, rgba(0,0,0,0) 100%); |
|||
background-position: center bottom; |
|||
background-repeat: no-repeat; |
|||
background-size: 100% 1px; |
|||
} |
|||
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited { |
|||
color: #518fce; |
|||
} |
|||
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a { |
|||
color: #518fce; |
|||
} |
|||
#catlinks { |
|||
--theme-box-border-radius: 0; |
|||
} |
|||
#catlinks { |
|||
text-align: left; |
|||
background: #111; |
|||
border: 1px solid #383838; |
|||
border-radius: 0; |
|||
margin: 16px 0 0 0; |
|||
padding: 0.5em 1em; |
|||
} |
|||
#pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read, |
|||
#pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read { |
|||
opacity: 0.51; |
|||
color: #ccc; |
|||
} |
|||
input[type="submit"], |
|||
button[type="submit"] { |
|||
background-color: #0077cc; |
|||
color: #ccc; |
|||
padding: 0.5em 1em; |
|||
border: none; |
|||
border-radius: 3px; |
|||
cursor: pointer; |
|||
} |
|||
input[type="submit"]:hover, |
|||
button[type="submit"]:hover { |
|||
background-color: #005fa3; |
|||
} |
|||
/*********************************************************************************************************** |
|||
* css for pages under MediaWiki or Special NS, or system widgets on template/module pages and so on |
|||
***********************************************************************************************************/ |
|||
/********* ooui *********/ |
|||
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined, |
|||
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle { |
|||
background: none; |
|||
} |
|||
.oo-ui-textInputWidget .oo-ui-inputWidget-input { |
|||
color: var(--theme-text-color); |
|||
} |
|||
.oo-ui-tabOptionWidget { |
|||
color: var(--theme-text-color); |
|||
} |
|||
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { |
|||
color: var(--theme-text-color); |
|||
background: none; |
|||
} |
|||
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button { |
|||
color: var(--theme-content-text-mix-color); |
|||
} |
|||
.oo-ui-tabSelectWidget-framed { |
|||
background: none; |
|||
} |
|||
/********* Special:Preferences *********/ |
|||
#preferences .mw-htmlform-submit-buttons { |
|||
background-color: var(--theme-background-color--secondary); |
|||
border-top: 1px solid var(--theme-border-color); |
|||
border-left: 1px solid var(--theme-border-color); |
|||
border-right: 1px solid var(--theme-border-color); |
|||
} |
|||
.mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed, .mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout { border-color: var(--theme-border-color); } |
|||
fieldset { |
|||
border: 1px solid #ed711788; |
|||
} |
|||
.toc { |
|||
background-color: #111; |
|||
border:1px solid #ed711744; |
|||
} |
|||
.tocnumber { |
|||
color: #aaa; |
|||
} |
|||
dev#content table { |
|||
color: #ccc; |
|||
} |
|||
.darktable, .darkbox, div#content table.wikitable, div#content table.cargoTable { |
|||
border: 1px solid var(--theme-border-color); |
|||
padding: 5px; |
|||
background: var(--theme-background-color); |
|||
margin: 0.5em 0em 1em 0.5em; |
|||
} |
|||
table.darktable th, |
|||
table.darkbox th, |
|||
.navbox-title, |
|||
table.navbox th, |
|||
table.stylish td:first-child { |
|||
background-color: #062544; |
|||
} |
|||
table.darktable th, |
|||
table.darktable tr:not(:first-child) th.outer, |
|||
table.darkbox th, |
|||
table.darkbox tr:not(:first-child) th.outer, |
|||
table.stylish td:first-child, |
|||
div#content table.wikitable > tr > th, |
|||
div#content table.wikitable > * > tr > th, |
|||
div#content table.cargoTable > tr > th, |
|||
div#content table.cargoTable > * > tr > th { |
|||
background-color: #062544; |
|||
padding: 0 0.5em; |
|||
} |
|||
div#content, |
|||
h1, |
|||
h2, |
|||
h3, |
|||
h4, |
|||
h5, |
|||
h6, |
|||
pre, |
|||
div#content table { |
|||
color: #ccc; |
|||
} |
|||
table.wikitable > tr > th, table.wikitable > * > tr > th { |
|||
border-color: #303030; |
|||
color: #ccc; |
|||
} |
|||
.darktable,.darkbox,div#content table.wikitable,div#content table.cargoTable { |
|||
border: 1px solid var(--theme-border-color); |
|||
padding: 5px; |
|||
background: var(--theme-background-color); |
|||
margin: 0.5em 0em 1em 0.5em |
|||
} |
|||
table.wikitable,table.cargoTable { |
|||
border-collapse: unset |
|||
} |
|||
.wikitable > tr > th,.wikitable > tr > td,.wikitable > * > tr > th,.wikitable > * > tr > td,.cargoTable > tr > th,.cargoTable > tr > td,.cargoTable > * > tr > th,.cargoTable > * > tr > td { |
|||
border: none |
|||
} |
|||
.darktable,.stylish { |
|||
font-size: 89% |
|||
} |
|||
.stylish { |
|||
padding: 5px; |
|||
margin: 0.5em 0em 1em 0.5em |
|||
} |
|||
table.darktable th,table.darktable tr:not(:first-child) th.outer,table.darkbox th,table.darkbox tr:not(:first-child) th.outer,table.stylish td:first-child,div#content table.wikitable > tr > th,div#content table.wikitable > * > tr > th,div#content table.cargoTable > tr > th,div#content table.cargoTable > * > tr > th { |
|||
background-color: var(--theme-header-background-color); |
|||
padding: 0 0.5em; |
|||
} |
|||
table.darktable caption { |
|||
font-size: 120%; |
|||
font-weight: bold |
|||
} |
|||
table.darktable tr:not(:first-child) th,table.darkbox tr:not(:first-child) th,div#content table.wikitable tr:not(:first-child) th,div#content table.cargoTable tr:not(:first-child) th { |
|||
background-color: var(--theme-header-background-color) |
|||
} |
|||
.rowtitle { |
|||
font-size: 1.15em; |
|||
padding: 0.2em 2em 0.2em 0.5em |
|||
} |
|||
table.extrapadding td { |
|||
padding-left: 4px; |
|||
padding-right: 4px |
|||
} |
|||
table.td-right td { |
|||
text-align: right |
|||
} |
|||
div#content .title { |
|||
background-color: var(--theme-background-color--secondary); |
|||
text-align: center; |
|||
font-weight: bold; |
|||
padding: 1px 2px |
|||
} |
|||
.theme-dark table.darktable td.title,.theme-dark .darkbox td.title { |
|||
background-color: #303030 |
|||
} |
|||
.alt,.rowtitle { |
|||
background-color: var(--theme-background-color-alt) |
|||
} |
|||
table.zebra > tbody > tr:nth-child(2n+1),table.zebra.darktable > tbody > tr:nth-child(2n+1),table.zebra.wikitable > tbody > tr:nth-child(2n+1),table.zebra.darkbox > tbody > tr:nth-child(2n+1),table.filehistory > tbody > tr:nth-child(2n+1) { |
|||
background-color: var(--theme-background-color-alt) |
|||
} |
|||
table .hover:hover { |
|||
background-color: orange |
|||
} |
|||
/* Gadget description length */ |
|||
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header, |
|||
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body { |
|||
max-width: unset; |
|||
} |
|||
/******* Search result page. (Special:Search) ******/ |
|||
.mw-search-form-wrapper { |
|||
font-size: 1em; |
|||
} |
|||
.mw-search-form-wrapper #mw-search-top-table { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.mw-search-form-wrapper #mw-search-top-table > div { |
|||
float: none; |
|||
} |
|||
.mw-search-form-wrapper .results-info { |
|||
color: var(--theme-content-text-mix-color); |
|||
font-size: 1em; |
|||
padding: 0 0 0 3em; |
|||
white-space: nowrap; |
|||
text-align: right; |
|||
flex: 1 1 auto; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-visualclear { |
|||
display: none; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs { |
|||
border: 0; |
|||
margin: 1em 0; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs .search-types + div { |
|||
display: none; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs .search-types { |
|||
width: 100%; |
|||
float: none; |
|||
padding: 0; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li { |
|||
float: none; |
|||
display: inline-block; |
|||
vertical-align: middle; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li.current { |
|||
background:var(--theme-border-color); |
|||
border-radius: 2px; |
|||
overflow: hidden; |
|||
} |
|||
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li.current:nth-child(1) { |
|||
border-radius: 0 2px 2px 0; |
|||
} |
|||
.mw-search-form-wrapper #mw-searchoptions { |
|||
padding: 1em; |
|||
background: var(--theme-background-color-alt); |
|||
border: 1px solid var(--theme-accent-color); |
|||
border-radius: 4px; |
|||
} |
|||
/* New inline in Special:History diffs */ |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip { |
|||
background-color: var(--theme-accent-color-bright); |
|||
border-color: var(--theme-accent-color); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover { |
|||
background-color: var(--theme-accent-color); |
|||
border-color: var(--theme-accent-color); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover { |
|||
background-color: var(--theme-accent-color); |
|||
border-color: var(--theme-accent-color-bright); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus { |
|||
border-color: var(--theme-accent-color-bright); |
|||
box-shadow: inset 0 0 0 1px var(--theme-accent-color-bright); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip { |
|||
border-color: var(--theme-accent-color-bright); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip { |
|||
background-color: var(--theme-accent-color); |
|||
border-color: var(--theme-accent-color); |
|||
} |
|||
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip { |
|||
background-color: var(--theme-accent-color-bright); |
|||
border-color: #0006; |
|||
} |
|||
/* Edit conflict */ |
|||
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice { |
|||
background-color: var(--theme-background-color--secondary); |
|||
border-color: var(--theme-border-color); |
|||
} |
|||
.mw-twocolconflict-single-column.mw-twocolconflict-split-copy, .mw-twocolconflict-split-column.mw-twocolconflict-split-copy { |
|||
border-color: var(--theme-border-color); |
|||
background-color: var(--theme-background-color--secondary); |
|||
color: var(--theme-text-color); |
|||
} |
|||
.mw-twocolconflict-single-column .mw-twocolconflict-split-collapsed .mw-twocolconflict-split-fade, .mw-twocolconflict-split-column .mw-twocolconflict-split-collapsed .mw-twocolconflict-split-fade { |
|||
background-image: linear-gradient(transparent,var(--theme-background-color-alt)); |
|||
} |
|||
.mw-twocolconflict-single-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-delete, .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-delete { |
|||
border-color: var(--theme-border-color); |
|||
} |
|||
.mw-twocolconflict-single-column, .mw-twocolconflict-split-column { |
|||
background-color: var(--theme-background-color--secondary); |
|||
color: var(--theme-text-color); |
|||
} |
|||
.mw-twocolconflict-single-column.mw-twocolconflict-split-unselected ins.mw-twocolconflict-diffchange, .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected ins.mw-twocolconflict-diffchange { |
|||
background-color: var(--theme-border-color); |
|||
} |
|||
.mw-twocolconflict-single-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-add, .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-add { |
|||
border-color: var(--theme-border-color); |
|||
} |
|||
.mw-twocolconflict-split-selection > div:nth-child(2) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span, .mw-twocolconflict-split-selection > div:nth-child(2) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:active + span, .mw-twocolconflict-split-selection > div:nth-child(2) .oo-ui-radioInputWidget [type="radio"] + span { |
|||
background: var(--theme-background-color--secondary); |
|||
} |
|||
.mw-twocolconflict-split-selection > div:nth-child(1) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span, .mw-twocolconflict-split-selection > div:nth-child(1) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:active + span, .mw-twocolconflict-split-selection > div:nth-child(1) .oo-ui-radioInputWidget [type="radio"] + span { |
|||
background: var(--theme-background-color--secondary); |
|||
} |
|||
.mw-twocolconflict-split-editable .mw-twocolconflict-split-editor, .mw-twocolconflict-split-difftext { color: var(--theme-text-color); } |
|||
/* ?action=history */ |
|||
#pagehistory li { |
|||
border: dashed 1px var(--theme-border-color); |
|||
} |
|||
/* Wiki editor */ |
|||
.wikiEditor-ui-toolbar .tabs span.tab a::before { |
|||
left: 5px; |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-error { |
|||
background-color: rgba(154,0,0,0.8); |
|||
border: solid 1px #d33; |
|||
color: var(--theme-text-color) |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-warn { |
|||
background-color: rgba(138,104,0,0.8); |
|||
border: solid 1px #fc3; |
|||
color: var(--theme-text-color) |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-success { |
|||
background-color: rgba(1,140,48,0.8); |
|||
border: solid 1px rgb(1,210,48); |
|||
color: var(--theme-text-color) |
|||
} |
|||
/** headings **/ |
|||
.mw-body h1, .mw-body-content h1, .mw-body-content h2, |
|||
.vector-body h3, .vector-body h4, |
|||
.vector-body h5, .vector-body h6 {/* |
|||
margin: 0; |
|||
color: var(--theme-heading-color);*/ |
|||
font-family: var(--theme-heading-font-face, sans-serif);/* |
|||
line-height: var(--theme-heading-line-height, 1.25); |
|||
font-weight: var(--theme-heading-font-weight, normal);*/ |
|||
}/* |
|||
.mw-body h1, .mw-body-content h1 { |
|||
font-size: var(--theme-heading-font-size-h1, 32px); |
|||
line-height: var(--theme-heading-line-height-h1, 40px); |
|||
font-weight: var(--theme-heading-font-weight-h1, var(--theme-heading-font-weight, normal)); |
|||
}*/ |
|||
.mw-body-content h2 {/* |
|||
font-size: var(--theme-heading-font-size-h2, 24px); |
|||
line-height: var(--theme-heading-line-height-h2, 30px); |
|||
font-weight: var(--theme-heading-font-weight-h2, var(--theme-heading-font-weight, normal)); |
|||
margin-top: 18px; |
|||
margin-bottom: 9px;*/ |
|||
border-bottom: 1px solid var(--theme-heading-rule-color-h2);/* |
|||
padding-bottom: 3px;*/ |
|||
} |
|||
/*.vector-body h3 { |
|||
font-size: var(--theme-heading-font-size-h3, 20px); |
|||
line-height: var(--theme-heading-line-height-h3, 26px); |
|||
font-weight: var(--theme-heading-font-weight-h3, var(--theme-heading-font-weight, normal)); |
|||
margin-top: 14px; |
|||
margin-bottom: 7px; |
|||
} |
|||
.vector-body h4 { |
|||
font-size: var(--theme-heading-font-size-h4, 16px); |
|||
line-height: var(--theme-heading-line-height-h4, 22px); |
|||
font-weight: var(--theme-heading-font-weight-h4, var(--theme-heading-font-weight, normal)); |
|||
margin-top: 14px; |
|||
margin-bottom: 7px; |
|||
} |
|||
.vector-body h5 { |
|||
font-size: var(--theme-heading-font-size-h5, 14px); |
|||
line-height: var(--theme-heading-line-height-h5, 22px); |
|||
font-weight: var(--theme-heading-font-weight-h5, bold); |
|||
margin-top: 10px; |
|||
margin-bottom: 7px; |
|||
} |
|||
.vector-body h6 { |
|||
font-size: var(--theme-heading-font-size-h6, 12px); |
|||
line-height: var(--theme-heading-line-height-h6, 20px); |
|||
font-weight: var(--theme-heading-font-weight-h1, bold); |
|||
margin-top: 7px; |
|||
margin-bottom: 7px; |
|||
}*/ |
|||
/* reduce heading font size: */ |
|||
@media (max-width: 900px) { |
|||
.mw-body h1, .mw-body-content h1 { |
|||
font-size: 24px; |
|||
line-height: 32px; |
|||
} |
|||
.mw-body-content h2 { |
|||
font-size: 20px; |
|||
line-height: 28px; |
|||
} |
|||
.vector-body h3 { |
|||
font-size: 18px; |
|||
line-height: 24px; |
|||
} |
|||
} |
|||
/* section edit link */ |
|||
.mw-editsection { |
|||
white-space: nowrap; |
|||
color: var(--theme-content-text-mix-color); |
|||
} |
|||
/*********************************************************************************************************** |
|||
* Styles for "real" wiki page content. (in div.mw-parser-output) |
|||
***********************************************************************************************************/ |
|||
/* external link icon. */ |
|||
.link-https { |
|||
padding-right: 0; |
|||
background: none; |
|||
} |
|||
/* custom icon color*/ |
|||
.mw-parser-output a.external { |
|||
background-position:center right; |
|||
background-repeat:no-repeat; |
|||
background-image:url(https://commons.wiki.gg/images/2/25/External.svg); |
|||
background-size:10px; |
|||
padding-right:13px |
|||
} |
|||
.mw-parser-output > :first-child { |
|||
margin-top: 0; |
|||
} |
|||
/*********************************************************************************************************** |
|||
* Over-width table floating-scroll |
|||
***********************************************************************************************************/ |
|||
/* |
|||
css for floating-scroll v3.2.0 |
|||
https://amphiluke.github.io/floating-scroll/ |
|||
(c) 2022 Amphiluke |
|||
*/ |
|||
.fl-scrolls { |
|||
overflow: auto; |
|||
position: fixed; |
|||
} |
|||
.fl-scrolls div { |
|||
overflow: hidden; |
|||
pointer-events: none; |
|||
} |
|||
.fl-scrolls div:before { |
|||
content: " "; |
|||
} |
|||
.fl-scrolls, .fl-scrolls div { |
|||
font-size: 1px; |
|||
line-height: 0; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
.fl-scrolls-hidden div:before { |
|||
content: " "; |
|||
} |
|||
.fl-scrolls-viewport { |
|||
position: relative; |
|||
} |
|||
.fl-scrolls-body { |
|||
overflow: auto; |
|||
} |
|||
.fl-scrolls-viewport .fl-scrolls { |
|||
position: absolute; |
|||
} |
|||
.fl-scrolls-hoverable .fl-scrolls { |
|||
opacity: 0; |
|||
transition: opacity 0.5s 0.3s; |
|||
} |
|||
.fl-scrolls-hoverable:hover .fl-scrolls { |
|||
opacity: 1; |
|||
} |
|||
.fl-scrolls:not([data-orientation]), .fl-scrolls[data-orientation=horizontal] { |
|||
bottom: 0; |
|||
min-height: 17px; |
|||
} |
|||
.fl-scrolls:not([data-orientation]) div, .fl-scrolls[data-orientation=horizontal] div { |
|||
height: 1px; |
|||
} |
|||
.fl-scrolls-hidden.fl-scrolls:not([data-orientation]), .fl-scrolls-hidden.fl-scrolls[data-orientation=horizontal] { |
|||
bottom: 9999px; |
|||
} |
|||
.fl-scrolls-viewport .fl-scrolls:not([data-orientation]), .fl-scrolls-viewport .fl-scrolls[data-orientation=horizontal] { |
|||
left: 0; |
|||
} |
|||
.fl-scrolls[data-orientation=vertical] { |
|||
right: 0; |
|||
min-width: 17px; |
|||
} |
|||
.fl-scrolls[data-orientation=vertical] div { |
|||
width: 1px; |
|||
} |
|||
.fl-scrolls-hidden.fl-scrolls[data-orientation=vertical] { |
|||
right: 9999px; |
|||
} |
|||
.fl-scrolls-viewport .fl-scrolls[data-orientation=vertical] { |
|||
top: 0; |
|||
} |
|||
/****** postedit notification ******/ |
|||
.postedit-container { |
|||
top: 4em; |
|||
} |
|||
.mw-dismissable-notice { |
|||
position: fixed; |
|||
left: 2em; |
|||
right: 2em; |
|||
bottom: 4em; |
|||
background: var(--theme-site-background); |
|||
max-width: 500px; |
|||
min-height: 80px; |
|||
padding: 12px 8px; |
|||
box-sizing: border-box; |
|||
text-align: left; |
|||
border: 1px solid var(--theme-accent-color); |
|||
border-left-width: 8px; |
|||
backdrop-filter: var(--theme-box-back-backdrop-filter); |
|||
box-shadow: 0 0 10px rgba(127, 127, 127, 0.3); |
|||
} |
|||
.mw-dismissable-notice .mw-dismissable-notice-close { |
|||
font-size: 11px; |
|||
} |
|||
.mw-dismissable-notice .mw-dismissable-notice-body { |
|||
margin: 0px 40px 0px 24px; |
|||
font-size: 14px; |
|||
} |
|||
.mw-dismissable-notice #localNotice { |
|||
margin: 0; |
|||
} |
|||
/***** Notification area *****/ |
|||
.mw-notification-area-overlay { |
|||
position: fixed; |
|||
z-index: 9999; |
|||
} |
|||
.mw-notification-area { |
|||
font-size: 0.90em; |
|||
line-height: 1.7142857143; |
|||
} |
|||
/* Bubble notifications */ |
|||
.mw-notification { |
|||
color: var(--theme-text-color); |
|||
box-sizing: border-box; |
|||
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-accent-color); |
|||
border-radius: var(--theme-box-border-radius); |
|||
backdrop-filter: var(--theme-box-back-backdrop-filter); |
|||
box-shadow: var(--theme-box-shadow); |
|||
background: var(--theme-background-color--secondary); |
|||
transform: none; |
|||
} |
|||
body.skin-vector .mw-notification, /* default */ |
|||
#mw-notification-area .mw-notification.mw-notification-type-info { |
|||
background-color: var(--theme-background-color--secondary); |
|||
border: solid 1px var(--theme-border-color); |
|||
color: var(--theme-text-color); |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-error { |
|||
background-color: rgba(154,0,0,0.8); |
|||
border: solid 1px #d33; |
|||
color: var(--theme-text-color); |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-warn { |
|||
background-color: rgba(138,104,0,0.8); |
|||
border: solid 1px #fc3; |
|||
color: var(--theme-text-color); |
|||
} |
|||
#mw-notification-area .mw-notification.mw-notification-type-success { |
|||
background-color: rgba(1,140,48,0.8); |
|||
border: solid 1px rgb(1,210,48); |
|||
color: var(--theme-text-color); |
|||
} |
|||
/****** indicators ******/ |
|||
.mw-indicators { |
|||
position: absolute; |
|||
right: 2rem; |
|||
margin-top: 5px; |
|||
} |
|||
/* Footer icons */ |
|||
html.view-dark #footer #footer-icons a:has([data-theme="dark"]) { |
|||
background-color: var(--theme-background-color--secondary); |
|||
border-color: var(--theme-border-color); |
|||
} |
|||
/**** #footer (copyright info) ****/ |
|||
#footer { |
|||
background: var(--theme-site-background); |
|||
padding: 16px 24px; |
|||
border-radius: 0 0 var(--theme-box-border-radius) var(--theme-box-border-radius); |
|||
position: relative; |
|||
z-index: 0; /* covered by content */ |
|||
font-size: 12px; |
|||
} |
|||
.mw-footer li { |
|||
color: var(--theme-content-text-mix-color); |
|||
} |
|||
#footer a { |
|||
color: var(--theme-link-color); |
|||
} |
|||
#footer a:hover { |
|||
color: var(--theme-link-color-hover); |
|||
} |
|||
#footer-info { |
|||
display: contents; |
|||
} |
|||
#footer ul li { |
|||
font-size: inherit; |
|||
line-height: 1.5; |
|||
padding: 0; |
|||
} |
|||
#footer #footer-info-lastmod { |
|||
margin-bottom: 1em; |
|||
} |
|||
#footer #footer-info-copyright { |
|||
position: relative; |
|||
padding-right: 100px; |
|||
} |
|||
#footer-places > * { |
|||
margin-top: 1em; |
|||
} |
|||
/*** search result suggestions ***/ |
|||
.suggestions { |
|||
background-color: var(--theme-dropdown-background); |
|||
box-sizing: border-box; |
|||
margin-top: 0; |
|||
box-shadow: var(--theme-box-shadow); |
|||
backdrop-filter: var(--theme-box-back-backdrop-filter); |
|||
} |
|||
.suggestions .suggestions-results, |
|||
.suggestions .suggestions-special { |
|||
background: none; |
|||
} |
|||
.suggestions .suggestions-results { |
|||
border: var(--theme-dropdown-border); |
|||
border-top: 0; |
|||
border-bottom-color: var(--theme-rule-color); |
|||
} |
|||
.suggestions .suggestions-results:empty { |
|||
border-bottom: 0; |
|||
} |
|||
.suggestions .suggestions-result, .suggestions .suggestions-special .special-query { |
|||
color: var(--theme-text-color); |
|||
} |
|||
.suggestions .suggestions-special .special-label { |
|||
color: var(--theme-content-text-mix-color); |
|||
} |
|||
.suggestions .suggestions-result { |
|||
padding: 1px 4px; |
|||
} |
|||
.suggestions .suggestions-special { |
|||
margin: 0; |
|||
padding: 2px 4px 4px; |
|||
border: 1px solid var(--theme-border-color); |
|||
border-top: 0; |
|||
border-radius: var(--theme-box-border-radius); |
|||
border-top-left-radius: 0; |
|||
border-top-right-radius: 0; |
|||
} |
|||
.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-color); |
|||
} |
|||
.suggestions .suggestions-result-current { background: var(--theme-highlight-background); } |
|||
/*** search form ***/ |
|||
#mw-head #p-search { |
|||
/* navbar common border bottom */ |
|||
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color); |
|||
/*background: var(--theme-background-shadow);*/ |
|||
margin: 0; |
|||
align-self: stretch; |
|||
} |
|||
#mw-head #p-search form { |
|||
margin: 0; |
|||
} |
|||
#mw-head #p-search .vector-search-box-inner { |
|||
border-width: 1px; |
|||
border-style: solid; |
|||
border-color: var(--theme-border-color); |
|||
border-radius: 2px; |
|||
} |
|||
#mw-head #p-search .vector-search-box-inner:hover { |
|||
border-color: var(--theme-border-color-hover); |
|||
} |
|||
#mw-head #p-search .vector-search-box-inner:focus-within { |
|||
border-color: var(--theme-border-color-focus); |
|||
box-shadow: var(--theme-shadow-focus); |
|||
} |
|||
#mw-head #p-search .vector-search-box-input { |
|||
border: 0; |
|||
color: var(--theme-text-color); |
|||
background: var(--theme-background-color-alt); |
|||
box-shadow: var(--theme-shadow); |
|||
height: 26px; |
|||
padding: 0 26px 0 4px; |
|||
} |
|||
#mw-head #p-search .vector-search-box-input:focus { |
|||
outline: 0; |
|||
z-index: 1100; /* .suggestions: 1099 */ |
|||
} |
|||
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton { |
|||
z-index: 1101; |
|||
} |
|||
#mw-head #p-search .vector-search-box-input::placeholder { |
|||
color: var(--theme-content-text-mix-color); |
|||
} |
|||
#mw-head #p-search .mw-searchButton { |
|||
opacity: 0; |
|||
} |
|||
#mw-head #p-search .searchButton { |
|||
width: 26px; |
|||
min-width: unset; |
|||
opacity: 1; |
|||
background-image: none; |
|||
--mask: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E search %3C/title%3E%3Cpath fill-rule='evenodd' d='M12.2 13.6a7 7 0 1 1 1.4-1.4l5.4 5.4-1.4 1.4-5.4-5.4zM13 8A5 5 0 1 1 3 8a5 5 0 0 1 10 0z'/%3E%3C/svg%3E%0A") no-repeat; |
|||
-webkit-mask: var(--mask); |
|||
mask: var(--mask); |
|||
-webkit-mask-size: 18px 18px; |
|||
mask-size: 18px 18px; |
|||
-webkit-mask-position: center center; |
|||
mask-position: center center; |
|||
background-color: var(--theme-link-color); |
|||
} |
|||
.theme-dark #simpleSearch .searchButton { |
|||
filter: invert(0); |
|||
} |
|||
#mw-head #p-search #searchform:hover .searchButton { |
|||
background-color: var(--theme-link-color-hover); |
|||
} |
|||
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton { |
|||
background-color: var(--theme-link-color-focus); |
|||
} |
|||
/* dropdown menu*/ |
|||
#mw-head .vector-menu-dropdown .vector-menu-heading { |
|||
/* tab label */ |
|||
position: relative; |
|||
display: flex; |
|||
align-items: center; |
|||
gap: 3px; |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-heading::after { |
|||
/* arrow icon */ |
|||
background: none; |
|||
opacity: unset; |
|||
content: ""; |
|||
display: block; |
|||
width: 0; |
|||
height: 0; |
|||
border-style: solid; |
|||
border-color: var(--theme-icon-color) transparent; |
|||
border-width: 6px 5px 0; |
|||
margin-top: 2px; |
|||
} |
|||
#mw-head .vector-menu-dropdown:hover .vector-menu-heading::after { |
|||
/* .vector-menu-heading is covered by .vector-menu-checkbox, therefore we can't use .vector-menu-heading:hover::after */ |
|||
border-color: var(--theme-icon-color-hover) transparent; |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content { |
|||
/* dropdown list body */ |
|||
border: var(--theme-dropdown-border); |
|||
border-radius: var(--theme-box-border-radius); |
|||
background: var(--theme-dropdown-background); |
|||
backdrop-filter: var(--theme-dropdown-backdrop-filter); |
|||
border-top-left-radius: 0; |
|||
border-top-right-radius: 0; |
|||
left: 0; /* reset */ |
|||
z-index: 10; |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content ul { |
|||
--theme-link-color: var(--theme-text-color); |
|||
--theme-link-color-visited: var(--theme-link-color); |
|||
--theme-link-color-hover: var(--theme-link-color); |
|||
padding: 4px; |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content li:hover { |
|||
background: var(--theme-highlight-background); |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content li a { |
|||
display: block; |
|||
padding: var(--dropdown-item-padding-y) var(--dropdown-item-padding-x); |
|||
text-decoration: none; |
|||
color: var(--theme-link-color); |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content li a:visited { |
|||
color: var(--theme-link-color-visited); |
|||
} |
|||
#mw-head .vector-menu-dropdown .vector-menu-content li a:hover { |
|||
color: var(--theme-link-color-hover); |
|||
} |
|||