MediaWiki:Vector-medium.css: Difference between revisions
 Cdjensen94 (talk | contribs) |
Cdjensen94 (talk | contribs) |
||
| (8 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* 🌊 Medium Theme - Header */ | |||
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header { | |||
background-color: #536872; /* Slate */ | |||
color: #D8D8D8; /* Dove Gray text */ | |||
border-bottom: 3px solid #006D77; /* Deep Teal underline */ | |||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); | |||
padding: 10px; | |||
} | |||
/* 🔗 Links */ | |||
.mw-header a { | |||
color: #007BA7; /* Cerulean */ | |||
text-decoration: none; | |||
} | |||
.mw-header a:hover { | |||
color: #006D77; /* Deep Teal */ | |||
text-decoration: underline; | |||
} | |||
/* 🟡 Logo */ | |||
.mw-header .mw-logo-wordmark { | |||
font-family: 'Metamorphous', cursive; | |||
color: #007BA7; | |||
font-size: 1.8em; | |||
} | |||
/* 🔄 Responsive */ | |||
@media (max-width: 768px) { | |||
.mw-header { | |||
flex-direction: column; | |||
align-items: flex-start; | |||
} | |||
} | |||
/* 🌤️ Medium Theme */ | |||
.mw-page-container { | |||
background-color: #dfe3e6; /* Slate */ | |||
color: #002b5c; /* Deep Navy */ | |||
border: 1px solid #a8b2bb; | |||
} | |||
.mw-page-container a { | |||
color: #1f77b4; /* Soft Blue */ | |||
} | |||
.mw-page-container a:hover { | |||
color: #0056b3; /* Darker Blue */ | |||
text-decoration: underline; | |||
} | |||
.mw-page-container h1, | |||
.mw-page-container h2, | |||
.mw-page-container h3 { | |||
color: #DAA520; /* Gold for headers */ | |||
} | |||
.mw-page-container .mw-header, | |||
.mw-page-container .mw-footer { | |||
background-color: #c5cbd3; /* Shale */ | |||
color: #002b5c; | |||
} | |||
/* 🌌 Base Variables for Medium Theme */ | /* 🌌 Base Variables for Medium Theme */ | ||
:root.skin-vector, .notheme { | :root, .skin-vector, .notheme { | ||
--color-deep-slate: #2F4F4F; | --color-deep-slate: #2F4F4F; | ||
--color-slate: #708090; | --color-slate: #708090; | ||
| Line 41: | Line 104: | ||
/* 📊 Sidebar */ | /* 📊 Sidebar */ | ||
.mw-panel { | |||
background-color: var(--color-medium-slate); | background-color: var(--color-medium-slate); | ||
color: var(--color-dove-gray); | color: var(--color-dove-gray); | ||
} | } | ||
.mw-panel a { | |||
color: var(--color-dark-teal); | color: var(--color-dark-teal); | ||
} | } | ||
.mw-panel a:hover { | |||
color: var(--color-cerulean); | color: var(--color-cerulean); | ||
} | } | ||
| Line 250: | Line 313: | ||
flex-direction: column; | flex-direction: column; | ||
} | } | ||
} | |||
nav { | |||
display: block; /* Ensure it behaves as a block element */ | |||
/*margin: 10px 0; Add vertical spacing */ | |||
padding-left: 10px; | |||
margin-top: 10px; /* Add vertical spacing */ | |||
border-radius: 5px; /* Optional: rounded corners */ | |||
} | |||
/* Adjust navigation links inside nav */ | |||
nav a { | |||
margin-right: 10px; /* Space between links */ | |||
text-decoration: none; /* Remove underlines */ | |||
color: #007BFF; /* Link color */ | |||
} | |||
nav a:hover { | |||
text-decoration: underline; /* Hover effect */ | |||
} | } | ||