MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
(22 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* | /* === Site-wide black background with repeating top banner === */ | ||
/* QME Wiki Responsive Two-Column Layout | |||
/* Fixed top banner using a working MediaWiki image path */ | |||
.qme-top-banner { | |||
background-image: url("/wiki/Special:Redirect/file/Top-gradient.png"); | |||
background-repeat: repeat-x; | |||
background-size: 300px 15px; | |||
height: 15px; | |||
width: 100%; | |||
position: fixed; | |||
top: 0; | |||
left: 0; | |||
z-index: 9999; | |||
} | |||
/* Body styling */ | |||
body { | |||
background-color: #000 !important; | |||
color: #fff !important; | |||
margin: 0; | |||
} | |||
/* Add top padding only inside the main content wrapper */ | |||
.mw-body-content { | |||
padding-top: 15px; | |||
} | |||
/* Remove default spacing from base divs */ | |||
#mw-page-base, | |||
#mw-head-base { | |||
margin: 0; | |||
padding: 0; | |||
background: transparent !important; | |||
height: 0 !important; | |||
} | |||
/* === QME Wiki Responsive Two-Column Layout === */ | |||
.qme-flex-wrapper { | .qme-flex-wrapper { | ||
display: flex; | display: flex; | ||
Line 9: | Line 44: | ||
} | } | ||
/* Base styles for each column */ | |||
.qme-column { | .qme-column { | ||
flex: 1 1 100%; | flex: 1 1 100%; | ||
min-height: 600px; | min-height: 600px; | ||
padding: 12px; | padding: 12px; | ||
border: 1px solid #0000B6; | border: 1px solid #0000B6; /* your aqua green border */ | ||
background: #fcfcfc; | background: #fcfcfc; | ||
color: #000; | color: #000; | ||
font-size: 16px; | |||
line-height: 1.5; | |||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
justify-content: space-between; | justify-content: space-between; | ||
position: relative; /* make sure content is above fixed banner */ | |||
z-index: 1; | |||
} | |||
/* ✅ Force consistent font size in all nested elements */ | |||
.qme-column * { | |||
font-size: 16px !important; | |||
line-height: 1.5 !important; | |||
box-sizing: border-box; | |||
} | |||
/* ✅ Specifically target lists for mobile consistency */ | |||
.qme-column ul { | |||
padding-left: 1.2em; | |||
margin-bottom: 1em; | |||
list-style-type: disc; | |||
} | |||
.qme-column ul li { | |||
margin-bottom: 0.5em; | |||
} | } | ||
/* | /* Responsive: switch to 2-column layout at tablet width */ | ||
@media (min-width: 600px) { | @media (min-width: 600px) { | ||
.qme-column { | .qme-column { | ||
flex: 1 1 48%; | flex: 1 1 48%; | ||
} | } | ||
} | |||
/* === Echo Notification Badges (Alerts & Notices) === */ | |||
.mw-echo-notifications-badge, | |||
.mw-echo-notifications-badge-all-read { | |||
background-color: #83FCDB !important; /* bright aqua green */ | |||
color: #000 !important; /* black text for contrast */ | |||
border: 1px solid #333 !important; | |||
padding: 2px 6px !important; | |||
border-radius: 12px !important; | |||
font-weight: bold !important; | |||
text-shadow: none !important; | |||
} | |||
.mw-echo-notifications-badge:hover { | |||
background-color: #6bd1c9 !important; /* slightly darker on hover */ | |||
color: #000 !important; | |||
} | |||
/* ===== Ace Editor Line Numbers Fix ===== */ | |||
.ace_gutter { | |||
background-color: #ffffff !important; /* White gutter background */ | |||
border-right: 1px solid #ccc !important; | |||
} | |||
.ace_gutter-cell, | |||
.ace_gutter-cell[style] { | |||
color: #000000 !important; /* Black line numbers */ | |||
background-color: transparent !important; | |||
user-select: none !important; | |||
} | |||
/* ===== Admin Edit Warning Box Fix ===== */ | |||
.mw-editinginterface { | |||
background-color: #ffcccc !important; /* Light pink background */ | |||
color: #660000 !important; /* Dark red text */ | |||
border: 1px solid #cc0000 !important; | |||
padding: 1em !important; | |||
font-weight: bold !important; | |||
border-radius: 4px !important; | |||
} | |||
.mw-editinginterface strong { | |||
color: #990000 !important; | |||
} | } |
Latest revision as of 16:42, 14 July 2025
/* === Site-wide black background with repeating top banner === */
/* Fixed top banner using a working MediaWiki image path */
.qme-top-banner {
background-image: url("/wiki/Special:Redirect/file/Top-gradient.png");
background-repeat: repeat-x;
background-size: 300px 15px;
height: 15px;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
/* Body styling */
body {
background-color: #000 !important;
color: #fff !important;
margin: 0;
}
/* Add top padding only inside the main content wrapper */
.mw-body-content {
padding-top: 15px;
}
/* Remove default spacing from base divs */
#mw-page-base,
#mw-head-base {
margin: 0;
padding: 0;
background: transparent !important;
height: 0 !important;
}
/* === QME Wiki Responsive Two-Column Layout === */
.qme-flex-wrapper {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin: 0 -8px;
align-items: stretch;
}
/* Base styles for each column */
.qme-column {
flex: 1 1 100%;
min-height: 600px;
padding: 12px;
border: 1px solid #0000B6; /* your aqua green border */
background: #fcfcfc;
color: #000;
font-size: 16px;
line-height: 1.5;
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative; /* make sure content is above fixed banner */
z-index: 1;
}
/* ✅ Force consistent font size in all nested elements */
.qme-column * {
font-size: 16px !important;
line-height: 1.5 !important;
box-sizing: border-box;
}
/* ✅ Specifically target lists for mobile consistency */
.qme-column ul {
padding-left: 1.2em;
margin-bottom: 1em;
list-style-type: disc;
}
.qme-column ul li {
margin-bottom: 0.5em;
}
/* Responsive: switch to 2-column layout at tablet width */
@media (min-width: 600px) {
.qme-column {
flex: 1 1 48%;
}
}
/* === Echo Notification Badges (Alerts & Notices) === */
.mw-echo-notifications-badge,
.mw-echo-notifications-badge-all-read {
background-color: #83FCDB !important; /* bright aqua green */
color: #000 !important; /* black text for contrast */
border: 1px solid #333 !important;
padding: 2px 6px !important;
border-radius: 12px !important;
font-weight: bold !important;
text-shadow: none !important;
}
.mw-echo-notifications-badge:hover {
background-color: #6bd1c9 !important; /* slightly darker on hover */
color: #000 !important;
}
/* ===== Ace Editor Line Numbers Fix ===== */
.ace_gutter {
background-color: #ffffff !important; /* White gutter background */
border-right: 1px solid #ccc !important;
}
.ace_gutter-cell,
.ace_gutter-cell[style] {
color: #000000 !important; /* Black line numbers */
background-color: transparent !important;
user-select: none !important;
}
/* ===== Admin Edit Warning Box Fix ===== */
.mw-editinginterface {
background-color: #ffcccc !important; /* Light pink background */
color: #660000 !important; /* Dark red text */
border: 1px solid #cc0000 !important;
padding: 1em !important;
font-weight: bold !important;
border-radius: 4px !important;
}
.mw-editinginterface strong {
color: #990000 !important;
}
By using this site, you agree to the Terms of Use. © 1996–2025 The Quincy Examiner / MTB. All rights reserved.