MediaWiki:Vector-darkmode.less/elements.less
< MediaWiki:Vector-darkmode.less
Jump to navigation
Jump to search
Revision as of 06:06, 27 June 2019 by Corey (talk | contribs) (Created page with "// <pre> →===================== html elements =====================: →--------------------- <body> ---------------------: // background image b...")
//
/* =====================
html elements
===================== */
/* ---------------------
<body>
--------------------- */
// background image
body {
background-color: @dark-body;
}
// remove background image on /api.php[?action=help]
.mw-special-ApiHelp {
backgroun-image: none;
background-color: @dark-page;
}
.mw-body {
color: @dark-text;
background-color: @dark-page;
}
/* ---------------------
headings
--------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
color: @dark-text;
border-color: @waikawa-grey;
}
/* ---------------------
and
--------------------- */
pre,
code {
background-color: @dark-wikitable-background;
border-color: @dark-wikitable-border;
}
// temporary until we do dark syntax highlighting
.mw-highlight pre {
background: inherit;
color: @river-bed;
}
/* ---------------------
--------------------- */
// only change is the fill to #8cabe6
ul {
list-style-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='UTF-8'?%3E %3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' width='5' height='13'%3E %3Ccircle cx='2.5' cy='9.5' r='2.5' fill='%238cabe6'/%3E %3C/svg%3E");
}
/* ---------------------
--------------------- */
hr {
border-color: @waikawa-grey;
}
/* ---------------------
<tabber>
--------------------- */
.tabber .tabbertab {
background-color: @dark-wikitable-background;
border-color: @dark-wikitable-border;
}
ul.tabbernav {
li.tabberactive a {
color: @dark-text;
background-color: @dark-wikitable-background;
border-color: @dark-wikitable-background;
&:hover,
&:visited {
color: @dark-text;
background-color: @dark-wikitable-background;
border-color: @dark-wikitable-background;
}
}
li a {
background: @cloud-burst;
color: @dark-text;
border-color: @dark-wikitable-border;
&:hover {
background-color: lighten( @cloud-burst, 3% );
border-color: @dark-wikitable-border;
}
&:link,
&:visited {
color: @dark-text;
}
}
}
/* ---------------------
some special page "headers"
--------------------- */
// input and selects
.mw-input {
input {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
padding: 2px 1px;
border-radius: 2px;
}
select {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
border-radius: 2px;
}
textarea {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
border-radius: 2px;
}
}
// buttons
input,
button {
&[type="submit"],
&[type="button"] {
background-color: @ooui-normal;
border: 1px solid @ooui-normal-border;
color: @ooui-text;
padding: 2px 7px;
border-radius: 2px;
cursor: pointer;
&:hover {
background-color: @ooui-normal--hover;
border: 1px solid @ooui-normal-border--hover;
color: @ooui-text;
}
}
}
// fieldsets
fieldset {
border-color: @waikawa-grey;
input {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
padding: 2px 1px;
border-radius: 2px;
}
select {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
border-radius: 2px;
}
}
// Exceptions - Same buttons and inputs, but fat
.createbox,
.forumsearchbox,
.searchbox {
input {
&.mw-ui-input,
&[type="submit"] {
padding: 0.546875em 1em;
box-shadow: none;
}
}
}
