MediaWiki:Vector.css
Jump to navigation
Jump to search
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 / Edge: 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.
/* CSS placed here will affect users of the Vector skin */
/* Vector specific overrides */
abbr[title] {
text-decoration: unset;
cursor: unset;
}
#firstHeading {
color: transparent;
transition: color 0.25s ease-in-out;
}
#firstHeading.loaded {
color: black;
}
.mw-body-content {
font-size: inherit;
}
#firstHeading, .mw-body h1, .mw-body-content h1, .mw-body-content h2 {
background-color: #eee;
background-image: -webkit-linear-gradient(to right, #ddd, #fff);
background-image: linear-gradient(to right, #ddd, #fff);
margin: 0;
border: 0;
padding: 0.2em 0.25em 0;
font-family: inherit;
text-transform: uppercase;
font-style: oblique;
}
.mw-body-content .summary-heading {
margin-top: 0;
margin-bottom: 0;
border: 0;
background-color: #ddd;
background-image: none;
}
#pt-notifications-alert .mw-echo-notifications-badge, #pt-notifications-notice .mw-echo-notifications-badge {
top: -1000005px;
}
#pt-notifications-alert .mw-echo-notifications-badge:before, #pt-notifications-notice .mw-echo-notifications-badge:before {
top: 1000000px;
}
#pt-notifications-alert .mw-echo-notifications-badge:after, #pt-notifications-notice .mw-echo-notifications-badge:after {
top: 1000009px;
}
/* Right advertisement flow */
.ns-0.action-view div#content,
.ns-1.action-view div#content,
.ns-0.action-submit div#content,
.ns-1.action-submit div#content {
border-right: 0 !important;
margin-right: 0 !important;
}
@media screen {
#firstHeading, .summary {
margin: 0 120px 0 0;
}
.ns-0.action-view div#bodyContent:before,
.ns-1.action-view div#bodyContent:before,
.ns-0.action-submit div#bodyContent:before,
.ns-1.action-submit div#bodyContent:before {
float: right;
width: 122px;
height: 455px;
content: "";
}
.ns-0.action-view .mw-body .firstHeading,
.ns-1.action-view .mw-body .firstHeading,
.ns-0.action-submit .mw-body .firstHeading,
.ns-1.action-submit .mw-body .firstHeading,
.ns-0.action-submit #wikiDiff,
.ns-1.action-submit #wikiDiff {
overflow: hidden;
}
}
/* Responsive elements, desktop width */
@media screen and (min-width: 721px) {
.ns-0.action-view div#bodyContent:before,
.ns-1.action-view div#bodyContent:before,
.ns-0.action-submit div#bodyContent:before,
.ns-1.action-submit div#bodyContent:before {
width: 120px;
}
.summary {
float: right;
margin: 0 0 1em 1em;
width: 360px;
}
.summary-data dt {
clear: both;
float: left;
width: 40%;
}
.summary-data dd {
clear: right;
float: right;
margin: 0;
width: 60%;
}
.summary-data dd + dt + dd {
border-top: 1px solid #ccc;
padding-top: 0.2em;
}
.blueside dd + dt + dd {
border-color: #cce;
}
.redside dd + dt + dd {
border-color: #ecc;
}
.goldside dd + dt + dd {
border-color: #eec;
}
.mw-body-content h2 {
min-width: 10em;
}
.arrow-list li {
display: inline;
}
.arrow-list li + li {
padding-left: 0;
}
.arrow-list li + li::before {
position: static;
padding: 0 0.25em;
}
.zigzag-list ol, ol.zigzag-list, .zigzag-list ul, ul.zigzag-list {
padding-left: 0;
width: auto;
line-height: inherit;
}
.zigzag-list li, .zigzag-list li:nth-child(even) {
top: -1px;
margin-left: 0;
}
.zigzag-list td {
vertical-align: top;
}
}
/* Responsive elements, desktop large width */
@media screen and (min-width: 1081px) {
.enlarge-icons {
line-height: 2.2;
}
.enlarge-icons .icon-container img {
height: 32px;
}
}