You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
868 lines
12 KiB
Plaintext
868 lines
12 KiB
Plaintext
@import 'variables.less';
|
|
|
|
/* Page layout */
|
|
|
|
html,
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
body {
|
|
font-family: @fonts;
|
|
color: @text;
|
|
// Footer colour; results in a weird distracting dark scrollbar in firefox, but fuck firefox
|
|
// Setting it here avoids a jump to white after the footer, which is even more distracting
|
|
background: @base30;
|
|
font-size: @font-size;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
#mw-content {
|
|
.box;
|
|
background: @background;
|
|
padding: 1em @content-padding 3em;
|
|
}
|
|
|
|
#bodyContentOuter {
|
|
/* Set a z-index for the content to group it away from any nav stuff (extensions) - T200148 */
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
|
|
.mw-body {
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.mw-footer-container {
|
|
border-top: solid 1px @base20;
|
|
box-shadow: inset 0 7px 2px -4px rgba( 0, 0, 0, 0.1 );
|
|
color: @base100;
|
|
|
|
a {
|
|
color: darken( @blue-bright, 3% );
|
|
|
|
&:hover {
|
|
color: darken( @blue-bright, 6% );
|
|
}
|
|
|
|
&:visited {
|
|
color: darken( @blue-bright, 8% );
|
|
|
|
&:hover {
|
|
color: darken( @blue-bright, 12% );
|
|
}
|
|
}
|
|
}
|
|
|
|
ul {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
#p-logo {
|
|
text-align: center;
|
|
margin: auto;
|
|
}
|
|
|
|
#p-logo-text {
|
|
max-width: @column-left-size;
|
|
text-align: center;
|
|
line-height: 1;
|
|
|
|
a {
|
|
padding: 0.1em 1em 0.2em;
|
|
color: @text;
|
|
font-family: @fonts-secondary;
|
|
font-variant: small-caps;
|
|
font-size: 1.85em;
|
|
display: block;
|
|
|
|
/* 13+ character names */
|
|
&.long {
|
|
font-size: 1.5em;
|
|
padding: 0 0.75em 0 0;
|
|
line-height: 0.8;
|
|
}
|
|
|
|
/* images */
|
|
&.wordmark {
|
|
padding: 0 0.5em 0 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Search */
|
|
|
|
#simpleSearch {
|
|
box-shadow: inset 0 2px 4px 0 rgba( 0, 0, 0, 0.05 );
|
|
background: @background;
|
|
position: relative;
|
|
border: solid 1px @base70;
|
|
}
|
|
|
|
#searchInput {
|
|
border: 0;
|
|
margin: 0;
|
|
height: 2.1em;
|
|
padding: 0.4em 4.5em 0.2em 2em;
|
|
box-shadow: none;
|
|
background: transparent;
|
|
width: 100%;
|
|
min-height: 0;
|
|
font-family: inherit;
|
|
}
|
|
|
|
#searchButton,
|
|
#mw-searchButton {
|
|
position: absolute;
|
|
top: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
right: 1.5em;
|
|
width: 2.5em;
|
|
height: 2.5em;
|
|
.icon;
|
|
background-image: url( images/search-ltr.svg );
|
|
/* @noflip */
|
|
background-position: center 40%;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.suggestions {
|
|
background: @background;
|
|
box-shadow: 0 2px 2px 1px rgba( 0, 0, 0, 0.05 );
|
|
|
|
.suggestions-special {
|
|
background-color: @background;
|
|
border: 1px solid @base70;
|
|
border-bottom-width: @border;
|
|
padding: 0.75em 2em;
|
|
}
|
|
|
|
.suggestions-results {
|
|
background-color: @background;
|
|
border: 1px solid @base70;
|
|
border-bottom-width: @border;
|
|
}
|
|
|
|
.suggestions-result {
|
|
color: @text;
|
|
padding: 0.65em 2em 0.35em;
|
|
}
|
|
|
|
.suggestions-result-current {
|
|
background-color: @blue;
|
|
color: @background;
|
|
}
|
|
}
|
|
|
|
.dropdown-toggle {
|
|
.dropdown-header();
|
|
}
|
|
|
|
/* Footer */
|
|
|
|
.mw-footer {
|
|
padding-top: 0.5em;
|
|
padding-bottom: 1em;
|
|
|
|
ul,
|
|
li {
|
|
margin: 1em 0;
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.footer-icons {
|
|
float: right;
|
|
margin: 0 0 0 1em;
|
|
}
|
|
|
|
#footer-places li {
|
|
display: inline-block;
|
|
margin: 0 1em 0 0;
|
|
}
|
|
|
|
#lastmod,
|
|
#credits,
|
|
#copyright {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
/* Content */
|
|
|
|
#mw-content-container {
|
|
background: @base80;
|
|
border-bottom: solid 4px @green;
|
|
|
|
/* Background image (default cat) */
|
|
background-image: @backdrop-image;
|
|
background-repeat: no-repeat;
|
|
background-position: center 10em;
|
|
}
|
|
|
|
.tools-inline,
|
|
.tools-inline & {
|
|
div,
|
|
ul,
|
|
li {
|
|
list-style: none;
|
|
display: inline-block;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
.tools-inline li {
|
|
margin: 0.25em 0 1em;
|
|
border-bottom: solid 3px transparent;
|
|
|
|
&:hover {
|
|
border-bottom-color: @base70;
|
|
}
|
|
|
|
&.selected {
|
|
border-bottom-color: @blue;
|
|
|
|
a {
|
|
color: @text;
|
|
}
|
|
}
|
|
|
|
a {
|
|
.ca-icon( 'images/page-misc-grey' );
|
|
|
|
&:hover {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
#p-namespaces {
|
|
float: left;
|
|
|
|
li {
|
|
margin-right: 1em;
|
|
}
|
|
}
|
|
|
|
#p-views,
|
|
#p-more {
|
|
float: right;
|
|
|
|
li {
|
|
margin-left: 1em;
|
|
}
|
|
}
|
|
|
|
#ca-watch a {
|
|
.ca-icon( 'images/star' );
|
|
.ca-icon-only();
|
|
}
|
|
|
|
#ca-unwatch a {
|
|
.ca-icon( 'images/star-filled' );
|
|
.ca-icon-only();
|
|
}
|
|
|
|
#ca-unwatch.mw-watchlink-temp a {
|
|
.ca-icon( 'images/star-half-filled' );
|
|
.ca-icon-only();
|
|
}
|
|
|
|
#ca-edit a {
|
|
.ca-icon( 'images/pencil-grey' );
|
|
}
|
|
|
|
#ca-history a {
|
|
.ca-icon( 'images/clock-grey' );
|
|
}
|
|
|
|
#ca-talk a {
|
|
.ca-icon( 'images/talk-grey' );
|
|
}
|
|
|
|
#t-contributions a {
|
|
.ca-icon( 'images/puzzle-grey' );
|
|
}
|
|
|
|
#ca-addsection a {
|
|
.ca-icon( 'images/plus-grey' );
|
|
}
|
|
|
|
#ca-viewsource a {
|
|
.ca-icon( 'images/brackets-grey' );
|
|
}
|
|
|
|
#ca-view a,
|
|
#ca-view-foreign a {
|
|
.ca-icon( 'images/eyeball-grey' );
|
|
}
|
|
|
|
#ca-view {
|
|
.hidden();
|
|
}
|
|
|
|
.tools-inline li[ id^='ca-nstab-' ] a {
|
|
.ca-icon( 'images/page-grey' );
|
|
}
|
|
|
|
#siteNotice {
|
|
font-size: 95%;
|
|
margin: 0.5em auto 1.5em;
|
|
}
|
|
|
|
#localNotice {
|
|
.box();
|
|
padding: 0;
|
|
text-align: center;
|
|
|
|
p {
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
}
|
|
|
|
/* Misc */
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: @link;
|
|
|
|
&:hover {
|
|
color: darken( @link, 10% );
|
|
text-decoration: underline;
|
|
}
|
|
|
|
&:visited {
|
|
color: @link-visited;
|
|
|
|
&:hover {
|
|
color: darken( @link-visited, 10% );
|
|
}
|
|
}
|
|
}
|
|
|
|
a.new,
|
|
.new a {
|
|
color: @link-red;
|
|
|
|
&:hover {
|
|
color: darken( @link-red, 10% );
|
|
}
|
|
|
|
&:visited {
|
|
color: @link-red-visited;
|
|
|
|
&:hover {
|
|
color: darken( @link-red-visited, 10% );
|
|
}
|
|
}
|
|
}
|
|
|
|
.mw-parser-output a.extiw,
|
|
.mw-parser-output a.extiw:active,
|
|
.mw-parser-output a.external {
|
|
color: @link-ext;
|
|
|
|
&:hover {
|
|
color: darken( @link-ext, 10% );
|
|
}
|
|
|
|
&:visited {
|
|
color: @link-ext-visited;
|
|
|
|
&:hover {
|
|
color: darken( @link-ext-visited, 10% );
|
|
}
|
|
}
|
|
}
|
|
|
|
a.mw-selflink {
|
|
color: inherit;
|
|
font-weight: bold;
|
|
text-decoration: inherit;
|
|
}
|
|
|
|
.mw-editsection {
|
|
font-family: @fonts;
|
|
background-image: url( images/pencil-grey.svg );
|
|
background-repeat: no-repeat;
|
|
background-position: left bottom;
|
|
padding-left: 20px;
|
|
padding-top: 0.5em;
|
|
|
|
a {
|
|
display: inline-block;
|
|
padding: 0.5em 0 0.25em;
|
|
margin-right: 1em;
|
|
|
|
&:first-of-type {
|
|
/* make the icon part of the first link */
|
|
padding-left: 20px;
|
|
margin-left: -20px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.mw-editsection-bracket {
|
|
display: none;
|
|
}
|
|
|
|
.mw-indicators {
|
|
float: right;
|
|
margin-left: 1em;
|
|
|
|
img {
|
|
/* Line up to baseline; expected indicator icon size is 20px */
|
|
margin-top: -0.5em;
|
|
}
|
|
}
|
|
|
|
.mw-indicator {
|
|
display: inline-block;
|
|
margin: 0.65em 0 0 0.25em;
|
|
}
|
|
|
|
div.magnify a {
|
|
display: block;
|
|
text-indent: 20px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 0 0 0.5em 0.5em;
|
|
background-image: url( images/magnify-ltr.svg );
|
|
}
|
|
|
|
/* Subtitle area
|
|
* @see https://phabricator.wikimedia.org/T173951
|
|
*/
|
|
#contentSub {
|
|
font-size: 84%;
|
|
color: @base20;
|
|
|
|
/* This forces "redirect page" (on a redirect page) etc. on a new line */
|
|
.subpages {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
/* pre and code styles copypasted from core
|
|
* /resources/src/mediawiki.skinning/elements.css and modified a bit
|
|
* @see https://phabricator.wikimedia.org/T177142
|
|
*/
|
|
|
|
.screenplay,
|
|
code,
|
|
tt,
|
|
kbd,
|
|
pre,
|
|
samp,
|
|
.skin-timeless .monospace {
|
|
font-family: @fonts-mono;
|
|
}
|
|
|
|
.skin-timeless .serif {
|
|
font-family: @fonts-serif;
|
|
}
|
|
|
|
.skin-timeless .sans-serif {
|
|
font-family: @fonts-sans;
|
|
}
|
|
|
|
code,
|
|
pre,
|
|
.mw-code {
|
|
color: #000;
|
|
background-color: @base90;
|
|
border: 1px solid @base70;
|
|
}
|
|
|
|
code {
|
|
padding: 1px 4px;
|
|
}
|
|
|
|
pre,
|
|
.mw-code {
|
|
padding: 1em;
|
|
/* Wrap lines in overflow. T2260, T103780 */
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.mw-body {
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6,
|
|
dt {
|
|
font-weight: normal;
|
|
font-family: @fonts-secondary;
|
|
line-height: 1.125;
|
|
margin: 1.25em 0 0.5em;
|
|
}
|
|
|
|
dt {
|
|
font-weight: bold;
|
|
font-family: @fonts-secondary;
|
|
line-height: 1.125;
|
|
margin: 1.5em 0 0.5em;
|
|
margin-bottom: 0.1em;
|
|
}
|
|
|
|
dl {
|
|
margin-top: 0.2em;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
form dt {
|
|
margin: 0 0.5em 0 0;
|
|
}
|
|
|
|
h1.firstHeading {
|
|
margin: 0.25em 0 0.5em;
|
|
border-bottom: solid 4px @blue;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2em;
|
|
border-bottom: solid 3px @base70;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.8em;
|
|
border-bottom: solid 2px @base70;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 1.6em;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 1.4em;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 1.25em;
|
|
}
|
|
|
|
h6 {
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
dt {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
dd {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.mw-changeslist-legend dt {
|
|
margin: 0 0.5em 0 0;
|
|
}
|
|
|
|
.mw-changeslist-legend dd {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* overflow:hidden on the header itself breaks tall scripts, but we need to hide
|
|
* overflow on the border itself in output for proper thumb handling. Too weird to
|
|
* change this everywhere, so we'll just do it for parser output for now.
|
|
*/
|
|
.mw-parser-output {
|
|
h1,
|
|
h2 {
|
|
border-bottom: 0;
|
|
|
|
&:after {
|
|
content: '';
|
|
display: block;
|
|
border-bottom: solid 2px @base70;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
h1:after {
|
|
border-bottom-width: 3px;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Keep images from overflowing
|
|
.mw-body-content a > img,
|
|
.mw-body-content .floatnone > img {
|
|
height: auto !important;
|
|
max-width: 100% !important;
|
|
}
|
|
|
|
a > img,
|
|
.floatnone > img {
|
|
// Hopefully these are only templates or something sane to begin with
|
|
// See: T269970
|
|
.mw-body-content table & {
|
|
height: unset !important;
|
|
max-width: unset !important;
|
|
}
|
|
}
|
|
|
|
#siteSub {
|
|
margin: -0.5em 0 0.5em 0;
|
|
font-style: italic;
|
|
font-family: @fonts-secondary;
|
|
display: none;
|
|
}
|
|
|
|
hr {
|
|
border-width: 1px;
|
|
border-color: @base70;
|
|
border-style: solid none solid none;
|
|
margin: 0.5em 0;
|
|
}
|
|
|
|
pre {
|
|
overflow: auto;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
p {
|
|
margin: 1em 0;
|
|
}
|
|
|
|
ul {
|
|
padding: 0;
|
|
margin: 0.3em 0 0 1.6em;
|
|
}
|
|
|
|
/* body */ .mw-hide-empty-elt .mw-parser-output:not( .mw-show-empty-elt ) .mw-empty-elt {
|
|
display: none;
|
|
}
|
|
|
|
.center {
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Thumbnails */
|
|
/* @noflip */
|
|
.floatright,
|
|
.tright {
|
|
margin: 0 0 0.5em 0.5em;
|
|
padding: 0 0 1em 1.5em;
|
|
}
|
|
|
|
/* @noflip */
|
|
.floatleft,
|
|
.tleft {
|
|
margin: 0 0.5em 0.5em 0;
|
|
padding: 0 1.5em 1em 0;
|
|
}
|
|
|
|
.thumbinner {
|
|
.box;
|
|
padding: 0.75em;
|
|
/* Properly center framed thumbnail images (T219717) */
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.thumbcaption {
|
|
font-size: 95%;
|
|
padding: 0.5em 0 0;
|
|
/* For the magnify link on empty captions */
|
|
min-height: 1em;
|
|
}
|
|
|
|
.thumbinner .thumbimage,
|
|
.thumbborder {
|
|
border: solid 1px @base80;
|
|
}
|
|
|
|
.mw-body li.gallerybox div.thumb {
|
|
.box;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Tables of contents */
|
|
ul#filetoc,
|
|
.toc,
|
|
.toccolours,
|
|
.mw-warning {
|
|
display: table;
|
|
.box;
|
|
padding: 1.25em 1.75em;
|
|
margin-top: 1em;
|
|
margin-bottom: 1em;
|
|
min-width: 15em;
|
|
font-size: 100%;
|
|
}
|
|
|
|
.toc {
|
|
line-height: 1.2;
|
|
|
|
ul {
|
|
margin: 1em 0 0;
|
|
list-style: none;
|
|
text-align: left;
|
|
}
|
|
|
|
li {
|
|
margin: 0.3em 0;
|
|
|
|
&:last-child {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
}
|
|
}
|
|
|
|
ul#filetoc {
|
|
display: block;
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.mw-body .toctitle {
|
|
border-bottom: solid 2px @base70;
|
|
text-align: unset;
|
|
|
|
h2 {
|
|
font-size: 1em;
|
|
font-family: @fonts;
|
|
margin: 0;
|
|
display: inline;
|
|
|
|
&:after {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.toctogglespan {
|
|
float: right;
|
|
}
|
|
|
|
/* Remove brackets around the show/hide button of the TOC
|
|
The selectors have a higher specifity than in core */
|
|
body :not( :checked ) > .toctogglespan:before,
|
|
body :not( :checked ) > .toctogglespan:after {
|
|
content: '';
|
|
}
|
|
|
|
.toctogglelabel {
|
|
padding-left: 0; /* Overwrite label { padding-left: 0.5em; } from forms.less */
|
|
margin-left: 0.5em; /* Create new distance to the TOC title without increasing the focus ring */
|
|
}
|
|
|
|
.toclevel-1 {
|
|
margin-bottom: 0.25em;
|
|
}
|
|
|
|
.tocnumber {
|
|
color: @base20;
|
|
}
|
|
|
|
.skin-timeless .mw-body .oo-ui-tagMultiselectWidget-handle,
|
|
.skin-timeless .mw-body .oo-ui-capsuleMultiselectWidget-handle {
|
|
margin: 0; /* wat */
|
|
}
|
|
|
|
.mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend, /* wat */
|
|
.mw-changeslist-legend,
|
|
.mw-body .mw-search-profile-tabs,
|
|
.mw-body fieldset#mw-searchoptions,
|
|
.mw_metadata,
|
|
.wikitable,
|
|
.mw-datatable {
|
|
color: @text;
|
|
.box;
|
|
}
|
|
|
|
.mw-body .mw-search-profile-tabs {
|
|
padding: 0.5em;
|
|
}
|
|
|
|
.mw_metadata,
|
|
.mw-datatable,
|
|
.wikitable {
|
|
border-color: @base70;
|
|
|
|
> tr > th,
|
|
> tr > td,
|
|
> * > tr > th,
|
|
> * > tr > td {
|
|
border: 1px solid @base70;
|
|
padding: 0.4em 0.5em;
|
|
}
|
|
}
|
|
|
|
.mw-datatable th {
|
|
background: @blue-bright;
|
|
}
|
|
|
|
.mw_metadata th,
|
|
.wikitable th {
|
|
background: @base80;
|
|
}
|
|
|
|
.mw_metadata {
|
|
border-bottom-width: 3px;
|
|
}
|
|
|
|
/* Color bars */
|
|
|
|
.color-bar {
|
|
width: 100%;
|
|
}
|
|
|
|
.color-left {
|
|
height: @color-height;
|
|
background: @red-dark;
|
|
width: 50%;
|
|
float: left;
|
|
}
|
|
|
|
.color-right {
|
|
display: inline-block;
|
|
height: @color-height;
|
|
background: @green-dark;
|
|
width: 50%;
|
|
float: right;
|
|
}
|
|
|
|
.color-middle-container {
|
|
max-width: @content-width;
|
|
margin: 0 auto -@color-height;
|
|
position: relative;
|
|
}
|
|
|
|
.color-middle {
|
|
height: @color-height;
|
|
background: @blue-dark;
|
|
margin-left: @column-left-size + 1em;
|
|
margin-right: @column-right-size + 1em;
|
|
}
|
|
|
|
/* Portlets */
|
|
.emptyPortlet,
|
|
#mw-page-header-links .emptyPortlet {
|
|
display: none;
|
|
}
|
|
|
|
#p-lang.emptyPortlet {
|
|
display: inherit;
|
|
}
|
|
|
|
/* Hidden stuff */
|
|
|
|
#p-namespaces h3,
|
|
#p-views h3,
|
|
#p-more h3,
|
|
#p-search h3 {
|
|
.hidden;
|
|
}
|