MediaWiki:Common.css: Difference between revisions
m bulletin-box fix |
making colors brighter in light mode |
||
| (32 intermediate revisions by the same user not shown) | |||
| Line 5: | Line 5: | ||
--vw-bg-page: #f8f9fa; | --vw-bg-page: #f8f9fa; | ||
--vw-bg-surface: #ffffff; | --vw-bg-surface: #ffffff; | ||
--vw-bg-subtle: # | --vw-bg-subtle: #f8f9fa; | ||
--vw-bg- | --vw-bg-heading: #EAECF0; | ||
--vw-accent: # | --vw-text-subtle: #555555; | ||
--vw-border: #A2A9B1; | |||
--vw-accent: #af3350; | |||
--vw-accent-subtle: #f5dde2; | --vw-accent-subtle: #f5dde2; | ||
--vw-gold: # | --vw-gold: #b7a054; | ||
--vw-gold-subtle: #f4f0dc; | --vw-gold-subtle: #f4f0dc; | ||
--vw-green: # | --vw-green: #6bb754; | ||
--vw-green-subtle: #e0f4dc; | --vw-green-subtle: #e0f4dc; | ||
--vw-teal: #338a76; | --vw-teal: #338a76; | ||
--vw-teal-subtle: #dcf4f0; | --vw-teal-subtle: #dcf4f0; | ||
--vw-blue: # | --vw-blue: #546bb7; | ||
--vw-blue-subtle: #dce0f4; | --vw-blue-subtle: #dce0f4; | ||
--vw-violet: #76338A; | --vw-violet: #76338A; | ||
| Line 27: | Line 30: | ||
--vw-bg-surface: #1e2227; | --vw-bg-surface: #1e2227; | ||
--vw-bg-subtle: #2a2f36; | --vw-bg-subtle: #2a2f36; | ||
--vw-bg- | --vw-bg-heading: #27292D; | ||
--vw-accent: # | --vw-text-subtle: #BBBBBB; | ||
--vw-border: #72777D; | |||
--vw-accent: #ad6171; | |||
--vw-accent-subtle: #3d1e26; | --vw-accent-subtle: #3d1e26; | ||
--vw-gold: # | --vw-gold: #ad9c61; | ||
--vw-gold-subtle: #3e351e; | --vw-gold-subtle: #3e351e; | ||
--vw-green: # | --vw-green: #74ad61; | ||
--vw-green-subtle: #263e1e; | --vw-green-subtle: #263e1e; | ||
--vw-teal: # | --vw-teal: #61ad9b; | ||
--vw-teal-subtle: #1e3e35; | --vw-teal-subtle: #1e3e35; | ||
--vw-blue: # | --vw-blue: #6171ad; | ||
--vw-blue-subtle: #1e263e; | --vw-blue-subtle: #1e263e; | ||
--vw-violet: # | --vw-violet: #9c61ad; | ||
--vw-violet-subtle: #351e3e; | --vw-violet-subtle: #351e3e; | ||
} | } | ||
| Line 47: | Line 53: | ||
--vw-bg-surface: #1e2227; | --vw-bg-surface: #1e2227; | ||
--vw-bg-subtle: #2a2f36; | --vw-bg-subtle: #2a2f36; | ||
--vw-bg- | --vw-bg-heading: #27292D; | ||
--vw-text-subtle: #BBBBBB; | |||
--vw-border: #72777D; | |||
--vw-accent: #F2A0B2; | --vw-accent: #F2A0B2; | ||
--vw-accent-subtle: #3d1e26; | --vw-accent-subtle: #3d1e26; | ||
--vw-gold: # | --vw-gold: #ad9c61; | ||
--vw-gold-subtle: #3e351e; | --vw-gold-subtle: #3e351e; | ||
--vw-green: # | --vw-green: #74ad61; | ||
--vw-green-subtle: #263e1e; | --vw-green-subtle: #263e1e; | ||
--vw-teal: # | --vw-teal: #61ad9b; | ||
--vw-teal-subtle: #1e3e35; | --vw-teal-subtle: #1e3e35; | ||
--vw-blue: # | --vw-blue: #6171ad; | ||
--vw-blue-subtle: #1e263e; | --vw-blue-subtle: #1e263e; | ||
--vw-violet: # | --vw-violet: #9c61ad; | ||
--vw-violet-subtle: #351e3e; | --vw-violet-subtle: #351e3e; | ||
} | } | ||
} | |||
.skin-theme-clientpref-night .mw-logo-icon { | |||
filter: invert(1); | |||
} | } | ||
@media ( prefers-color-scheme: dark ) { | |||
.skin-theme-clientpref-os .mw-logo-icon { | |||
filter: invert(1); | |||
} | |||
} | |||
#footer-info li, #footer-places li { | #footer-info li, #footer-places li { | ||
| Line 70: | Line 90: | ||
.mw-logo-wordmark { | .mw-logo-wordmark { | ||
font-size: 1.5rem; | font-size: 1.5rem; | ||
color: | color: var(--vw-accent); | ||
} | } | ||
| Line 80: | Line 100: | ||
.infobox { | .infobox { | ||
float: right; | float: right; | ||
margin: 0 0 1em 1em; | margin: 0 0 1em 1em; | ||
} | } | ||
@media (max-width: | @media (max-width: 600px) { | ||
.infobox { | .infobox { | ||
width: 100% !important; | width: 100% !important; | ||
float: none !important; | float: none !important; | ||
margin: 0 0 1em 0; | margin: 0 0 1em 0; | ||
box-sizing: border-box; | |||
} | |||
.infobox img { | |||
max-width: 100% !important; | |||
overflow: hidden; | |||
} | } | ||
} | |||
@media (min-width: 601px){ | |||
.infobox{ | |||
max-width: 300px !important; | |||
} | |||
} | } | ||
| Line 102: | Line 131: | ||
#welcome-box h1 { | #welcome-box h1 { | ||
border-bottom-color: var(--vw-accent); | border-bottom-color: var(--vw-accent); | ||
width: | width: min(100%, 400px); | ||
} | } | ||
#events-box, # | #events-box, #feature-box { | ||
flex: 1; | flex: 1; | ||
min-width: 280px; | min-width: 280px; | ||
| Line 120: | Line 149: | ||
} | } | ||
#bulletin-box h2 { border-bottom-color: var(--vw-green); } | #bulletin-box h2 { border-bottom-color: var(--vw-green); } | ||
#feature-box { | |||
border: 2px solid var(--vw-gold); | |||
background-color: var(--vw-gold-subtle); | |||
} | |||
#feature-box h2 { border-bottom-color: var(--vw-gold); } | |||
.documentation .mw-editsection:not(.documentation-edit) { | |||
display: none; | |||
} | } | ||
. | .poster-container { | ||
display:flex; flex-wrap:wrap; gap:0.4em; | |||
} | } | ||