MediaWiki:Vector.css: Difference between revisions

From Pikipedia, the Pikmin wiki
Jump to navigation Jump to search
(Added the recent changes tag filter, so that it looks like the search box.)
(further match tag filter to search box)
Line 86: Line 86:
   background: #fff;
   background: #fff;
   border-radius: 6px;
   border-radius: 6px;
  border: 1px solid #a2a9b1;
   padding: 0.3em 0.4em 0.2em;
   padding: 0.3em 0.4em 0.2em;
}
#tagfilter:hover {
  /* Tag filter. */
  border-color: #72777d;
}
}


Revision as of 10:53, November 13, 2022

/* CSS placed here will affect users of the default Vector theme. */

/*
 * Body.
 */
body {
  /* Background of everything. */
  background: #C2DAB8 url(https://pikmin.wiki.gallery/images/3/37/Vector_background.jpg) center top;
}

@media all and (min-width: 1350px) {
  /* Add a right padding on wider displays. */
  body, #right-navigation {
    padding-right: 11em;
  }
}


/*
 * Header.
 */
#mw-page-base {
  /* Full-white header-like background that the Vector skin has. */
  background: initial;
}

nav.vectorTabs {
  /* Tabs div. */
  background: initial;
  margin-left: 10px;
  height: 37px;
}

nav.vectorTabs ul {
  /* Tabs ul. */
  background: initial;
  height: 37px;
}

nav.vectorTabs ul > li {
  /* Tabs. */
  background: #cec;
  border: 2px solid #66b283;
  border-radius: 10px 10px 0px 0px;
  margin-right: 10px;
  line-height: 0.5em;
}

nav.vectorTabs li.selected {
  /* Current tab. */
  background: #F4F9F2;
  background: linear-gradient(to top,#F4F9F2 2px,#fffc 2px);
  padding-bottom: 2px;
  border-bottom: 0;
}

.vector-menu-tabs,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown h3 {
  /* Remove blue from tabs. */
  background: none;
}

div#mw-head div.vectorMenu h3 {
  /* Separator line between the "More" button and the search bar. */
  background: initial;
}

nav.vectorTabs span {
  /* Separator line between every tab. */
  background: initial;
}

#p-search {
  /* Search container. */
  margin-right: 10px;
}

#p-search form {
  /* Search form. */
  margin-top: 10px;
}

#searchInput, #tagfilter {
  /* Search bar. */
  background: #fff;
  border-radius: 6px;
  border: 1px solid #a2a9b1;
  padding: 0.3em 0.4em 0.2em;
}
#tagfilter:hover {
  /* Tag filter. */
  border-color: #72777d;
}

#searchButton {
  /* Search button. */
  background-position: center 5px;
}


/*
 * Watch article button.
 */
#ca-watch, #ca-unwatch {
  /* Watch/unwatch button. */
  line-height: 2em;
}

.vector-menu-tabs #ca-watch.icon a::before {
  /* Watch icon. */
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2216%22 height=%2216%22%3E %3Cpath fill=%22%23fff%22 stroke=%22%2366b283%22 stroke-width=%22.99992%22 d=%22M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z%22/%3E %3C/svg%3E");
}

.vector-menu-tabs #ca-unwatch.icon a::before {
  /* Unwatch icon. */
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2216%22 height=%2216%22 xmlns:xlink=%22http://www.w3.org/1999/xlink%22%3E %3Cdefs%3E %3ClinearGradient id=%22a%22%3E %3Cstop offset=%220%22 stop-color=%22%2366b283%22/%3E %3Cstop offset=%22.5%22 stop-color=%22%2366b283%22/%3E %3Cstop offset=%221%22 stop-color=%22%23fff%22/%3E %3C/linearGradient%3E %3ClinearGradient id=%22b%22 x1=%2213.47%22 x2=%224.596%22 y1=%2214.363%22 y2=%223.397%22 xlink:href=%22%23a%22 gradientUnits=%22userSpaceOnUse%22/%3E %3C/defs%3E %3Cpath fill=%22url%28%23b%29%22 stroke=%22%2366b283%22 stroke-width=%22.99992%22 d=%22M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z%22/%3E %3C/svg%3E");
}

