Jump to content

MediaWiki:Common.css

From VassarWiki
Revision as of 23:18, 13 April 2026 by EdwardNWM (talk | contribs) (subtler variable)

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)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* CSS placed here will be applied to all skins */

/* light mode */
:root, .skin-theme-clientpref-day {
    --vw-bg-page:       #f8f9fa;
    --vw-bg-surface:    #ffffff;
    --vw-bg-subtle:     #eaecf0;
	--vw-bg-subtler:    #f8f9fa;
    --vw-accent:        #8B3347;
    --vw-accent-subtle: #f5dde2;
}

/* dark mode */
.skin-theme-clientpref-night {
    --vw-bg-page:       #101418;
    --vw-bg-surface:    #1e2227;
    --vw-bg-subtle:     #2a2f36;
	--vw-bg-subtler:    #101418;
    --vw-accent:        #F2A0B2; 
    --vw-accent-subtle: #3d1e26;
}
@media ( prefers-color-scheme: dark ) {
    .skin-theme-clientpref-os {
        --vw-bg-page:       #101418;
        --vw-bg-surface:    #1e2227;
        --vw-bg-subtle:     #2a2f36;
    	--vw-bg-subtler:    #101418;
        --vw-accent:        #F2A0B2;
        --vw-accent-subtle: #3d1e26;
    }
}

#footer-info li, #footer-places li {
    font-size: 14px;
}

.mw-logo-wordmark {
    font-size: 1.5rem;
    color: maroon;
}

.hatnote {
    font-style: italic;
    padding-left: 1.5em;
    margin-bottom: 0.5em;
}

.infobox {
    width: 300px;
    float: right;
    margin: 0 0 1em 1em;
}
@media (max-width: 480px) {
    .infobox {
        width: 100% !important;
        float: none !important;
        margin: 0 0 1em 0;
    }
}

.page-Main_Page .firstHeading { 
	display: none; 
}

#welcome-box {
	border: 2px solid var(--vw-accent);
	background-color: var(--vw-accent-subtle);
}
#welcome-box h1 { 
	border-bottom-color: var(--vw-accent); 
	width: 50%;
}

#events-box, #bulletin-box {
    flex: 1;
    min-width: 280px;
}
#events-box h2 { border-bottom-color: #627ac1; }
#bulletin-box h2 { border-bottom-color: #62c1aa; }

@media (max-width: 600px) {
    #welcome-box h1 { width: 100%; }
}

.documentation .mw-editsection {
    display: none;
}