User:Slate/timeless.css

/** @import url("https://splatoonwiki.org/wiki/User:GuyPerfect/timeless-tinted.css?action=raw&ctype=text/css"); */


 * root {

--translucent-background: rgba(234, 236, 240, 0.8); --infobox-background: rgba(255, 255, 255, 1); --menu-background: rgba(234, 236, 240, 0.96); --hatnote-background: rgba(234, 236, 240, 0.8); --body-background: #ffffff; --text-color: #000000; --link-color: #3366cc; --visited-link-color: #6b4ba1; --filter: none; --caption: #54595d; --image-border: none; } @media (prefers-color-scheme: dark) { :root { /** CSS on this page */ --translucent-background: rgba(75, 75, 75, 0.8); --infobox-background: rgba(75, 75, 75, 0.8); --menu-background: rgba(75, 75, 75, 0.96); --hatnote-background: rgba(75, 75, 75, 0.5); --body-background: #111; /* was 000 */ --text-color: #e4e4e4; /* was fff */ --link-color: #23450c; --visited-link-color: #3b9400; --filter: brightness(0) invert(1); --caption: #e4e4e4; /* was fff */ --image-border: 2px solid #e4e4e4;

/** Current impl */ --article       : #222222; /* Article table */ --body-1        : #111111; /* Page background stripe 1 */ --body-2        : #181818; /* Page background stripe 2 */ --border        : #999999; /* Layout border */ --divider       : #94bf00; /* Layout divider */ --footer-1      : #191919; /* Page footer 1 */ --footer-2      : #111111; /* Page footer 2 */ --input         : #000000; /* Data input background */ --input-text    : #e4e4e4; /* Data input text */ --link-admin    : #009400; /* Admin user link */ --link-bureaucrat: #daa520; /* Bureaucrat user link */ --link-external : #4b7bce; /* External link */ --link-internal : #3b9400; /* Internal link */ --link-missing  : #e15151; /* Link destination does not exist */ --link-niwa     : #319471; /* NIWA affiliate link */ --mark          : #484800; /* background */ --page          : #111111; /* Main content background */ --page-b        : #000000; /* Secondary content background */ --page-text     : #e4e4e4; /* Main content text */ --page-text-b   : #ababab; /* Secondary content text */ --reference     : #001024; /* Selected reference background */ --reply-highlight: #855d00; /* Briefly displayed after reply */ --selected      : #3366cc; /* Selection background */ --selected-text : #ffffff; /* Selection text */ --shadow        : #000000; /* Layout shadow */ --diff-add	  : #0064C2; /* Diff added contents box border */ --diff-add-word: #0063C7; /* Diff added word background */ --diff-context : #616670; /* Diff context box border */ --diff-del	  : #805e00; /* Diff deleted contents box border */ --diff-del-word: #7e5901; /* Diff deleted word background */ --diff-history : #181818; /* Selected diff in history */ --ui-error     : #df434399; --ui-grey      : #ffffff54; --ui-invert    : #00000099; --ui-main-theme : #00B800;  /* The main UI theme including some components */ --ui-main-theme-b : rgba(0, 184, 0, 0.25);  /* Above with background highlight opacity */ --ui-normal    : #ffffff99; --ui-progressive: #507bd399; --ui-warning   : #ffcc3399; --site-color-background-generic		: rgba(0, 153, 255, 0.25); --site-color-background-b-generic	: rgba(0, 153, 255, 0.15); --site-color-generic				: rgba(0, 153, 255, 1); --site-color-background-niwa		: rgba(255, 128, 0, 0.25); --site-color-background-b-niwa		: rgba(255, 128, 0, 0.15); --site-color-niwa					: rgba(255, 128, 0, 1); --site-color-background-oe			: rgba(174, 21, 102, 0.25); --site-color-background-b-oe		: rgba(174, 21, 102, 0.15); --site-color-oe						: rgba(174, 21, 102, 1); --site-color-background-s			: rgba(170, 220, 0, 0.25); --site-color-background-b-s			: rgba(170, 220, 0, 0.15); --site-color-s						: rgba(170, 220, 0, 1); --site-color-background-s2			: rgba(240, 60, 120, 0.25); --site-color-background-b-s2		: rgba(240, 60, 120, 0.15); --site-color-s2						: rgba(240, 60, 120, 1); --site-color-background-s3			: rgba(235, 238, 61, 0.25); --site-color-background-b-s3		: rgba(235, 238, 61, 0.15); --site-color-s3						: rgba(235, 238, 61, 1); } }

@media screen and (min-width: 768px) { .header-container.header-chrome { background: var(--menu-background); }	.content figcaption, .content .thumbcaption { color: var(--caption); }	.page-actions-menu__list-item > a { color: var(--grey-text-color); } } @media screen and (min-width: 1025px) { .pre-content h1 { color: var(--text-color); } }	color: var(--link-color); } .overlay-header-container, .overlay-footer-container { background: var(--translucent-background); }	background: var(--translucent-background); } .mw-searchresults-has-iw .iw-resultset { background: var(--infobox-background); }
 * 1) mw-mf-page-left ul.hlist li a {
 * 1) mw-mf-page-left {

/* Dark Mode */ background: var(--body-background); color: var(--text-color); } .toggle-list__list { background: var(--translucent-background); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } .toggle-list-item:hover { background: var(--body-background); } .toggle-list-item__label { color: var(--text-color); } .mw-highlight { background: var(--translucent-background); } .page-summary h2, .page-summary h3, .overlay.search-overlay li.page-summary .wikidata-description { color: var(--text-color); } .unicode, .haudio { filter: var(--filter); } .branding-box img { filter: var(--filter); } .mw-ui-icon-element, .mw-ui-icon-before:before { filter: var(--filter); } .client-js .toc { background-color: var(--body-background); }	opacity: 1; filter: var(--filter); } .minerva__tab-container .minerva__tab:visited, .minerva__tab-container .minerva__tab:hover, .minerva__tab-container .minerva__tab:active, .minerva__tab-container .minerva__tab.new, .minerva__tab-container .minerva__tab.new:visited, .minerva__tab-container .minerva__tab.new:active, .minerva__tab-container .minerva__tab.new:hover { color: var(--text-color); }	color: var(--text-color); } .content figure .thumbinner, .content .thumb .thumbinner { background: var(--infobox-background); } .overlay { background: var(--translucent-background); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } .hatnote { background: var(--translucent-background); color: var(--caption); border-radius: 10px; } a { color: var(--link-color); } a:visited { color: var(--visited-link-color); } .infobox a, .wikitable a, table a { color: var(--link-color); } .infobox a:visited, .wikitable a:visited, table a:visited { color: var(--visited-link-color); }
 * 1) content, #mw-mf-page-center {
 * 1) pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {
 * 1) mw-mf-page-left ul li a {

/* Banner */ color: var(--text-color); } .header-container.header-chrome { background: var(--menu-background); box-shadow: 3px 3px 6px rgba(0,0,0,0.20); } /* Targeting Safari for Backdrop Filter and Font size bug*/ @media not all and (min-resolution:.001dpcm) { @media { .header-container.header-chrome { background: var(--translucent-background) !important; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } 		@media screen and (min-width: 768px) { body, p { font-size: 1.1em !important; }			.pre-content h1 { font-size: 3em; } 		}    } } @media screen and (max-width: 767px) { .content figcaption, .content .thumbcaption { color: var(--text-color); } } /* Fonts */ .pre-content h1 { color: var(--text-color); } h2 .mw-headline { color: var(--text-color); } h3 .mw-headline{ color: var(--text-color); } h4 .mw-headline{ color: var(--text-color); } .content table.infobox { background: var(--infobox-background); color: var(--text-color); } .content table.infobox a { color: var(--link-color); } .content table.infobox a:visited { color: var(--visited-link-color); } .hatnote a, .dablink a, .rellink a { color: var(--link-color); } /* Editor */ .oo-ui-toolbar-bar { background-color: var(--translucent-background); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); color: var(--text-color); } .oo-ui-iconElement-icon { filter: var(--filter); } .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon, .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { filter: var(--filter); } .client-js .mw-edittools-section input[type="button"] { color: var(--text-color); }
 * 1) mw-mf-page-left ul li a {