MediaWiki:Vector.css
From IdleOn MMO Wiki
Note: After publishing, 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: Press Ctrl-F5.
/* ------ VECTOR ------ */
.skin-vector #footer-info li {
color: var(--contrast-1);
}
.vector-menu-portal .vector-menu-heading {
color: var(--contrast-1);
border-color: var(--contrast-3);
}
#mw-panel .vector-menu-heading {
font: normal .975rem 'Idleon';
}
.vector-menu-portal .vector-menu-content li a,
.vector-menu-portal .vector-menu-content li a:visited {
color: var(--link);
}
.vector-menu-portal .vector-menu-content li a:hover,
.vector-menu-portal .vector-menu-content li a:visited:hover,
.vector-menu-portal .vector-menu-content li a:active,
.vector-menu-portal .vector-menu-content li a:visited:active {
color: var(--link-hover);
}
.vector-menu-tabs .mw-list-item a,
.vector-menu-tabs .mw-list-item:visited {
color: var(--link);
}
.vector-menu-tabs .mw-list-item a:focus,
.vector-menu-tabs .mw-list-item a:hover,
.vector-menu-tabs .mw-list-item a:active {
color: var(--link-hover);
}
.vector-menu-tabs .mw-list-item.selected a,
.vector-menu-tabs .mw-list-item.selected a:visited {
color: var(--contrast-1);
}
.skin-vector h1,
.skin-vector h2 {
border-color: var(--contrast-3);
}
.catlinks {
background: var(--base-1);
border-color: var(--contrast-3);
border-radius: 2px;
}
ul {
list-style-image: unset;
}
/* --- VECTOR LEGACY --- */
html {
color: var(--contrast-1);
background: var(--page-background);
}
.skin-vector-legacy {
color: var(--contrast-1);
background: transparent;
}
.skin-vector-legacy #mw-page-base{
color: var(--contrast-1);
background: transparent;
}
.skin-vector-legacy #content.mw-body,
.skin-vector-legacy .parsoid-body {
color: var(--contrast-1);
background: var(--base-1);
border-color: var(--contrast-3);
}
.skin-vector-legacy #mw-panel {
background-color: var(--sidebar-base);
border: 1px solid var(--contrast-3);
border-width: 0 1px 1px 0;
}
.skin-vector-legacy .vector-menu-portal .vector-menu-heading {
background-image: linear-gradient(to right, var(--accent-1) 66%, transparent 100%);
}
/* VECTOR LEGACY NAV */
.vector-menu-tabs-legacy,
.vector-menu-tabs-legacy a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
background-image: linear-gradient(to bottom,transparent 0,var(--contrast-3) 100%);
}
.vector-menu-tabs-legacy li,
.skin-vector-legacy .vector-menu-dropdown {
background-image: linear-gradient(to top,var(--contrast-3) 0,var(--base-0) 1px,var(--base-1) 100%);
}
.vector-menu-tabs-legacy .selected{
background: var(--base-1);
}
#mw-head .vector-menu-dropdown .vector-menu-heading {
color: var(--contrast-1);
}
#mw-head .vector-menu-dropdown .vector-menu-heading:after {
filter: var(--filter);
}
.mw-wiki-logo {
background-size: cover;
}
.vector-menu-dropdown .vector-menu-heading:after, .mw-interlanguage-selector:after{
filter: var(--filter);
}
/* --- VECTOR 2022 --- */
.skin-vector-2022 {
height: unset;
}
.skin-vector-2022, .skin-vector-2022 .mw-page-container {
background: var(--base-1);
color: var(--contrast-1);
}
.skin-vector-2022 .mw-sidebar {
background: var(--base-1);
color: var(--contrast-1);
}
.skin-vector-2022 .mw-article-toolbar-container {
border-color: var(--contrast-3);
color: var(--contrast-1);
}
.skin-vector-2022 #content.mw-body {
border-color: transparent;
}
.skin-vector-2022 .mw-footer{
border-color: var(--contrast-3);
}
.skin-vector-2022 .mw-ui-icon:before,
.skin-vector-2022 .mw-ui-icon:after {
filter: var(--filter);
}
.vector-menu-dropdown .vector-menu-content{
background: var(--base-1);
border-color: var(--contrast-3);
}
.vector-sticky-header {
background: var(--base-1);
border-color: var(--contrast-3);
}
.vector-sticky-header-context-bar {
border-color: var(--contrast-3);
}
.vector-sticky-header-context-bar-primary {
font-family: 'Idleon';
}
@media screen and (min-width: 1000px) {
.client-js.vector-sticky-header-enabled .stickyHeader.jquery-tablesorter th.headerSort,
.client-js.vector-sticky-header-enabled .stickyHeader th{
top: 3.125rem;
}
}
#pt-userpage-2 a,
.vector-user-menu-logout a, .vector-user-menu-create-account a, .vector-user-menu-login a, .vector-menu-dropdown .mw-list-item a,
#pt-userpage-2 a:visited,
.vector-user-menu-logout a:visited, .vector-user-menu-create-account a:visited, .vector-user-menu-login a:visited, .vector-menu-dropdown .mw-list-item a:visited{
color: var(--link);
}
#pt-userpage-2 a:hover,
#pt-userpage-2 a:active{
color: var(--link-hover);
}
.vector-user-menu-logout {
border-color: var(--contrast-3);
}
.skin-vector-2022 #siteNotice #localNotice {
margin: 0;
}
/* VECTOR 2022 SEARCH */
.skin-vector-2022 #simpleSearch #searchButton,
.skin-vector-2022 #simpleSearch #mw-searchButton {
background-color: transparent;
border: none;
height:32px;
}
.cdx-search-input--has-end-button,
.cdx-text-input__input,
.cdx-button,
.cdx-button:enabled,
.cdx-button--framed,
.cdx-text-input__input:enabled,
.cdx-button--framed:enabled {
background: var(--base-2);
border-color: var(--contrast-3);
color: var(--contrast-1);
}
.cdx-text-input__input:enabled:hover{
border-color: var(--contrast-2);
}
.cdx-text-input__input:enabled~.cdx-text-input__icon,
.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,
.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{
color: var(--contrast-1);
}
.cdx-button--framed:enabled:hover {
background: var(--base-2);
border-color: var(--contrast-2);
color: var(--contrast-1);
}
.cdx-menu {
background: var(--base-2);
border-color: var(--contrast-3);
color: var(--contrast-1);
}
.cdx-menu-item--enabled,
.cdx-menu-item--enabled .cdx-menu-item__content {
color: var(--contrast-1);
}
.cdx-menu-item--enabled:hover,
.cdx-menu-item--enabled.cdx-menu-item--highlighted {
background: var(--highlight-progressive);
}
.cdx-menu-item--enabled.cdx-menu-item--active,
.cdx-menu-item--enabled.cdx-menu-item--active:hover {
background: var(--base-1);
}
.cdx-thumbnail__placeholder,
.cdx-thumbnail__image {
border-color: var(--contrast-2);
background-color: var(--base-1);
}
.cdx-typeahead-search__search-footer{
border-color: var(--contrast-3);
}
.cdx-typeahead-search__menu-message,
.cdx-typeahead-search__search-footer {
color: var(--contrast-1);
}
.cdx-typeahead-search__search-footer__icon{
color: var(--contrast-1);
}
.cdx-menu-item--enabled:hover .cdx-typeahead-search__search-footer__icon,
.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-typeahead-search__search-footer__icon {
color: var(--link-hover);
}
/* VECTOR 2022 TOC */
.sidebar-toc {
background: var(--base-1);
color: var(--contrast-1);
}
.sidebar-toc .sidebar-toc-title {
color: var(--contrast-1);
}
.sidebar-toc .sidebar-toc-list-item-active > .sidebar-toc-link,
.vector-toc-collapse-button,
.vector-toc-uncollapse-button {
color: var(--link);
}
.sidebar-toc .sidebar-toc-list-item-active > .sidebar-toc-link:hover,
.vector-toc-collapse-button:hover,
.vector-toc-uncollapse-button:hover {
color: var(--link-hover);
}
.vector-toc-collapse-button:before,
.vector-toc-uncollapse-button:before,
.vector-toc-collapse-button:after,
.vector-toc-uncollapse-button:after {
color: var(--contrast-2);
}
.sidebar-toc .sidebar-toc-link {
color: var(--link);
}
.sidebar-toc .sidebar-toc-link:hover {
color: var(--link-hover);
}
#vector-toc-collapsed-button {
background: var(--base-1);
}
#vector-toc-collapsed-button:hover,
#vector-toc-collapsed-button:active {
background: var(--base-2);
}
@media screen and (min-width: 1000px) {
.vector-toc-not-collapsed .sidebar-toc:after {
background: linear-gradient(transparent,var(--base-1));
}
@supports (display:grid) {
.client-js .vector-toc-collapsed .mw-table-of-contents-container .sidebar-toc {
border-color: var(--contrast-3);
}
}
}
@media screen and (max-width: 999px) {
.mw-table-of-contents-container .sidebar-toc {
border-color: var(--contrast-3);
}
}