.vector-menu-tabs #ca-unwatch.icon a:hover::before,
.vector-menu-tabs #ca-unwatch.icon a:focus::before {
  /* Unwatch icon on hover. */
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2216%22 height=%2216%22 xmlns:xlink=%22http://www.w3.org/1999/xlink%22%3E %3Cdefs%3E %3ClinearGradient id=%22a%22%3E %3Cstop offset=%220%22 stop-color=%22%2366b283%22/%3E %3Cstop offset=%22.5%22 stop-color=%22%2366b283%22/%3E %3Cstop offset=%221%22 stop-color=%22%23fff%22/%3E %3C/linearGradient%3E %3ClinearGradient id=%22b%22 x1=%2213.47%22 x2=%224.596%22 y1=%2214.363%22 y2=%223.397%22 xlink:href=%22%23a%22 gradientUnits=%22userSpaceOnUse%22/%3E %3C/defs%3E %3Cpath fill=%22url%28%23b%29%22 stroke=%22%23c8b250%22 stroke-width=%22.99992%22 d=%22M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z%22/%3E %3C/svg%3E");
}

.vector-menu-tabs #ca-unwatch.mw-watchlink-temp.icon a::before {
  /* Temporary watch icon. */
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8'?%3E%3Csvg width='16px' height='16px' viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Etempwatch-icon%3C/title%3E%3Cdefs%3E%3ClinearGradient x1='60.558218%25' y1='98.7006198%25' x2='43.1041147%25' y2='16.8097976%25' id='linearGradient-1'%3E%3Cstop stop-color='%2366B283' offset='0%25'/%3E%3Cstop stop-color='%2366B283' offset='50%25'/%3E%3Cstop stop-color='%23FFFFFF' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='tempwatch-icon' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(1.000000, 1.000000)' fill-rule='nonzero' id='Path'%3E%3Cpolygon fill='%23FFFFFF' points='7.103 0.146 9.278 4.554 14.142 5.261 10.622 8.692 11.453 13.537 7.102 11.25 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3Cpolygon fill='url(%23linearGradient-1)' points='6.999 0.355 6.999 11.303 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3Cpolygon stroke='%237CB5D1' stroke-width='0.99992' points='7.103 0.146 9.278 4.554 14.142 5.261 10.622 8.692 11.453 13.537 7.102 11.25 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.vector-menu-tabs #ca-unwatch.mw-watchlink-temp.icon a:hover::before,
.vector-menu-tabs #ca-unwatch.mw-watchlink-temp.icon a:focus::before {
  /* Temporary watch icon on hover. */
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8'?%3E%3Csvg width='16px' height='16px' viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Etempwatch-icon-hl%3C/title%3E%3Cdefs%3E%3ClinearGradient x1='60.558218%25' y1='98.7006198%25' x2='43.1041147%25' y2='16.8097976%25' id='linearGradient-1'%3E%3Cstop stop-color='%2366B283' offset='0%25'/%3E%3Cstop stop-color='%2366B283' offset='50%25'/%3E%3Cstop stop-color='%23FFFFFF' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='tempwatch-icon-hl' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='tempwatch-icon-hl-copy' transform='translate(1.000000, 1.000000)' fill-rule='nonzero'%3E%3Cpolygon id='Path' fill='%23FFFFFF' points='7.103 0.146 9.278 4.554 14.142 5.261 10.622 8.692 11.453 13.537 7.102 11.25 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3Cpolygon id='Path' fill='url(%23linearGradient-1)' points='6.999 0.355 6.999 11.303 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3Cpolygon id='Path' stroke='%23C8B250' stroke-width='0.99992' points='7.103 0.146 9.278 4.554 14.142 5.261 10.622 8.692 11.453 13.537 7.102 11.25 2.751 13.537 3.582 8.692 0.062 5.261 4.926 4.554'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}


