MediaWiki:Common.css: Difference between revisions
Dragon 12dk (talk | contribs) No edit summary |
Dragon 12dk (talk | contribs) No edit summary |
||
| (21 intermediate revisions by the same user not shown) | |||
| Line 3: | Line 3: | ||
*/ | */ | ||
/* | /* Template Infobox Stuff */ | ||
.vc- | |||
background: # | .ib-anthem-label{ | ||
display:block; | |||
font-weight:700; | |||
margin: 0 0 .25em 0; | |||
} | |||
.ib-anthem-media{ | |||
display:block; | |||
} | |||
/* Safety: keep aspect ratio */ | |||
table.infobox.ib-country.vcard > tbody > tr:nth-child(2) > td img { | |||
height: auto !important; | |||
max-width: none !important; | |||
} | |||
/* Flag: td > div > div:nth-child(1) ... img */ | |||
table.infobox.ib-country.vcard > tbody > tr:nth-child(2) > td > div > div:nth-child(1) img { | |||
width: 125px !important; | |||
} | |||
/* Coat of arms: td > div > div:nth-child(2) ... img */ | |||
table.infobox.ib-country.vcard > tbody > tr:nth-child(2) > td > div > div:nth-child(2) img { | |||
width: 85px !important; | |||
} | |||
/* ============================= */ | |||
/* EMBED MODE – HIDE ALL CHROME */ | |||
/* ============================= */ | |||
/* Hide edit section links in embed mode */ | |||
.vc-embed-mode .mw-editsection { | |||
display: none !important; | |||
} | |||
/* Embed mode: transparent page background */ | |||
.vc-embed-mode { | |||
background: transparent !important; | |||
} | |||
/* Remove legacy Vector body border in embed mode */ | |||
.vc-embed-mode .mw-body { | |||
border: 0 !important; | |||
box-shadow: none !important; /* just in case */ | |||
} | |||
.vc-embed-mode .mw-body { | |||
background: transparent !important; | |||
} | |||
/* Legacy Vector sidebar + header */ | |||
.vc-embed-mode #mw-panel, | |||
.vc-embed-mode #mw-navigation, | |||
.vc-embed-mode #mw-head, | |||
.vc-embed-mode #p-personal, | |||
.vc-embed-mode #p-search, | |||
/* Legacy Vector: remove the empty top scaffolding bars */ | |||
.vc-embed-mode #mw-page-base, | |||
.vc-embed-mode #mw-head-base { | |||
display: none !important; | |||
} | |||
/* Hide page indicators (lock/featured/etc.) in embed mode */ | |||
.vc-embed-mode .mw-indicators { | |||
display: none !important; | |||
} | |||
/* Legacy Vector: remove extra top spacing after hiding header */ | |||
.vc-embed-mode #content { | |||
margin-top: 0 !important; | |||
} | |||
/* Vector 2022 sidebar + header */ | |||
.vc-embed-mode .vector-sidebar, | |||
.vc-embed-mode .vector-header-container, | |||
.vc-embed-mode .vector-sticky-header, | |||
.vc-embed-mode .vector-user-links, | |||
.vc-embed-mode .vector-search-box, | |||
/* Shared elements */ | |||
.vc-embed-mode #footer, | |||
.vc-embed-mode #siteSub, | |||
.vc-embed-mode #contentSub, | |||
.vc-embed-mode #firstHeading { | |||
display: none !important; | |||
} | |||
/* ============================= */ | |||
/* EMBED MODE – FULL WIDTH */ | |||
/* ============================= */ | |||
.vc-embed-mode .mw-page-container, | |||
.vc-embed-mode .mw-content-container, | |||
.vc-embed-mode #content, | |||
.vc-embed-mode .mw-parser-output { | |||
max-width: none !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
/* STAFF PAGE BELOW */ | |||
/* grid for lists of staff cards inside a role section */ | |||
.vc-card-grid { | |||
display: grid; | |||
gap: 16px; | |||
margin: 10px 0 22px 0; | |||
} | } | ||
/* | /* two cards side-by-side */ | ||
.vc- | .vc-card-grid--2 { | ||
grid-template-columns: 1fr 1fr; | |||
} | } | ||
/* | /* keep it 1-column on small screens */ | ||
.vc- | @media (max-width: 900px) { | ||
.vc-card-grid--2 { | |||
grid-template-columns: 1fr; | |||
} | |||
} | } | ||
/* | /* IMPORTANT: when cards are in a grid, remove the card's bottom margin */ | ||
.vc- | .vc-card-grid .vc-staff-card { | ||
margin-bottom: 0; | |||
} | } | ||
.vc- | /* Prefer: opt out of DarkMode transforms */ | ||
html.client-darkmode .vc-staff-page.mw-no-invert, | |||
html.client-darkmode .vc-staff-page.mw-no-invert * { | |||
filter: none !important; | |||
mix-blend-mode: normal !important; | |||
} | } | ||
.vc- | /* Fallback: if DarkMode is inverting a parent container, cancel it */ | ||
html.client-darkmode #content .vc-staff-page.mw-no-invert { | |||
filter: invert(1) hue-rotate(180deg) !important; | |||
} | } | ||
/* | /* ===== Staff page wrapper ===== */ | ||
.vc-staff-page { | .vc-staff-page { | ||
max-width: 1200px; | max-width: 1200px; | ||
margin: 0 auto; | margin: 0 auto; | ||
background: #060606; | |||
padding: 22px 22px 30px 22px; | |||
border-radius: 12px; | |||
border: 1px solid #202020; | |||
} | |||
/* Headings inside the wrapper */ | |||
.vc-staff-page h2, | |||
.vc-staff-page h3, | |||
.vc-staff-page h4 { | |||
color: #f2f2f2 !important; | |||
} | |||
/* Section dividers (Founder/Staff) */ | |||
.vc-staff-page h2 { | |||
border-bottom: 1px solid #2a2a2a !important; | |||
padding-bottom: 8px; | |||
margin-bottom: 18px; | |||
} | } | ||
/* | /* ===== Grid ===== */ | ||
.vc-staff-grid { | .vc-staff-grid { | ||
display: grid; | display: grid; | ||
grid-template-columns: 1fr 1fr; | |||
gap: 18px 28px; | gap: 18px 28px; | ||
margin: 14px 0 26px 0; | margin: 14px 0 26px 0; | ||
} | } | ||
@media (max-width: 900px) { | @media (max-width: 900px) { | ||
.vc-staff-grid | .vc-staff-grid { | ||
grid-template-columns: 1fr; | grid-template-columns: 1fr; | ||
} | } | ||
} | } | ||
.vc-staff-col { | .vc-staff-col { | ||
min-width: 0; | min-width: 0; | ||
} | } | ||
/* | /* ===== Column + role labels ===== */ | ||
.vc-col-title { | |||
font-size: 24px; | |||
font-weight: 900; | |||
color: #ffffff; | |||
margin: 0 0 18px 0; | |||
text-align: center; | |||
letter-spacing: .6px; | |||
/* keep this subtle; remove if you want it less neon */ | |||
text-shadow: 0 0 10px rgba(51,255,0,0.18); | |||
} | |||
.vc-role-title { | |||
font-size: 13px; | |||
font-weight: 800; | |||
color: #e6e6e6 !important; | |||
letter-spacing: .6px; | |||
text-transform: uppercase; | |||
margin: 22px 0 10px 0; | |||
opacity: 0.9; | |||
} | |||
/* ===== Staff card ===== */ | |||
.vc-staff-card { | .vc-staff-card { | ||
display: flex; | display: flex; | ||
| Line 79: | Line 217: | ||
padding: 14px 16px; | padding: 14px 16px; | ||
border-radius: 10px; | border-radius: 10px; | ||
background: linear-gradient(90deg, # | |||
border: 1px solid # | background: linear-gradient(90deg, #121212 0%, #181818 60%, #121212 100%); | ||
border: 1px solid #2a2a2a; | |||
box-shadow: 0 8px 24px rgba(0,0,0,.25); | box-shadow: 0 8px 24px rgba(0,0,0,.25); | ||
min-height: 92px; | min-height: 92px; | ||
margin-bottom: 16px; /* gives breathing room between cards */ | |||
} | } | ||
.vc-staff-card:hover { | .vc-staff-card:hover { | ||
border-color: #33ff00; | border-color: #33ff00; | ||
box-shadow: 0 0 0 1px rgba(51,255,0,. | box-shadow: 0 0 0 1px rgba(51,255,0,.22), | ||
0 8px 20px rgba(0,0,0,.45); | |||
} | } | ||
| Line 108: | Line 250: | ||
/* Text */ | /* Text */ | ||
.vc-staff-info { line-height: 1.15; } | .vc-staff-info { line-height: 1.15; } | ||
.vc-staff-name a { text-decoration: none; font-weight: | .vc-staff-name a { text-decoration: none; font-weight: 750; } | ||
.vc-staff-title { color: #cfcfcf; font-size: 12px; margin-top: 4px; } | .vc-staff-title { color: #cfcfcf; font-size: 12px; margin-top: 4px; } | ||
| Line 118: | Line 260: | ||
.vc-role-programmer .vc-staff-name a { color: #00e5ff; } | .vc-role-programmer .vc-staff-name a { color: #00e5ff; } | ||
.vc-role-builder .vc-staff-name a { color: #ffb020; } | .vc-role-builder .vc-staff-name a { color: #ffb020; } | ||
/* ===== VindexCraft Rules Styling (High-Color Sections) ===== */ | /* ===== VindexCraft Rules Styling (High-Color Sections) ===== */ | ||