MediaWiki:Timeless.css

/* Warning: Imports must go in Common.css since it loads first in a combined stylesheet */ /* COLORS ASSIGNMENTS */ body.skin-timeless { --link: var(--accent-dark); --link-alt: var(--link); --link-dark: var(--accent-darker); --body-color: var(--primary-darker); --bg: var(--tertiary-darkish); --toolbar-color: var(--primary); --toolbar-color2: var(--accent-dark); --content-color: var(--secondary); --sidebar-color: var(--secondary-desaturated); --sidebar-color2: var(--secondary-desaturatedish); --border-color: var(--gray); --border-mid: var(--accent-dark); --border-left: var(--border-mid); --border-right: var(--border-mid); --footer-border: var(--accent-dark); --search-color: var(--sidebar-color); --heading-border: var(--accent-saturatedish); --highlight: var(--accent-saturateder); --mp-border: var(--tertiary-lightish); color: var(--text); background-color: var(--body-color); }

/* Wordmark */ font-family: 'Linux Libertine','Times New Roman','Liberation Serif','Nimbus Roman','Noto Serif','Times',serif; }
 * 1) p-logo-text a {

/* Logo adjustment */ height: 105px; }
 * 1) p-logo {

.mw-wiki-logo, .mw-wiki-logo.fallback { background-size: auto; background-position: center 6px; }

/* Edit icon override */ background-image: url(/w/skins/Timeless/resources/images/pencil-grey.png?23255); background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 height=%2220%22 width=%2220%22%3E%3Cpath d=%22M12.879 2.165l-9.465 9.471 4.95 4.95 9.465-9.471zm0 2.829L15 7.115l-6.636 6.643-2.121-2.122zM6.95 18H2v-4.95z%22 opacity=%22.33%22/%3E%3C/svg%3E"); border: 0; background-color: transparent; background-repeat: no-repeat; background-position: left top; display: inline-block; margin-bottom: -0.35em; padding: 0 2px 0 20px }
 * 1) ca-edit#ca-edit a {

/* More reliable content box */ @media screen and (min-width: 851px) { #mw-content-container, #mw-content-block { position: relative; } }

@media screen and (min-width:1100px) { #mw-content-container { background-color: var(--bg); background-image: linear-gradient(transparent, transparent 1900px, var(--bg) 2000px, transparent 2000px), url(https://static.miraheze.org/phereonwiki/7/79/Background.jpeg); background-repeat: no-repeat; background-position: center top; border-bottom-color: var(--footer-border); }	#mw-site-navigation .sidebar-chunk, #mw-related-navigation .sidebar-chunk { background-color: var(--sidebar-color); border-color: var(--border-color); border-radius: 4px; }	#mw-content { border-radius: 0 0 6px 6px; }	#mw-content-container { min-height:calc(100vh - 150px); } }

@media screen and (min-width:2000px) { #mw-content-container { background-image:linear-gradient(transparent,transparent calc(100vw - 100px),var(--bg) 100vw,transparent 100vw), url(https://static.miraheze.org/phereonwiki/7/79/Background.jpeg); background-size:100% auto; } }

@media screen and (max-width:1099px) { .sidebar-chunk .sidebar-inner { background-color:var(--sidebar-color)!important; border-color: var(--border-color) !important; border-radius: 4px; color: var(--text); }

.sidebar-chunk { color: var(--text-alt); }	#mw-content-container { padding-bottom:unset; }	#mw-content { min-height:calc(100vh - 250px); } }

background-color: var(--content-color); border-color: var(--border-color)!important; }
 * 1) mw-content {

background-color: var(--toolbar-color); color: var(--text-alt); }
 * 1) mw-header-container,#mw-header-nav-hack {

border-top-color: var(--toolbar-color2); }
 * 1) mw-header-nav-hack {

background-color: var(--toolbar-color)!important; }
 * 1) mw-header-hack {

.color-middle { background-color: var(--border-mid); }

.color-left { background-color: var(--border-left); }

.color-right { background-color: var(--border-right); }

background-color: var(--search-color); border-color: var(--body-color); border-radius: 17px; }
 * 1) simpleSearch {

outline: none; border-radius: 17px; box-shadow: 0px 0px 3px 1px var(--highlight); }
 * 1) searchInput:focus {

color: var(--text); opacity: 0.8; }
 * 1) searchInput::placeholder {

background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221.333%22 height=%2221.333%22 viewBox=%220 0 20 20%22%3E %3Cg fill=%22%23111%22 stroke=%22none%22 transform=%22translate%28-121 -16.362%29%22%3E %3Cpath d=%22M129.5 17.363a7.501 7.501 0 1 0 5.303 12.803 7.501 7.501 0 0 0-5.304-12.803zm.066 3a4.5 4.5 0 0 1 3.115 1.316 4.5 4.5 0 0 1 0 6.365 4.5 4.5 0 0 1-6.363 0 4.5 4.5 0 0 1 0-6.365 4.5 4.5 0 0 1 3.248-1.316z%22/%3E %3Crect width=%223%22 height=%229%22 x=%2272.49%22 y=%22114.15%22 ry=%221.5%22 transform=%22rotate%28-45%29%22/%3E %3C/g%3E %3C/svg%3E"); opacity: 0.6; }
 * 1) searchButton, #mw-searchButton {

.mw-parser-output a.external,a { color: var(--link); }

a:hover,a:visited { color: var(--link-alt); }

.mw-parser-output a.extiw, .mw-parser-output a.extiw:active { color: var(--link-alt); }

.mw-parser-output a.external { color: var(--link-alt); }

a:hover { text-decoration: underline; }

text-decoration: inherit; }
 * 1) mw-page-header-links a:hover,#p-logo-text a {