/*
 * Sidebar.
 */
.mw-logo {
  /* Logo text (new Vector). */
  color: #084 !important;
}

#mw-panel .portal h3 {
  /* Section headers. */
  color: #000;
  border-bottom: 1px solid #66b283;
  margin-right: 10px;
}

#mw-panel .portal-first h3 {
  /* Show "Navigation" header. */
  display: block;
}

#mw-panel .portal {
  /* Sections. */
  margin-top: 10px;
}

#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 {
  /* List containers below heading. */
  background-image: none;
}

#mw-panel .portal .body ul {
  /* Lists. */
  list-style-image: url(https://pikmin.wiki.gallery/images/a/a5/Vector_bullet.png);
}

#p-personal {
  /* Personal info box. */
  padding: 0 10px 2px 0;
  right: 0.33em;
}

#p-personal ul {
  /* Personal info box list. */
  padding-left: 0;
}

#pt-userpage a {
  /* Logged-in user icon. */
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2213.836%22 viewBox=%220 0 12 13.836%22%3E %3Cpath fill=%22%233C8F5B%22 d=%22M1.938%2C6.656c-1.32%2C1.485-1.47%2C3.15-0.97%2C4.25c0.323%2C0.707%2C0.78%2C1.127%2C1.313%2C1.375 c0.496%2C0.229%2C1.074%2C0.273%2C1.658%2C0.282c0.023%2C0%2C0.04%2C0.03%2C0.062%2C0.03h4.187c0.61%2C0%2C1.225-0.125%2C1.75-0.405 c0.527-0.28%2C0.961-0.718%2C1.188-1.376c0.335-0.964%2C0.175-2.529-1.094-4.03C9.094%2C7.954%2C7.68%2C8.719%2C6.065%2C8.719 c-1.677%2C0-3.182-0.812-4.125-2.063H1.938z%22/%3E %3Cpath fill=%22%233C8F5B%22 d=%22M6.063%2C0c-1.89%2C0-3.595%2C1.674-3.594%2C3.563C2.467%2C5.45%2C4.173%2C7.155%2C6.06%2C7.155 c1.89%2C0%2C3.564-1.705%2C3.563-3.593C9.625%2C1.673%2C7.95%2C0%2C6.063%2C0L6.063%2C0z%22/%3E %3C/svg%3E");
}

#pt-anonuserpage, #pt-userpage a {
  /* User/anon icon position. */
  background-position: left 5px;
}


/*
 * Footer.
 */
#footer {
  /* Footer. */
  background: url(https://pikmin.wiki.gallery/images/8/83/Vector_banner.png) no-repeat center bottom;
}


/*
 * Main text.
 */
#content {
  /* Article body. */
  background: #fffc;
  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://pikmin.wiki.gallery/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;
}

.messagebox, .errorbox, .warningbox, .successbox,
.mw-message-box, .mw-error-box, .mw-warning-box, .mw-success-box {
  /* MediaWiki boxes. */
  border-color: #0b0;
  background-color: #d8f0db;
}

.mw-indicators {
  /* Game icons. */
  top: 7px;
}

#localNotice {
  /* Site notice. */
  margin-bottom: 0.5em;
}

#localNotice .pikipediaBox:first-of-type {
  /* Site notice spacing. */
  margin-top: -0.7em;
}

#siteNotice .pikipediaBox {
  /* Site notice box. */
  margin: 0 auto 5px;
}

ol.references li:target,
sup.reference:target {
  /* Highlighted reference. */
  background-color: #CCFFCC;
}


/*
 * Links.
 */
a,
.toctogglelabel,
#p-cactions li a,
nav.vectorTabs li a,
.mw-parser-output a.extiw,
.mw-parser-output a.external,
#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;
}

