User:Monster Domosed/common.css: Difference between revisionsGive feedback
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* @import url('//deadlock.wiki/index.php?title=Wiki_Redesign.css&action=raw&ctype=text/css'); */ | /* @import url('//deadlock.wiki/index.php?title=Wiki_Redesign.css&action=raw&ctype=text/css'); */ | ||
html:root { | |||
/* top left / behind */ | |||
--background-image: url('/images/d/d3/Neon_Prime_screenshot_01.jpg'); | |||
--scrollbar-color: #706F6D #191715; | |||
/* main body */ | |||
--background-color-base: #213342; | |||
--background-color-base-border: #080504; | |||
--background-color-base-subtle: #0e1c29; | |||
--background-color-base-subtle-border: var(--background-color-base-border); | |||
--background-color-light: var(--background-color-base); | |||
--background-color-base-2: oklch(from var(--background-color-base) calc(l + 0.07) c h); | |||
--background-color-base-3: oklch(from var(--background-color-base) calc(l + 0.12) c h); | |||
--background-color-base-4: oklch(from var(--background-color-base) calc(l + 0.17) c h); | |||
--background-color-base-5: oklch(from var(--background-color-base) calc(l + 0.22) c h); | |||
--background-color-neutral-subtle: var(--background-color-base-2); | |||
--background-color-neutral: #0c202d; | |||
--background-color-interactive-subtle: var(--background-color-neutral); | |||
--background-color-interactive: #45838b; | |||
--background-color-disabled: oklch(from var(--background-color-base) calc(l + 0.03) c h); | |||
/* borders */ | |||
--border-color-base: #45838b; | |||
--border-color-subtle: #45838b; | |||
--border-color-muted: #45838b; | |||
--border-color-disabled: #45838b; | |||
/* text */ | |||
--color-base: oklch(0.97 0.03 82.14); | |||
--color-base--hover: var(--color-base); | |||
--color-emphasized: white; | |||
--color-subtle: #9aa4aa; | |||
--color-notice: var(--color-subtle); | |||
/* links */ | |||
--link-color: #0ae6f6; | |||
--link-color--hover: oklch(from var(--link-color) calc(l - 0.22) c h); | |||
--alt-link-color: #fff4dfcc; | |||
--color-progressive: var(--link-color); | |||
--color-progressive--hover: var(--link-color); | |||
--color-progressive--active: var(--link-color); | |||
--color-progressive--focus: #72a1ff; | |||
--background-color-progressive: var(--color-progressive); | |||
--background-color-progressive-subtle: #45838b; | |||
--background-color-progressive-subtle--hover: oklch(from var(--color-progressive) calc(l - 0.42) c h); | |||
--border-color-progressive--hover: oklch(from var(--color-progressive) calc(l - 0.42) c h); | |||
--background-color-progressive--hover: oklch(from var(--color-progressive) calc(l - 0.3) c h); | |||
--background-color-progressive--active: oklch(from var(--color-progressive) calc(l - 0.35) c h); | |||
--border-color-progressive: oklch(from var(--color-progressive) calc(l - 0.45) c h); | |||
--background-color-progressive-subtle--active: var(--background-color-progressive--active); | |||
--border-color-progressive-subtle--active: var(--background-color-progressive--active); | |||
/* semantic colors */ | |||
--color-content-added: #009c00; | |||
--color-destructive: #e64835; | |||
--color-destructive-subtle: #3e0000; | |||
--background-color-error-subtle: var(--color-destructive-subtle); | |||
--border-color-error: var(--color-destructive); | |||
--color-destructive--visited--active: #eb8585; | |||
--background-color-warning-subtle: #3e341a; | |||
--border-color-warning: #ab7f2a; | |||
--background-color-content-removed: #CC0000; | |||
--background-color-content-added: #4ea8f3; | |||
--background-color-success-subtle: var(--background-color-base-subtle); | |||
--background-color-notice-subtle: var(--background-color-base-subtle); | |||
} | |||
/* Global body scope to increase specificity */ | |||
body { | |||
background-color: var(--background-color-base); | |||
background-image: var(--background-image); | |||
scrollbar-color: var(--scrollbar-color); | |||
} | |||
/* Logo */ | |||
.mw-wiki-logo { | |||
background-image: var(--wiki-logo); | |||
background-size: contain; | |||
filter: grayscale(100%); | |||
} | |||
/* Headings */ | |||
body .mw-body h1, | |||
body .mw-body-content h2, | |||
body .mw-page-title-main { | |||
font-family: 'Exo', 'Open Sans', 'Retail Demo', 'PT Serif', 'Palatino', 'Georgia', serif !important; | |||
font-weight: bold; | |||
} | |||
/* Discord button */ | |||
body #n-Discord a { | |||
background-color: #004C8A; | |||
border-color: #006BC2 #001e36 #001e36 #006BC2; | |||
} | |||
/* ===== Rotatable Model Viewer ===== */ | /* ===== Rotatable Model Viewer ===== */ | ||