MediaWiki:Vector.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
(Completely revamped the theme for Pikipedia's 10th anniversary.) |
||
Line 1: | Line 1: | ||
/* CSS placed here will affect users of the Vector skin */ | /* CSS placed here will affect users of the default Vector theme. */ | ||
/* | |||
* Background. | |||
*/ | |||
body { | |||
/* Background of everything. */ | |||
background: url(https://www.pikminwiki.com/images/3/37/Vector_background.jpg) center top; | |||
} | |||
/* | |||
* Header. | |||
*/ | |||
#mw-page-base { | |||
/* Full-white header-like background that the Vector skin has. */ | |||
background: initial; | |||
} | |||
div.vectorTabs { | |||
/* Tabs div. */ | |||
background: initial; | |||
margin-left: 10px; | |||
height: 37px; | |||
} | |||
div.vectorTabs ul { | |||
/* Tabs ul. */ | |||
background: initial; | |||
} | |||
div.vectorTabs ul > li { | |||
/* Tabs. */ | |||
background: initial; | |||
border: 2px solid #66b283; | |||
border-radius: 10px 10px 0px 0px; | |||
background-color: #cec; | |||
margin-right: 10px; | |||
line-height: 0.5em; | |||
} | |||
div.vectorTabs li.selected { | |||
/* Current tab. */ | |||
background: initial; | |||
background-color: #fffc; | |||
border-bottom-color: #fffc; | |||
} | |||
div#mw-head div.vectorMenu h3 { | |||
/* Separator line between the "More" button and the search bar. */ | |||
background: initial; | |||
} | |||
#ca-watch { | |||
/* Watch article button. */ | |||
line-height: 2em; | |||
} | |||
div.vectorTabs span { | |||
/* Separator line between every tab. */ | |||
background: initial; | |||
} | |||
#simpleSearch { | |||
/* Search bar. */ | |||
border-radius: 6px; | |||
} | |||
#simpleSearch input#searchInput { | #simpleSearch input#searchInput { | ||
/* Search bar. */ | |||
width: 14em; | |||
} | |||
/* | |||
* Sidebar. | |||
*/ | |||
#mw-panel .portal h3 { | |||
/* Section headers. */ | |||
color: #000; | |||
} | |||
#mw-panel #p-logo + .portal h3 { | |||
/* Section header for "Navigation", which is otherwise invisible. */ | |||
display: initial; | |||
} | |||
#mw-panel .portal { | |||
/* Sections. */ | |||
margin-top: 4px; | |||
} | |||
#mw-panel #p-logo + .portal, | |||
#mw-panel .portal, | |||
#p-personal { | |||
/* Sidebar sections, as well as header personal info box. */ | |||
padding: 6px; | |||
padding-left: 10px; | |||
border: 2px solid #fff8; | |||
border-radius: 12px; | |||
box-shadow: inset 0 0 20px #fff8; | |||
-moz-box-shadow: inset 0 0 20px #fff8; | |||
-webkit-box-shadow: inset 0 0 20px #fff8; | |||
background-color: #fff4; | |||
} | |||
#mw-panel .portal .body ul { | |||
/* Lists. */ | |||
list-style-image: url(https://www.pikminwiki.com/images/a/a5/Vector_bullet.png); | |||
} | |||
#p-personal { | |||
/* Personal info box. */ | |||
padding-top: 0px; | |||
padding-bottom: 0px; | |||
} | |||
/* | |||
* Footer. | |||
*/ | |||
#footer { | |||
/* Footer. */ | |||
background: url(https://www.pikminwiki.com/images/8/83/Vector_banner.png) no-repeat center bottom; | |||
margin-right: 11em; | |||
} | |||
/* | |||
* Main text. | |||
*/ | |||
#content { | |||
/* Article body. */ | |||
background: #fffc; | |||
margin-right: 11em; | |||
border-right-width: initial; | |||
border: 2px solid #66b283; | |||
border-radius: 14px; | |||
} | |||
.mw-body-content { | |||
/* Article body. */ | |||
font-size: 11pt; | |||
} | |||
ul { | |||
/* Lists. */ | |||
list-style-image: url(https://www.pikminwiki.com/images/a/a5/Vector_bullet.png); | |||
} | |||
table.wikitable > tr > th, | |||
table.wikitable > * > tr > th { | |||
/* Table headers. */ | |||
background-color: #d8f0db; | |||
} | |||
.pikipediaBox { | |||
/* Pikipedia notification boxes. */ | |||
background-color: #d8f0db; | |||
border: 1px solid #0b0; | |||
border-radius: 8px; | |||
} | } | ||
.mw-indicators { | .mw-indicators { | ||
/* Game icons. */ | |||
top: 7px; | |||
} | } | ||
#siteNotice .pikipediaBox { | #siteNotice .pikipediaBox { | ||
/* Site notice. */ | |||
margin: 0 auto 5px !important; | |||
} | |||
/* | |||
* Links. | |||
*/ | |||
a, | |||
#p-cactions li a, | |||
.mw-parser-output a.extiw, | |||
.mw-parser-output a.external, | |||
div.vectorTabs li a, | |||
#mw-panel .portal .body li a { | |||
/* Standard links. */ | |||
color: #080; | |||
} | |||
a:visited, | |||
.mw-parser-output a.extiw:visited, | |||
.mw-parser-output a.external:visited, | |||
#mw-panel .portal .body li a:visited { | |||
/* Visited links. */ | |||
color: #084; | |||
} | |||
a:hover, | |||
.mw-parser-output a.extiw:hover, | |||
.mw-parser-output a.external:hover { | |||
/* Hovering over external links. */ | |||
color: #0b0; | |||
} | |||
a:visited:hover, | |||
.mw-parser-output a.extiw:visited:hover, | |||
.mw-parser-output a.external:visited:hover { | |||
/* Hovering over external links. */ | |||
color: #0b4; | |||
} | |||
a.new:link, | |||
a.new:visited, | |||
#p-cactions .new a, | |||
#p-cactions .new a:visited { | |||
/* Non-existent pages. */ | |||
color: #bb0; | |||
} | |||
/* | |||
* Infoboxes. | |||
*/ | |||
.infobox { | |||
/* Infoboxes. */ | |||
border-radius: 8px; | |||
} | |||
.infobox th { | |||
/* Headers. */ | |||
background-color: #d8f0db; | |||
border-radius: 6px; | |||
padding-left: 4px; | |||
} | |||
/* | |||
* Navboxes. | |||
*/ | |||
.navbox { | |||
/* Navboxes. */ | |||
border-radius: 8px; | |||
} | |||
.navbox th { | |||
/* Headers. */ | |||
border-radius: 6px; | |||
} | |||
table.navbox-light { | |||
/* Light-background navboxes. */ | |||
color: #000; | |||
} | |||
table.navbox-light a, | |||
table.navbox-light a.extiw, | |||
table.navbox-light a.external { | |||
/* Light-background navbox links. */ | |||
color: #262; | |||
} | |||
table.navbox-light a:visited, | |||
table.navbox-light a.extiw:visited, | |||
table.navbox-light a.external:visited { | |||
/* Light-background navbox links. */ | |||
color: #141; | |||
} | |||
table.navbox-light a:hover, | |||
table.navbox-light a.extiw:hover, | |||
table.navbox-light a.external:hover { | |||
/* Light-background navbox links. */ | |||
color: #363; | |||
} | |||
table.navbox-light a:visited:hover, | |||
table.navbox-light a.extiw:visited:hover, | |||
table.navbox-light a.external:visited:hover { | |||
/* Light-background navbox links. */ | |||
color: #242; | |||
} | |||
table.navbox-light a.new, | |||
table.navbox-light a.new:visited, | |||
table.navbox-light a.new:hover, | |||
table.navbox-light a.new:visited:hover { | |||
/* Light-background navbox links. */ | |||
color: #422; | |||
} | |||
table.navbox-dark { | |||
/* Dark-background navboxes. */ | |||
color: #fff; | |||
} | |||
table.navbox-dark a, | |||
table.navbox-dark a.extiw, | |||
table.navbox-dark a.external { | |||
/* Dark-background navbox links. */ | |||
color: #bfb; | |||
} | |||
table.navbox-dark a:visited, | |||
table.navbox-dark a.extiw:visited, | |||
table.navbox-dark a.external:visited { | |||
/* Dark-background navbox links. */ | |||
color: #cfc; | |||
} | |||
table.navbox-dark a:hover, | |||
table.navbox-dark a.extiw:hover, | |||
table.navbox-dark a.external:hover { | |||
/* Dark-background navbox links. */ | |||
color: #cfc; | |||
} | |||
table.navbox-dark a:visited:hover, | |||
table.navbox-dark a.extiw:visited:hover, | |||
table.navbox-dark a.external:visited:hover { | |||
/* Dark-background navbox links. */ | |||
color: #dfd; | |||
} | |||
table.navbox-dark a.new, | |||
table.navbox-dark a.new:visited, | |||
table.navbox-dark a.new:hover, | |||
table.navbox-dark a.new:visited:hover { | |||
/* Dark-background navbox links. */ | |||
color: #fdd; | |||
} | |||
/* | |||
* Categories. | |||
*/ | |||
#catlinks { | |||
/* Categories box. */ | |||
border-radius: 8px; | |||
} | |||
/* | |||
* Main page. | |||
*/ | |||
.titledBox { | |||
/* Section boxes. */ | |||
border-radius: 16px; | |||
margin-top: 32px; | |||
background: url(https://www.pikminwiki.com/images/0/09/Vector_grass.jpg) bottom center; | |||
} | |||
.titledBoxTitle { | |||
/* Section box titles. */ | |||
border-radius: 12px; | |||
} | |||
.main-page-left-col { | |||
/* Left column. */ | |||
padding-right: 16px; | |||
} | |||
.main-page-right-col { | |||
/* Right column. */ | |||
padding-left: 16px; | |||
} | |||
.main-page-nav-item { | |||
/* Main item in the navigation box. */ | |||
background-color: #d8f0db; | |||
border-radius: 20px; | |||
border: 2px solid #66b283; | |||
padding: 8px; | |||
} | |||
.pds-box { | |||
/* Poll. */ | |||
border-radius: 16px; | |||
} | |||
#mp-title-nav { | |||
/* Navigation box title. */ | |||
background-color: #b9d6ec; | |||
} | |||
#mp-title-fa { | |||
/* Featured article box title. */ | |||
background-color: #ecebbf; | |||
} | |||
#mp-title-community { | |||
/* Community box title. */ | |||
background-color: #dbd0f6; | |||
} | |||
#mp-title-news { | |||
/* News box title. */ | |||
background-color: #f0d2e2; | |||
} | |||
#mp-title-poll { | |||
/* Poll box title. */ | |||
background-color: #b9b9b9; | |||
} | |||
#mp-title-dyk { | |||
/* Did You Know box title. */ | |||
background-color: #f8f8f8; | |||
} | |||
#mp-title-niwa { | |||
/* NIWA box title. */ | |||
background-color: #e6b5b5; | |||
} | |||
/* | |||
* Edit page. | |||
*/ | |||
.mw-editform .editOptions { | |||
/* Edit options form. */ | |||
background-color: #d8f0db; | |||
border-bottom-left-radius: 12px; | |||
border-bottom-right-radius: 12px; | |||
} | |||
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { | |||
/* Apply changes button. */ | |||
background-color: #59cb6a; | |||
border-color: #33cc6b; | |||
} | |||
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { | |||
/* Apply changes button. */ | |||
background-color: #15c52f; | |||
border-color: #33cc6b; | |||
} | } |
Revision as of 18:11, September 14, 2020
/* CSS placed here will affect users of the default Vector theme. */
/*
* Background.
*/
body {
/* Background of everything. */
background: url(https://www.pikminwiki.com/images/3/37/Vector_background.jpg) center top;
}
/*
* Header.
*/
#mw-page-base {
/* Full-white header-like background that the Vector skin has. */
background: initial;
}
div.vectorTabs {
/* Tabs div. */
background: initial;
margin-left: 10px;
height: 37px;
}
div.vectorTabs ul {
/* Tabs ul. */
background: initial;
}
div.vectorTabs ul > li {
/* Tabs. */
background: initial;
border: 2px solid #66b283;
border-radius: 10px 10px 0px 0px;
background-color: #cec;
margin-right: 10px;
line-height: 0.5em;
}
div.vectorTabs li.selected {
/* Current tab. */
background: initial;
background-color: #fffc;
border-bottom-color: #fffc;
}
div#mw-head div.vectorMenu h3 {
/* Separator line between the "More" button and the search bar. */
background: initial;
}
#ca-watch {
/* Watch article button. */
line-height: 2em;
}
div.vectorTabs span {
/* Separator line between every tab. */
background: initial;
}
#simpleSearch {
/* Search bar. */
border-radius: 6px;
}
#simpleSearch input#searchInput {
/* Search bar. */
width: 14em;
}
/*
* Sidebar.
*/
#mw-panel .portal h3 {
/* Section headers. */
color: #000;
}
#mw-panel #p-logo + .portal h3 {
/* Section header for "Navigation", which is otherwise invisible. */
display: initial;
}
#mw-panel .portal {
/* Sections. */
margin-top: 4px;
}
#mw-panel #p-logo + .portal,
#mw-panel .portal,
#p-personal {
/* Sidebar sections, as well as header personal info box. */
padding: 6px;
padding-left: 10px;
border: 2px solid #fff8;
border-radius: 12px;
box-shadow: inset 0 0 20px #fff8;
-moz-box-shadow: inset 0 0 20px #fff8;
-webkit-box-shadow: inset 0 0 20px #fff8;
background-color: #fff4;
}
#mw-panel .portal .body ul {
/* Lists. */
list-style-image: url(https://www.pikminwiki.com/images/a/a5/Vector_bullet.png);
}
#p-personal {
/* Personal info box. */
padding-top: 0px;
padding-bottom: 0px;
}
/*
* Footer.
*/
#footer {
/* Footer. */
background: url(https://www.pikminwiki.com/images/8/83/Vector_banner.png) no-repeat center bottom;
margin-right: 11em;
}
/*
* Main text.
*/
#content {
/* Article body. */
background: #fffc;
margin-right: 11em;
border-right-width: initial;
border: 2px solid #66b283;
border-radius: 14px;
}
.mw-body-content {
/* Article body. */
font-size: 11pt;
}
ul {
/* Lists. */
list-style-image: url(https://www.pikminwiki.com/images/a/a5/Vector_bullet.png);
}
table.wikitable > tr > th,
table.wikitable > * > tr > th {
/* Table headers. */
background-color: #d8f0db;
}
.pikipediaBox {
/* Pikipedia notification boxes. */
background-color: #d8f0db;
border: 1px solid #0b0;
border-radius: 8px;
}
.mw-indicators {
/* Game icons. */
top: 7px;
}
#siteNotice .pikipediaBox {
/* Site notice. */
margin: 0 auto 5px !important;
}
/*
* Links.
*/
a,
#p-cactions li a,
.mw-parser-output a.extiw,
.mw-parser-output a.external,
div.vectorTabs li a,
#mw-panel .portal .body li a {
/* Standard links. */
color: #080;
}
a:visited,
.mw-parser-output a.extiw:visited,
.mw-parser-output a.external:visited,
#mw-panel .portal .body li a:visited {
/* Visited links. */
color: #084;
}
a:hover,
.mw-parser-output a.extiw:hover,
.mw-parser-output a.external:hover {
/* Hovering over external links. */
color: #0b0;
}
a:visited:hover,
.mw-parser-output a.extiw:visited:hover,
.mw-parser-output a.external:visited:hover {
/* Hovering over external links. */
color: #0b4;
}
a.new:link,
a.new:visited,
#p-cactions .new a,
#p-cactions .new a:visited {
/* Non-existent pages. */
color: #bb0;
}
/*
* Infoboxes.
*/
.infobox {
/* Infoboxes. */
border-radius: 8px;
}
.infobox th {
/* Headers. */
background-color: #d8f0db;
border-radius: 6px;
padding-left: 4px;
}
/*
* Navboxes.
*/
.navbox {
/* Navboxes. */
border-radius: 8px;
}
.navbox th {
/* Headers. */
border-radius: 6px;
}
table.navbox-light {
/* Light-background navboxes. */
color: #000;
}
table.navbox-light a,
table.navbox-light a.extiw,
table.navbox-light a.external {
/* Light-background navbox links. */
color: #262;
}
table.navbox-light a:visited,
table.navbox-light a.extiw:visited,
table.navbox-light a.external:visited {
/* Light-background navbox links. */
color: #141;
}
table.navbox-light a:hover,
table.navbox-light a.extiw:hover,
table.navbox-light a.external:hover {
/* Light-background navbox links. */
color: #363;
}
table.navbox-light a:visited:hover,
table.navbox-light a.extiw:visited:hover,
table.navbox-light a.external:visited:hover {
/* Light-background navbox links. */
color: #242;
}
table.navbox-light a.new,
table.navbox-light a.new:visited,
table.navbox-light a.new:hover,
table.navbox-light a.new:visited:hover {
/* Light-background navbox links. */
color: #422;
}
table.navbox-dark {
/* Dark-background navboxes. */
color: #fff;
}
table.navbox-dark a,
table.navbox-dark a.extiw,
table.navbox-dark a.external {
/* Dark-background navbox links. */
color: #bfb;
}
table.navbox-dark a:visited,
table.navbox-dark a.extiw:visited,
table.navbox-dark a.external:visited {
/* Dark-background navbox links. */
color: #cfc;
}
table.navbox-dark a:hover,
table.navbox-dark a.extiw:hover,
table.navbox-dark a.external:hover {
/* Dark-background navbox links. */
color: #cfc;
}
table.navbox-dark a:visited:hover,
table.navbox-dark a.extiw:visited:hover,
table.navbox-dark a.external:visited:hover {
/* Dark-background navbox links. */
color: #dfd;
}
table.navbox-dark a.new,
table.navbox-dark a.new:visited,
table.navbox-dark a.new:hover,
table.navbox-dark a.new:visited:hover {
/* Dark-background navbox links. */
color: #fdd;
}
/*
* Categories.
*/
#catlinks {
/* Categories box. */
border-radius: 8px;
}
/*
* Main page.
*/
.titledBox {
/* Section boxes. */
border-radius: 16px;
margin-top: 32px;
background: url(https://www.pikminwiki.com/images/0/09/Vector_grass.jpg) bottom center;
}
.titledBoxTitle {
/* Section box titles. */
border-radius: 12px;
}
.main-page-left-col {
/* Left column. */
padding-right: 16px;
}
.main-page-right-col {
/* Right column. */
padding-left: 16px;
}
.main-page-nav-item {
/* Main item in the navigation box. */
background-color: #d8f0db;
border-radius: 20px;
border: 2px solid #66b283;
padding: 8px;
}
.pds-box {
/* Poll. */
border-radius: 16px;
}
#mp-title-nav {
/* Navigation box title. */
background-color: #b9d6ec;
}
#mp-title-fa {
/* Featured article box title. */
background-color: #ecebbf;
}
#mp-title-community {
/* Community box title. */
background-color: #dbd0f6;
}
#mp-title-news {
/* News box title. */
background-color: #f0d2e2;
}
#mp-title-poll {
/* Poll box title. */
background-color: #b9b9b9;
}
#mp-title-dyk {
/* Did You Know box title. */
background-color: #f8f8f8;
}
#mp-title-niwa {
/* NIWA box title. */
background-color: #e6b5b5;
}
/*
* Edit page.
*/
.mw-editform .editOptions {
/* Edit options form. */
background-color: #d8f0db;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
/* Apply changes button. */
background-color: #59cb6a;
border-color: #33cc6b;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
/* Apply changes button. */
background-color: #15c52f;
border-color: #33cc6b;
}