color: var(--text-alt); text-align: center !important; }
 * 1) p-logo-text a {

border-color: var(--heading-border); }
 * 1) mw-page-header-links li.selected,.mw-body h1.firstHeading {

.mw-echo-notifications-badge:before { opacity: 0.8 !important; filter: invert(100%); }

color: var(--link-dark); }
 * 1) mw-page-header-links li.selected a {

background-color: var(--sidebar-color) !important; border-color: var(--border-color) !important; color: var(--text); }
 * 1) personal .dropdown {

background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E %3Cpath fill=%22%23fff%22 d=%22M3.64 9.453c-1.756 2.388-1.955 4.995-1.226 6.723.489 1.179 1.179 1.87 1.988 2.289.792.428 1.749.517 2.598.52h6.324c.92 0 1.85-.208 2.649-.674.799-.467 1.459-1.198 1.798-2.288.49-1.548.266-4.027-1.478-6.455-.008.012-.021.019-.03.03A7.5 7.5 0 0 1 10 12.984a7.5 7.5 0 0 1-6.36-3.53z%22 transform=%22scale%281.00079%29%22/%3E %3Cpath fill=%22%23fff%22 d=%22M10.008.992a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9z%22/%3E %3C/svg%3E") !important; opacity: 0.87; }
 * 1) personal h2 {

background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2222%22 height=%2216%22%3E %3Cpath fill=%22%23fff%22 d=%22M15.5 6l-5 5-5-5z%22/%3E %3C/svg%3E"); opacity: 0.87; }
 * 1) personal h2:after,
 * 2) mw-site-navigation h2:after,
 * 3) mw-related-navigation h2:after {

@media screen and (max-width: 850px){ #site-tools h2 { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2226.667%22 height=%2226.667%22 viewBox=%220 0 25.02 25.02%22%3E %3Cpath fill=%22%23fff%22 stroke=%22none%22 d=%22M12.099 1a1.64 1.64 0 0 0-1.644 1.645v1.07A9.043 9.043 0 0 0 7.732 4.84l-.744-.744a1.639 1.639 0 0 0-2.325 0l-.581.582a1.64 1.64 0 0 0 0 2.325l.75.75a9.043 9.043 0 0 0-1.12 2.702H2.646A1.64 1.64 0 0 0 1 12.099v.822c0 .91.733 1.644 1.644 1.644h1.07a9.043 9.043 0 0 0 1.125 2.723l-.758.758a1.642 1.642 0 0 0 0 2.327l.581.58a1.64 1.64 0 0 0 2.325 0l.766-.765a9.043 9.043 0 0 0 2.7 1.119v1.068c0 .91.734 1.644 1.645 1.644h.822a1.64 1.64 0 0 0 1.644-1.644v-1.07a9.043 9.043 0 0 0 2.704-1.114l.763.763a1.642 1.642 0 0 0 2.326 0l.581-.581a1.642 1.642 0 0 0 0-2.327l-.762-.763a9.043 9.043 0 0 0 1.13-2.718h1.068a1.64 1.64 0 0 0 1.644-1.644v-.822a1.64 1.64 0 0 0-1.644-1.644h-1.07a9.043 9.043 0 0 0-1.114-2.704l.748-.748a1.64 1.64 0 0 0 0-2.325l-.58-.582a1.642 1.642 0 0 0-2.327 0l-.747.747a9.043 9.043 0 0 0-2.72-1.13V2.645A1.64 1.64 0 0 0 12.921 1h-.822zm.53 6.577a4.814 4.932 0 0 1 4.813 4.933 4.814 4.932 0 0 1-4.813 4.932 4.814 4.932 0 0 1-4.814-4.932 4.814 4.932 0 0 1 4.814-4.933z%22/%3E %3C/svg%3E"); opacity: 0.87; }	#site-navigation h2 { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2226.667%22 height=%2226.667%22 viewBox=%220 0 25.02 25.02%22%3E %3Crect width=%2223.018%22 height=%225.004%22 x=%221.001%22 y=%2219.015%22 fill=%22%23fff%22 stroke=%22none%22 ry=%221.648%22/%3E %3Crect width=%2223.018%22 height=%225.004%22 x=%221.001%22 y=%2210.008%22 fill=%22%23fff%22 stroke=%22none%22 ry=%221.648%22/%3E %3Crect width=%2223.018%22 height=%225.004%22 x=%221.001%22 y=%221.001%22 fill=%22%23fff%22 stroke=%22none%22 ry=%221.648%22/%3E %3C/svg%3E"); opacity: 0.87; }	#user-tools h2:after, .sidebar-chunk h2:after { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2222%22 height=%2216%22%3E %3Cpath fill=%22%23fff%22 d=%22M15.5 6l-5 5-5-5z%22/%3E %3C/svg%3E"); opacity: 0.87; } }

.oo-ui-icon-bell,.mw-ui-icon-bell:before { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E bell %3C/title%3E%3Cg fill=%22%23fff%22%3E %3Cpath d=%22M16 7a5.38 5.38 0 0 0-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 0 0 4 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 0 0 3-3H7a3 3 0 0 0 3 3z%22/%3E %3C/g%3E%3C/svg%3E"); opacity: 0.87; }

.oo-ui-icon-tray,.mw-ui-icon-tray:before { background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E tray %3C/title%3E%3Cg fill=%22%23fff%22%3E %3Cpath d=%22M3 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E %3C/g%3E%3C/svg%3E"); opacity: 0.87; }

.tools-inline li:hover { border-bottom-color: var(--accent-lighter); }

hr { border-color: var(--mp-border,black); }

.mw-body .mw-parser-output h1:after, .mw-body .mw-parser-output h2:after { border-bottom: solid 2px var(--secondary-dark, #c8ccd1); }