.mw-parser-output .external {
  /* External link icon. */
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22%3E %3Cpath fill=%22%23fff%22 stroke=%22%23080%22 d=%22M1.5 4.518h5.982V10.5H1.5z%22/%3E %3Cpath fill=%22%23080%22 d=%22M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M9.995 2.004l.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z%22/%3E %3C/svg%3E");
}

.client-js #preftoc a,
.client-js #preftoc a:active {
  /* Preferences tab links. */
  color: #080;
}


/*
 * Infoboxes.
 */
.infobox {
  /* Infoboxes. */
  border-radius: 8px;
}

.infobox th {
  /* Headers. */
  background-color: #d8f0db;
  border-radius: 6px;
  padding-left: 4px;
}


/*
 * Navboxes.
 */
.navbox {
  /* Navboxes. */
  border-radius: 8px;
}

table.navbox th {
  /* Headers. */
  border-radius: 6px;
  background-color: #BEB;
}
table.navbox tr:not(:first-child) th {
  background-color: #CEC;
}

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;
}

.CategoryTreeToggle {
  /* CategoryTree arrow icon. */
  color: #3C8F5B;
}


/*
 * Main page.
 */
.titledBox {
  /* Section boxes. */
  background: #ecf6ee url(https://pikmin.wiki.gallery/images/0/09/Vector_grass.jpg) bottom center;
  border-color: #66b283;
  border-radius: 16px;
  margin-top: 32px;
}

.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. */
  display: inline-grid;
  background-color: #d8f0db;
  border: 2px solid #66b283;
  border-radius: 20px;
  margin-bottom: 5px;
  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-image {
  /* Featured image box title. */
  background-color: #c8f0b9;
}

#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;
}

body.page-Main_Page.action-view #footer-info-lastmod {
  /* Last modified. */
  display: none !important;
}


/*
 * Edit page.
 */
.mw-editform .editOptions {
  /* Edit options form. */
  background-color: #d8f0db;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}


/*
 * Special:Preferences.
 */
.mw-prefs-buttons,
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
	background: #F3F8F1 !important;
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
	border-bottom-color: #D8F0DB !important;
}
.oo-ui-tabSelectWidget-framed {
	background: #D8F0DB !important;
}


/*
 * Green UI elements.
 */
#mw-sidebar-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080
}
#searchInput:focus, #simpleSearch:hover #searchInput:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.suggestions-result-current {
	background-color: #2a8d4b;
}


/*
 * Multimedia viewer.
 */
.mw-mmv-download-pane .mw-mmv-download-area .mw-mmv-download-select-menu {
	border-color: #060;
}
.mw-mmv-reuse-dialog .mw-mmv-reuse-tabs .oo-ui-optionWidget.oo-ui-optionWidget-selected,
.mw-mmv-reuse-dialog .mw-mmv-reuse-tabs .oo-ui-optionWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
	border-color: #080;
}
.mw-mmv-options-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2258.4%22 height=%2252.3%22 viewBox=%220 0 58.4 52.3%22%3E %3Cpath fill=%22%23080%22 d=%22M0 0v44.7h58.4V0H0zm51.9 35.4H6l13.7-17.7 2-.8 12.9 13.7 6.8-4 10.5 8.8z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M48 4.2l1.9 1.9-5.1 5.1-1.3-1.3-.3 5.3 5.2-.3-1.3-1.3 5.2-5.1 1.8 1.9.4-6.6%22/%3E %3Cpath fill=%22%23eaecf0%22 d=%22M0 44.7h58.4v7.7H0z%22/%3E %3Cpath fill=%22%23080%22 d=%22M1.9 46.2h13.8v1.6H1.9zm0 3.1h54.7v1.6H1.9z%22/%3E %3C/svg%3E");
}


/*
 * Miscellaneous.
 */
fieldset {
	border-color: #66b283;
}
.oo-ui-popupWidget-body-padded {
	margin-top: 6px;
}
Retrieved from "https://www.pikminwiki.com/index.php?title=MediaWiki:Vector.css&oldid=235335"