Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
m |
|||
(38 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
+ | |||
+ | /********/ | ||
+ | /* Font */ | ||
+ | /********/ | ||
+ | |||
+ | @import url('https://fonts.googleapis.com/css?family=Podkova:400,700&subset=latin-ext'); | ||
+ | @import url('https://fonts.googleapis.com/css?family=Inconsolata:400,700'); | ||
+ | |||
+ | |||
+ | /**************/ | ||
+ | /* Restyling */ | ||
+ | /**************/ | ||
+ | |||
+ | body { | ||
+ | background-color: #242d3c; | ||
+ | font-family: Podkova, "Courier New", Courier, monospace; | ||
+ | } | ||
+ | |||
+ | .mw-body, | ||
+ | .parsoid-body { | ||
+ | background: #fff; | ||
+ | } | ||
+ | |||
+ | .mw-body #siteSub { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | /* Links */ | ||
+ | |||
+ | a:link, | ||
+ | a:active, | ||
+ | div#mw-panel div.portal div.body ul li a, | ||
+ | div.vectorTabs li.selected a, | ||
+ | div.vectorTabs li.selected a, | ||
+ | div.vectorTabs li a { | ||
+ | text-decoration: none; | ||
+ | color: #ff8319; | ||
+ | } | ||
+ | |||
+ | a:visited, | ||
+ | div#mw-panel div.portal div.body ul li a:visited, | ||
+ | div.vectorTabs li.selected a:visited, | ||
+ | div.vectorTabs li.selected a:visited { | ||
+ | text-decoration: none; | ||
+ | color: #e77a1c; | ||
+ | } | ||
+ | |||
+ | a:hover { | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | a.new, | ||
+ | #p-personal a.new, | ||
+ | div.vectorTabs li.new a, | ||
+ | div.vectorTabs li.new a:visited, | ||
+ | div.vectorTabs li.new a, | ||
+ | div.vectorTabs li.new { | ||
+ | text-decoration: none; | ||
+ | color: #ba0000; | ||
+ | } | ||
+ | |||
+ | |||
+ | /**********/ | ||
+ | /* Cursor */ | ||
+ | /**********/ | ||
+ | |||
+ | *, | ||
+ | .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button, | ||
+ | .oo-ui-buttonGroupWidget .oo-ui-buttonWidget.oo-ui-buttonElement-active .oo-ui-buttonElement-button, | ||
+ | .oo-ui-popupWidget-head > .oo-ui-labelElement-label, | ||
+ | .oo-ui-menuSectionOptionWidget.oo-ui-widget-enabled, | ||
+ | .oo-ui-dropdownWidget-handle, | ||
+ | .oo-ui-multioptionWidget.oo-ui-widget-disabled, | ||
+ | div#mw-panel div.portal h3 { | ||
+ | cursor: url(/~donald/zero/resources/assets/cursor.png) 7 0, auto; | ||
+ | } | ||
+ | |||
+ | a, | ||
+ | a img, | ||
+ | div.vectorTabs ul li, | ||
+ | div.vectorTabs li a, | ||
+ | div.vectorMenu, | ||
+ | div.vectorMenu ul li, | ||
+ | div.vectorMenu li a, | ||
+ | .oo-ui-buttonElement > .oo-ui-buttonElement-button, | ||
+ | .oo-ui-optionWidget.oo-ui-widget-enabled, | ||
+ | .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'], | ||
+ | .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'] + span, | ||
+ | .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select, | ||
+ | .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'], | ||
+ | .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'] + span, | ||
+ | .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator, | ||
+ | .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle, | ||
+ | .oo-ui-multioptionWidget.oo-ui-widget-enabled, | ||
+ | div#simpleSearch #searchButton,div#simpleSearch #mw-searchButton { | ||
+ | cursor: url(/~donald/zero/resources/assets/cursorlink.png) 5 0, pointer; | ||
+ | } | ||
+ | |||
+ | textarea, | ||
+ | div#simpleSearch input, | ||
+ | .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon,.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { | ||
+ | cursor: text; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*********************************/ | ||
+ | /* Zero word effect by User:Nclm */ | ||
+ | /*********************************/ | ||
+ | |||
+ | @supports (background-clip: text) or (-webkit-background-clip: text) { | ||
+ | @keyframes zero { | ||
+ | from { background-position: -800px -83px; } | ||
+ | to { background-position: 0% 0%; } | ||
+ | } | ||
+ | .zero { | ||
+ | background-image: url(/~donald/zero/images/3/36/Zero_Fog.png); | ||
+ | animation-name: zero; | ||
+ | animation-duration: 20s; | ||
+ | animation-timing-function: linear; | ||
+ | animation-iteration-count: infinite; | ||
+ | -webkit-background-clip: text; | ||
+ | background-clip: text; | ||
+ | color: rgba(0,0,0,0); | ||
+ | } | ||
+ | a .zero { | ||
+ | background-image: url(/~donald/zero/images/e/e7/ZeroLink_Fog.png); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @supports (background-clip: text) or (-webkit-background-clip: text) { | ||
+ | @keyframes zerowhite { | ||
+ | from { background-position: -800px -83px; } | ||
+ | to { background-position: 0% 0%; } | ||
+ | } | ||
+ | .zerowhite { | ||
+ | background-image: url(/~donald/zero/images/7/73/ZeroWhite_Fog.png); | ||
+ | animation-name: zerowhite; | ||
+ | animation-duration: 20s; | ||
+ | animation-timing-function: linear; | ||
+ | animation-iteration-count: infinite; | ||
+ | -webkit-background-clip: text; | ||
+ | background-clip: text; | ||
+ | color: rgba(0,0,0,0); | ||
+ | } | ||
+ | a .zerowhite { | ||
+ | background-image: url(/~donald/zero/images/e/e7/ZeroLink_Fog.png); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | /***********/ | ||
+ | /* Footer */ | ||
+ | /**********/ | ||
+ | |||
+ | div#footer, | ||
+ | #footer { | ||
+ | background: #f0f3fc; | ||
+ | margin-right: 5em; | ||
+ | margin-bottom: 5em; | ||
+ | box-shadow: 4px 4px 0px #999; | ||
+ | margin-top: 1.5em; | ||
+ | } | ||
+ | |||
+ | div#footer #footer-icons li { | ||
+ | margin-left: 0; | ||
+ | } | ||
+ | |||
+ | div#footer #footer-icons li a { | ||
+ | margin-left: 0.5em; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*************/ | ||
+ | /* Infoboxes */ | ||
+ | /*************/ | ||
.infobox { | .infobox { | ||
Line 6: | Line 181: | ||
float: right; | float: right; | ||
margin: 0 0 1em 1em; | margin: 0 0 1em 1em; | ||
− | padding: 1em; | + | padding: 0.5em 1em 1em 1em; |
width: 300px; | width: 300px; | ||
} | } | ||
Line 13: | Line 188: | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
+ | margin-bottom: 0.25em; | ||
} | } | ||
.infobox-image { | .infobox-image { | ||
text-align: center; | text-align: center; | ||
+ | margin-bottom: 0.25em; | ||
} | } | ||
.infobox th { | .infobox th { | ||
Line 24: | Line 201: | ||
.infobox td { | .infobox td { | ||
vertical-align: top; | vertical-align: top; | ||
+ | padding-left: 4px; | ||
+ | } | ||
+ | |||
+ | table.ambox { | ||
+ | border: 1px solid #a2a9b1; | ||
+ | border-left: 10px solid #ff8319; | ||
+ | background: #fbfbfb | ||
+ | } | ||
+ | table.ambox-content { | ||
+ | border-left: 10px solid #f28500; | ||
+ | } | ||
+ | .mbox-small-left { | ||
+ | margin: 4px 1em 4px 0; | ||
+ | box-sizing: border-box; | ||
+ | overflow: hidden; | ||
+ | width: 238px; | ||
+ | border-collapse: collapse; | ||
+ | font-size: 88%; | ||
+ | line-height: 1.25em; | ||
+ | } | ||
+ | .ambox th.mbox-text, | ||
+ | .ambox td.mbox-text { | ||
+ | padding: 0.25em 0.5em; | ||
+ | width: 100%; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /***********/ | ||
+ | /* Tab bar */ | ||
+ | /***********/ | ||
+ | |||
+ | div.vectorTabs { | ||
+ | background-image: none; | ||
+ | padding-left: 0; | ||
+ | } | ||
+ | |||
+ | div.vectorTabs ul { | ||
+ | background-image: none; | ||
+ | margin-left: 0; | ||
+ | } | ||
+ | |||
+ | div.vectorTabs span { | ||
+ | background-image: none; | ||
+ | } | ||
+ | |||
+ | div.vectorTabs ul li, | ||
+ | #p-cactions { | ||
+ | text-transform: uppercase; | ||
+ | background: #fff; | ||
+ | height: 1.9em; | ||
+ | line-height: 1px; | ||
+ | margin-right: 0.5em; | ||
+ | margin-top: 0; | ||
+ | box-shadow: 4px 4px 0px #999; | ||
+ | min-width: 30px; | ||
+ | overflow: visible; | ||
+ | padding: 0; | ||
+ | -webkit-transition: all 0.3s; | ||
+ | -moz-transition: all 0.3s; | ||
+ | -ms-transition: all 0.3s; | ||
+ | -o-transition: all 0.3s; | ||
+ | } | ||
+ | |||
+ | div.vectorTabs ul li:hover, | ||
+ | #p-cactions:hover { | ||
+ | box-shadow: 4px 4px 0px #ff8319; | ||
+ | } | ||
+ | |||
+ | #p-search { | ||
+ | margin-left: 0.25em; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch { | ||
+ | background: #fff; | ||
+ | border: none; | ||
+ | box-shadow: 4px 4px 0px #999; | ||
+ | height: 1.9em; | ||
+ | margin-top: -0.4em; | ||
+ | -webkit-transition: all 0.3s; | ||
+ | -moz-transition: all 0.3s; | ||
+ | -ms-transition: all 0.3s; | ||
+ | -o-transition: all 0.3s; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch:hover { | ||
+ | box-shadow: 4px 4px 0px #ff8319; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch #searchInput { | ||
+ | padding: 0.6em 0 0.6em 0.5em; | ||
+ | font-family: Podkova, "Courier New", Courier, monospace; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch #searchInput:focus { | ||
+ | text-transform: none; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch #searchButton { | ||
+ | margin-right: 0.5em; | ||
+ | } | ||
+ | |||
+ | #right-navigation { | ||
+ | margin-right: 4em; | ||
+ | overflow: visible; | ||
+ | display: inline; | ||
+ | } | ||
+ | |||
+ | #mw-page-base { | ||
+ | background: transparent; | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | /* More button */ | ||
+ | |||
+ | #mw-head .vectorMenu h3 { | ||
+ | background: none; | ||
+ | } | ||
+ | |||
+ | .vectorMenu .menu { | ||
+ | border: none; | ||
+ | box-shadow: none; | ||
+ | margin-top: -10px; | ||
+ | margin-left: 1px; | ||
+ | padding-top: 5px; | ||
+ | width: 50px; | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | .vectorMenu .menu { | ||
+ | border: 1px solid #999; | ||
+ | box-shadow: none; | ||
+ | left: 0px; | ||
+ | margin: -1px 0 0 0; | ||
+ | } | ||
+ | */ | ||
+ | |||
+ | .vectorMenu li > a { | ||
+ | text-transform: uppercase; | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .vectorMenu li > a:hover { | ||
+ | text-decoration: none; | ||
+ | color: #ff8319; | ||
+ | } | ||
+ | |||
+ | .vectorMenu .menu li:not(:first-child) { | ||
+ | background: #fff; | ||
+ | padding-right: 10px; | ||
+ | width: min-content; | ||
+ | } | ||
+ | |||
+ | .vectorMenu h3 span, | ||
+ | .vectorMenu h3:hover span, | ||
+ | .vectorMenu h3:focus span, | ||
+ | #p-cactions-label span { | ||
+ | color: #ff8319; | ||
+ | } | ||
+ | |||
+ | .vectorMenu h3 span:after { | ||
+ | background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"> <path fill="%23ff8319" transform="rotate(180 5,5)" d="m0.0,9.5l5,-8.828127l5,8.825l-10,0z"/> </svg>'); | ||
+ | opacity: 1; | ||
+ | height: 8px; | ||
+ | top: 1em; | ||
+ | } | ||
+ | |||
+ | /* Echo extension (aptly named...) */ | ||
+ | |||
+ | #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: 1; | ||
+ | } | ||
+ | |||
+ | #pt-notifications-alert .mw-echo-notifications-badge:after, | ||
+ | #pt-notifications-notice .mw-echo-notifications-badge:after, | ||
+ | #pt-notifications-notice .mw-echo-notifications-badge.oo-ui-flaggedElement-unseen:after, | ||
+ | #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-unseen-notifications:after { | ||
+ | background-color: #fff; | ||
+ | color: #ff8319; | ||
+ | } | ||
+ | |||
+ | #pt-notifications-alert .mw-echo-notifications-badge:focus, | ||
+ | #pt-notifications-notice .mw-echo-notifications-badge:focus { | ||
+ | -webkit-box-shadow: inherit; | ||
+ | box-shadow: inherit; | ||
+ | } | ||
+ | |||
+ | .oo-ui-icon-bell, | ||
+ | .mw-ui-icon-bell:before { | ||
+ | background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"> <title> bell </title> <path fill="%23ff8319" d="M16 7a5.38 5.38 0 0 0-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 0 0 4 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 0 0 3-3H7a3 3 0 0 0 3 3z"/> </svg>'); | ||
+ | transform: scale(0.75); | ||
+ | } | ||
+ | |||
+ | .oo-ui-icon-tray, | ||
+ | .mw-ui-icon-tray:before { | ||
+ | background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"> <title> tray </title> <path fill="%23ff8319" d="M3 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z"/> </svg>'); | ||
+ | transform: scale(0.75); | ||
+ | } | ||
+ | |||
+ | #p-personal #pt-notifications-alert, | ||
+ | #p-personal #pt-notifications-notice { | ||
+ | margin-right: 0em; | ||
+ | margin-left: 0.25em; | ||
+ | } | ||
+ | |||
+ | #pt-userpage { | ||
+ | margin-right: 0.25em; | ||
+ | } | ||
+ | |||
+ | /* Search box */ | ||
+ | |||
+ | #searchInput:focus, | ||
+ | #simpleSearch:hover #searchInput:focus { | ||
+ | outline: 0; | ||
+ | border-color: #ff8319; | ||
+ | -webkit-box-shadow: inset 0 0 0 1px #ff8319, inset 0 0 0 2px #ffffff; | ||
+ | box-shadow: inset 0 0 0 1px #ff8319, inset 0 0 0 2px #ffffff; | ||
+ | } | ||
+ | |||
+ | #p-search form { | ||
+ | margin: 0.4em 0 0; | ||
+ | } | ||
+ | |||
+ | div#simpleSearch #searchInput { | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /***********/ | ||
+ | /* Sidebar */ | ||
+ | /***********/ | ||
+ | |||
+ | #p-logo { | ||
+ | margin-top: -12em; | ||
+ | box-shadow: 4px 4px 0px #ff8319; | ||
+ | border: 4px solid #fff; | ||
+ | height: 152px; | ||
+ | width: 152px; | ||
+ | } | ||
+ | |||
+ | #p-logo a { | ||
+ | height: 152px; | ||
+ | width: 152px; | ||
+ | } | ||
+ | |||
+ | #mw-panel { | ||
+ | background-color: white; | ||
+ | max-width: 9em; | ||
+ | width: 9em; | ||
+ | margin-top: 12em; | ||
+ | margin-left: 0.8em; | ||
+ | padding: 1em 1em 1em 0em; | ||
+ | box-shadow: 4px 4px 0px #ff8319; | ||
+ | } | ||
+ | |||
+ | #left-navigation, | ||
+ | div#footer, | ||
+ | .mw-body, | ||
+ | #mw-head-base { | ||
+ | margin-left: 12em; | ||
+ | } | ||
+ | /* also changed 11em -> 12em in skins/Vector/screen-hd.less */ | ||
+ | |||
+ | .mw-body { | ||
+ | border: none; | ||
+ | min-height: 53px; | ||
+ | margin-right: 5em; | ||
+ | box-shadow: 4px 4px 0px #ff8319; | ||
+ | } | ||
+ | |||
+ | .mw-wiki-logo { | ||
+ | background-size: 152px; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*********************/ | ||
+ | /* Custom tag styles */ | ||
+ | /*********************/ | ||
+ | |||
+ | .poem { | ||
+ | width: 95%; | ||
+ | border: 2px solid #d6d2c5; | ||
+ | background-color: #f9f4e6; | ||
+ | padding: 1em; | ||
+ | font-family: monospace; | ||
+ | font-size: 1.15em; | ||
+ | } | ||
+ | |||
+ | .inconsolata { | ||
+ | font-family: 'Inconsolata', monospace; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*****************/ | ||
+ | /* TOC limit tag */ | ||
+ | /*****************/ | ||
+ | |||
+ | /* Allow limiting of which header levels are shown in a TOC; | ||
+ | <div class="toclimit-3">, for instance, will limit to | ||
+ | showing ==headings== and ===headings=== but no further | ||
+ | (as long as there are no =headings= on the page, which | ||
+ | there shouldn't be according to the MoS). | ||
+ | */ | ||
+ | .toclimit-2 .toclevel-1 ul, | ||
+ | .toclimit-3 .toclevel-2 ul, | ||
+ | .toclimit-4 .toclevel-3 ul, | ||
+ | .toclimit-5 .toclevel-4 ul, | ||
+ | .toclimit-6 .toclevel-5 ul, | ||
+ | .toclimit-7 .toclevel-6 ul { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /************************/ | ||
+ | /* Template:Feature box */ | ||
+ | /************************/ | ||
+ | |||
+ | .featurebox { | ||
+ | -webkit-transition: all 0.3s; | ||
+ | -moz-transition: all 0.3s; | ||
+ | -ms-transition: all 0.3s; | ||
+ | -o-transition: all 0.3s; | ||
+ | transition: all 0.3s; | ||
+ | } | ||
+ | .featurebox:hover { | ||
+ | box-shadow: 4px 4px 0px #ff8319 ! important; | ||
+ | } | ||
+ | .featurebox-link a { | ||
+ | color: #fff !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | /********************/ | ||
+ | /* Template:Highway */ | ||
+ | /********************/ | ||
+ | .highway-box-top { | ||
+ | background: #000 url("/~donald/zero/images/8/8f/0_notebook_top.png") no-repeat left top; | ||
+ | border-top-right-radius: 10px; | ||
+ | width: 350px; | ||
+ | height: 9px; | ||
+ | padding-left: 24px; | ||
+ | margin-left: 10px; | ||
+ | float: right; /* make sure to clear: both; after all of these */ | ||
+ | } | ||
+ | .highway-box-bottom { | ||
+ | background: #000 url("/~donald/zero/images/f/ff/0_notebook_bottom.png") no-repeat left bottom; | ||
+ | border-bottom-right-radius: 10px; | ||
+ | width: 350px; | ||
+ | height: 20px; | ||
+ | padding-left: 24px; | ||
+ | margin-left: 10px; | ||
+ | margin-bottom: 14px; | ||
+ | float: right; | ||
+ | } | ||
+ | .highway-box-main { | ||
+ | background: #000 url("/~donald/zero/images/9/94/0_notebook_spine.png") repeat-y left top; | ||
+ | color: #fff; | ||
+ | border-radius: 0; | ||
+ | width: 350px; | ||
+ | padding-left: 24px; | ||
+ | margin-left: 10px; | ||
+ | float: right; | ||
+ | } | ||
+ | .highway-title { | ||
+ | font-family: 'Inconsolata', monospace; | ||
+ | text-align: center; | ||
+ | text-transform: uppercase; | ||
+ | font-size: 24pt; | ||
+ | position: relative; | ||
+ | z-index: 1; | ||
+ | } | ||
+ | .highway-image { | ||
+ | text-align: center; | ||
+ | margin-top: -30px; | ||
+ | } | ||
+ | .highway-line1 { | ||
+ | border: none; | ||
+ | border-bottom: 1px solid #fff; | ||
+ | color: transparent; | ||
+ | background-color: transparent; | ||
+ | margin: 17px auto 12px; | ||
+ | width: 75%; | ||
+ | } | ||
+ | .highway-line2 { | ||
+ | border: none; | ||
+ | border-bottom: 1px dashed #fff; | ||
+ | color: transparent; | ||
+ | background-color: transparent; | ||
+ | margin: 16px auto 12px; | ||
+ | width: 75%; | ||
+ | } | ||
+ | .highway-routeno { | ||
+ | text-align: center; | ||
+ | font-size: 14pt; | ||
+ | text-transform: uppercase; | ||
+ | margin-bottom: 8px; | ||
+ | color: #fff; | ||
+ | -webkit-transition: none; | ||
+ | -moz-transition: none; | ||
+ | -ms-transition: none; | ||
+ | -o-transition: none; | ||
+ | transition: none; | ||
+ | } | ||
+ | .highway-routebox { | ||
+ | text-align: center; | ||
+ | font-size: 12pt; | ||
+ | width: 100%; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | .highway-neighbors { | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | text-transform: uppercase; | ||
+ | width: 75px; | ||
+ | white-space: pre-line; | ||
+ | line-height: 1.1em; | ||
+ | color: #fff; | ||
+ | -webkit-transition: none; | ||
+ | -moz-transition: none; | ||
+ | -ms-transition: none; | ||
+ | -o-transition: none; | ||
+ | transition: none; | ||
+ | } | ||
+ | .highway-arrow { | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | margin: 0 15px; | ||
+ | } | ||
+ | .highway-truck { | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .highway-routeno a:hover, | ||
+ | .highway-neighbors a:hover { | ||
+ | text-decoration: underline; | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*****************/ | ||
+ | /* Template:Acts */ | ||
+ | /*****************/ | ||
+ | .white, | ||
+ | .white a, | ||
+ | .white a:link, | ||
+ | .white a:hover, | ||
+ | .white a:visited { | ||
+ | color: #fff; | ||
+ | } | ||
+ | .white a.mw-selflink.selflink { | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | .white a:hover { | ||
+ | text-decoration: underline overline; | ||
+ | } | ||
+ | .white a.mw-selflink.selflink:hover { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /***********/ | ||
+ | /* Cleanup */ | ||
+ | /***********/ | ||
+ | |||
+ | div.tleft{ | ||
+ | margin: 0.5em 1.4em 0.6em 0; | ||
+ | } | ||
+ | |||
+ | div.tright{ | ||
+ | margin: 0.5em 0 0.6em 1.4em; | ||
+ | } | ||
+ | |||
+ | body.page-Main_Page #ca-delete, | ||
+ | body.page-Main_Page #ca-move, | ||
+ | body.page-Main_Page #deleteconfirm, | ||
+ | body.page-Main_Page #siteSub, | ||
+ | body.page-Main_Page #contentSub | ||
+ | /* body.page-Main_Page h1.firstHeading */ { | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | .noscript { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .nowrap, | ||
+ | .nowraplinks a, | ||
+ | .nowraplinks .selflink { | ||
+ | white-space: nowrap; | ||
} | } |
Latest revision as of 12:06, 28 January 2020
/* CSS placed here will be applied to all skins */ /********/ /* Font */ /********/ @import url('https://fonts.googleapis.com/css?family=Podkova:400,700&subset=latin-ext'); @import url('https://fonts.googleapis.com/css?family=Inconsolata:400,700'); /**************/ /* Restyling */ /**************/ body { background-color: #242d3c; font-family: Podkova, "Courier New", Courier, monospace; } .mw-body, .parsoid-body { background: #fff; } .mw-body #siteSub { display: block; } /* Links */ a:link, a:active, div#mw-panel div.portal div.body ul li a, div.vectorTabs li.selected a, div.vectorTabs li.selected a, div.vectorTabs li a { text-decoration: none; color: #ff8319; } a:visited, div#mw-panel div.portal div.body ul li a:visited, div.vectorTabs li.selected a:visited, div.vectorTabs li.selected a:visited { text-decoration: none; color: #e77a1c; } a:hover { text-decoration: underline; } a.new, #p-personal a.new, div.vectorTabs li.new a, div.vectorTabs li.new a:visited, div.vectorTabs li.new a, div.vectorTabs li.new { text-decoration: none; color: #ba0000; } /**********/ /* Cursor */ /**********/ *, .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button, .oo-ui-buttonGroupWidget .oo-ui-buttonWidget.oo-ui-buttonElement-active .oo-ui-buttonElement-button, .oo-ui-popupWidget-head > .oo-ui-labelElement-label, .oo-ui-menuSectionOptionWidget.oo-ui-widget-enabled, .oo-ui-dropdownWidget-handle, .oo-ui-multioptionWidget.oo-ui-widget-disabled, div#mw-panel div.portal h3 { cursor: url(/~donald/zero/resources/assets/cursor.png) 7 0, auto; } a, a img, div.vectorTabs ul li, div.vectorTabs li a, div.vectorMenu, div.vectorMenu ul li, div.vectorMenu li a, .oo-ui-buttonElement > .oo-ui-buttonElement-button, .oo-ui-optionWidget.oo-ui-widget-enabled, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'], .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'] + span, .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select, .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'], .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'] + span, .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator, .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle, .oo-ui-multioptionWidget.oo-ui-widget-enabled, div#simpleSearch #searchButton,div#simpleSearch #mw-searchButton { cursor: url(/~donald/zero/resources/assets/cursorlink.png) 5 0, pointer; } textarea, div#simpleSearch input, .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon,.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { cursor: text; } /*********************************/ /* Zero word effect by User:Nclm */ /*********************************/ @supports (background-clip: text) or (-webkit-background-clip: text) { @keyframes zero { from { background-position: -800px -83px; } to { background-position: 0% 0%; } } .zero { background-image: url(/~donald/zero/images/3/36/Zero_Fog.png); animation-name: zero; animation-duration: 20s; animation-timing-function: linear; animation-iteration-count: infinite; -webkit-background-clip: text; background-clip: text; color: rgba(0,0,0,0); } a .zero { background-image: url(/~donald/zero/images/e/e7/ZeroLink_Fog.png); } } @supports (background-clip: text) or (-webkit-background-clip: text) { @keyframes zerowhite { from { background-position: -800px -83px; } to { background-position: 0% 0%; } } .zerowhite { background-image: url(/~donald/zero/images/7/73/ZeroWhite_Fog.png); animation-name: zerowhite; animation-duration: 20s; animation-timing-function: linear; animation-iteration-count: infinite; -webkit-background-clip: text; background-clip: text; color: rgba(0,0,0,0); } a .zerowhite { background-image: url(/~donald/zero/images/e/e7/ZeroLink_Fog.png); } } /***********/ /* Footer */ /**********/ div#footer, #footer { background: #f0f3fc; margin-right: 5em; margin-bottom: 5em; box-shadow: 4px 4px 0px #999; margin-top: 1.5em; } div#footer #footer-icons li { margin-left: 0; } div#footer #footer-icons li a { margin-left: 0.5em; } /*************/ /* Infoboxes */ /*************/ .infobox { background: #eee; border: 1px solid #aaa; float: right; margin: 0 0 1em 1em; padding: 0.5em 1em 1em 1em; width: 300px; } .infobox-title { font-size: 1.5em; font-weight: bold; text-align: center; margin-bottom: 0.25em; } .infobox-image { text-align: center; margin-bottom: 0.25em; } .infobox th { text-align: right; vertical-align: top; width: 120px; } .infobox td { vertical-align: top; padding-left: 4px; } table.ambox { border: 1px solid #a2a9b1; border-left: 10px solid #ff8319; background: #fbfbfb } table.ambox-content { border-left: 10px solid #f28500; } .mbox-small-left { margin: 4px 1em 4px 0; box-sizing: border-box; overflow: hidden; width: 238px; border-collapse: collapse; font-size: 88%; line-height: 1.25em; } .ambox th.mbox-text, .ambox td.mbox-text { padding: 0.25em 0.5em; width: 100%; border: none; } /***********/ /* Tab bar */ /***********/ div.vectorTabs { background-image: none; padding-left: 0; } div.vectorTabs ul { background-image: none; margin-left: 0; } div.vectorTabs span { background-image: none; } div.vectorTabs ul li, #p-cactions { text-transform: uppercase; background: #fff; height: 1.9em; line-height: 1px; margin-right: 0.5em; margin-top: 0; box-shadow: 4px 4px 0px #999; min-width: 30px; overflow: visible; padding: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; } div.vectorTabs ul li:hover, #p-cactions:hover { box-shadow: 4px 4px 0px #ff8319; } #p-search { margin-left: 0.25em; } div#simpleSearch { background: #fff; border: none; box-shadow: 4px 4px 0px #999; height: 1.9em; margin-top: -0.4em; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; } div#simpleSearch:hover { box-shadow: 4px 4px 0px #ff8319; } div#simpleSearch #searchInput { padding: 0.6em 0 0.6em 0.5em; font-family: Podkova, "Courier New", Courier, monospace; text-transform: uppercase; } div#simpleSearch #searchInput:focus { text-transform: none; } div#simpleSearch #searchButton { margin-right: 0.5em; } #right-navigation { margin-right: 4em; overflow: visible; display: inline; } #mw-page-base { background: transparent; opacity: 0; } /* More button */ #mw-head .vectorMenu h3 { background: none; } .vectorMenu .menu { border: none; box-shadow: none; margin-top: -10px; margin-left: 1px; padding-top: 5px; width: 50px; } /* .vectorMenu .menu { border: 1px solid #999; box-shadow: none; left: 0px; margin: -1px 0 0 0; } */ .vectorMenu li > a { text-transform: uppercase; color: #000; } .vectorMenu li > a:hover { text-decoration: none; color: #ff8319; } .vectorMenu .menu li:not(:first-child) { background: #fff; padding-right: 10px; width: min-content; } .vectorMenu h3 span, .vectorMenu h3:hover span, .vectorMenu h3:focus span, #p-cactions-label span { color: #ff8319; } .vectorMenu h3 span:after { background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"> <path fill="%23ff8319" transform="rotate(180 5,5)" d="m0.0,9.5l5,-8.828127l5,8.825l-10,0z"/> </svg>'); opacity: 1; height: 8px; top: 1em; } /* Echo extension (aptly named...) */ #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: 1; } #pt-notifications-alert .mw-echo-notifications-badge:after, #pt-notifications-notice .mw-echo-notifications-badge:after, #pt-notifications-notice .mw-echo-notifications-badge.oo-ui-flaggedElement-unseen:after, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-unseen-notifications:after { background-color: #fff; color: #ff8319; } #pt-notifications-alert .mw-echo-notifications-badge:focus, #pt-notifications-notice .mw-echo-notifications-badge:focus { -webkit-box-shadow: inherit; box-shadow: inherit; } .oo-ui-icon-bell, .mw-ui-icon-bell:before { background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"> <title> bell </title> <path fill="%23ff8319" d="M16 7a5.38 5.38 0 0 0-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 0 0 4 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 0 0 3-3H7a3 3 0 0 0 3 3z"/> </svg>'); transform: scale(0.75); } .oo-ui-icon-tray, .mw-ui-icon-tray:before { background-image: linear-gradient(transparent, transparent), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"> <title> tray </title> <path fill="%23ff8319" d="M3 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z"/> </svg>'); transform: scale(0.75); } #p-personal #pt-notifications-alert, #p-personal #pt-notifications-notice { margin-right: 0em; margin-left: 0.25em; } #pt-userpage { margin-right: 0.25em; } /* Search box */ #searchInput:focus, #simpleSearch:hover #searchInput:focus { outline: 0; border-color: #ff8319; -webkit-box-shadow: inset 0 0 0 1px #ff8319, inset 0 0 0 2px #ffffff; box-shadow: inset 0 0 0 1px #ff8319, inset 0 0 0 2px #ffffff; } #p-search form { margin: 0.4em 0 0; } div#simpleSearch #searchInput { border: none; } /***********/ /* Sidebar */ /***********/ #p-logo { margin-top: -12em; box-shadow: 4px 4px 0px #ff8319; border: 4px solid #fff; height: 152px; width: 152px; } #p-logo a { height: 152px; width: 152px; } #mw-panel { background-color: white; max-width: 9em; width: 9em; margin-top: 12em; margin-left: 0.8em; padding: 1em 1em 1em 0em; box-shadow: 4px 4px 0px #ff8319; } #left-navigation, div#footer, .mw-body, #mw-head-base { margin-left: 12em; } /* also changed 11em -> 12em in skins/Vector/screen-hd.less */ .mw-body { border: none; min-height: 53px; margin-right: 5em; box-shadow: 4px 4px 0px #ff8319; } .mw-wiki-logo { background-size: 152px; } /*********************/ /* Custom tag styles */ /*********************/ .poem { width: 95%; border: 2px solid #d6d2c5; background-color: #f9f4e6; padding: 1em; font-family: monospace; font-size: 1.15em; } .inconsolata { font-family: 'Inconsolata', monospace; } /*****************/ /* TOC limit tag */ /*****************/ /* Allow limiting of which header levels are shown in a TOC; <div class="toclimit-3">, for instance, will limit to showing ==headings== and ===headings=== but no further (as long as there are no =headings= on the page, which there shouldn't be according to the MoS). */ .toclimit-2 .toclevel-1 ul, .toclimit-3 .toclevel-2 ul, .toclimit-4 .toclevel-3 ul, .toclimit-5 .toclevel-4 ul, .toclimit-6 .toclevel-5 ul, .toclimit-7 .toclevel-6 ul { display: none; } /************************/ /* Template:Feature box */ /************************/ .featurebox { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .featurebox:hover { box-shadow: 4px 4px 0px #ff8319 ! important; } .featurebox-link a { color: #fff !important; } /********************/ /* Template:Highway */ /********************/ .highway-box-top { background: #000 url("/~donald/zero/images/8/8f/0_notebook_top.png") no-repeat left top; border-top-right-radius: 10px; width: 350px; height: 9px; padding-left: 24px; margin-left: 10px; float: right; /* make sure to clear: both; after all of these */ } .highway-box-bottom { background: #000 url("/~donald/zero/images/f/ff/0_notebook_bottom.png") no-repeat left bottom; border-bottom-right-radius: 10px; width: 350px; height: 20px; padding-left: 24px; margin-left: 10px; margin-bottom: 14px; float: right; } .highway-box-main { background: #000 url("/~donald/zero/images/9/94/0_notebook_spine.png") repeat-y left top; color: #fff; border-radius: 0; width: 350px; padding-left: 24px; margin-left: 10px; float: right; } .highway-title { font-family: 'Inconsolata', monospace; text-align: center; text-transform: uppercase; font-size: 24pt; position: relative; z-index: 1; } .highway-image { text-align: center; margin-top: -30px; } .highway-line1 { border: none; border-bottom: 1px solid #fff; color: transparent; background-color: transparent; margin: 17px auto 12px; width: 75%; } .highway-line2 { border: none; border-bottom: 1px dashed #fff; color: transparent; background-color: transparent; margin: 16px auto 12px; width: 75%; } .highway-routeno { text-align: center; font-size: 14pt; text-transform: uppercase; margin-bottom: 8px; color: #fff; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .highway-routebox { text-align: center; font-size: 12pt; width: 100%; white-space: nowrap; } .highway-neighbors { display: inline-block; vertical-align: middle; text-transform: uppercase; width: 75px; white-space: pre-line; line-height: 1.1em; color: #fff; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .highway-arrow { display: inline-block; vertical-align: middle; margin: 0 15px; } .highway-truck { display: inline-block; vertical-align: middle; } .highway-routeno a:hover, .highway-neighbors a:hover { text-decoration: underline; color: #fff; } /*****************/ /* Template:Acts */ /*****************/ .white, .white a, .white a:link, .white a:hover, .white a:visited { color: #fff; } .white a.mw-selflink.selflink { text-transform: uppercase; } .white a:hover { text-decoration: underline overline; } .white a.mw-selflink.selflink:hover { text-decoration: none; } /***********/ /* Cleanup */ /***********/ div.tleft{ margin: 0.5em 1.4em 0.6em 0; } div.tright{ margin: 0.5em 0 0.6em 1.4em; } body.page-Main_Page #ca-delete, body.page-Main_Page #ca-move, body.page-Main_Page #deleteconfirm, body.page-Main_Page #siteSub, body.page-Main_Page #contentSub /* body.page-Main_Page h1.firstHeading */ { display: none !important; } .noscript { display: none; } .nowrap, .nowraplinks a, .nowraplinks .selflink { white-space: nowrap; }