MediaWiki:Common.css: Difference between revisions
From EQOA Sandstorm Wiki
Jump to navigationJump to search
RenodorDev (talk | contribs) No edit summary |
RenodorDev (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
/* ============================================================ | /* ============================================================ | ||
GLOBAL | EQOA: Sandstorm WIKI THEME ΓÇö OPTION D (Classic EQ UI Palette) | ||
============================================================ */ | Applies to ALL pages, ALL namespaces, ALL skins (MonoBook primary) | ||
============================================================ */ | |||
:root { | |||
/* BASE */ | |||
--midnight: #0F1626; /* Deep EQ-style indigo */ | |||
--sand: #B9C4D1; /* Soft blue-gray parchment */ | |||
/* ACCENTS */ | |||
--gold: #E3B44A; /* Classic EverQuest gold */ | |||
--sky: #6DA5E7; /* EQ link blue */ | |||
/* STATUS COLORS */ | |||
--evergreen: #3E6B52; /* success */ | |||
--ember: #9A2E1E; /* danger */ | |||
/* BOX HEADER ACCENT */ | |||
--box-header: #1C2B44; /* EQ-style header blue */ | |||
} | |||
/* ============================================================ | |||
GLOBAL PAGE BACKGROUND & TEXT | |||
============================================================ */ | |||
body { | |||
background: var(--midnight) !important; | |||
color: var(--sand) !important; | |||
font-family: "Georgia", "Times New Roman", serif; | |||
} | |||
#content, | #content, | ||
# | #bodyContent, | ||
#mw- | #mw-content-text { | ||
color: var(--sand) !important; | |||
color: | |||
} | } | ||
/* | /* ============================================================ | ||
HEADINGS (GLOBAL OVERRIDES) | |||
============================================================ */ | |||
h1, h2, h3, h4, h5, h6, | h1, h2, h3, h4, h5, h6, | ||
#firstHeading, | #firstHeading, .mw-first-heading, | ||
.mw-body h1, .mw-body h2, .mw-body h3, | .mw-body h1, .mw-body h2, .mw-body h3, | ||
.mw-body h4, .mw-body h5, .mw-body h6 { | .mw-body h4, .mw-body h5, .mw-body h6 { | ||
color: | color: var(--gold) !important; | ||
font-family: "Georgia", "Times New Roman", serif !important; | |||
font-weight: 700 !important; | font-weight: 700 !important; | ||
background: # | border: none !important; | ||
border: 1px solid # | } | ||
padding: | |||
/* Section header underline */ | |||
.mw-parser-output > h2 { | |||
border-bottom: 1px solid rgba(255,255,255,0.15) !important; | |||
} | |||
/* ============================================================ | |||
LINKS | |||
============================================================ */ | |||
a { | |||
color: var(--sky) !important; | |||
} | |||
a:visited { | |||
color: #5E8BC0 !important; | |||
} | |||
a:hover { | |||
color: var(--gold) !important; | |||
} | |||
/* ============================================================ | |||
TABLES, ROWS, LISTS | |||
============================================================ */ | |||
table, | |||
.wikitable { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
} | |||
.wikitable th { | |||
background: var(--box-header) !important; | |||
color: var(--gold) !important; | |||
} | |||
.wikitable td { | |||
color: var(--sand) !important; | |||
border-color: var(--gold) !important; | |||
} | |||
/* Alternating row accent */ | |||
tr:nth-child(even) { | |||
background: #121E30 !important; | |||
} | |||
/* ============================================================ | |||
CUSTOM BOXES / PORTALS / HOMEPAGE SECTIONS | |||
============================================================ */ | |||
.portal, | |||
.navbox, | |||
.multicol, | |||
.mainpage-box, | |||
.mainpage-header, | |||
div.center-box, | |||
div.portal, | |||
#mp-topbanner, | |||
#mp-left, | |||
#mp-right { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
color: var(--sand) !important; | |||
} | |||
/* Box headers */ | |||
.portal .portal-header, | |||
.mainpage-header, | |||
div.center-box .header, | |||
h2.box-header, | |||
.box-header { | |||
background: var(--box-header) !important; | |||
padding: 6px 10px !important; | |||
color: var(--gold) !important; | |||
font-size: 1.25em !important; | |||
text-align: center; | |||
border-bottom: 1px solid var(--gold) !important; | |||
} | |||
/* ============================================================ | |||
SIDEBAR (MonoBook) | |||
============================================================ */ | |||
#p-logo { | |||
background: transparent !important; | |||
} | } | ||
#p-navigation, | |||
#p-interaction, | |||
#p-tb, | |||
#p-search { | |||
background: #0A1420 !important; | background: #0A1420 !important; | ||
border: 1px solid # | border: 1px solid var(--gold) !important; | ||
color: # | color: var(--sand) !important; | ||
} | |||
#p-navigation h3, | |||
#p-interaction h3, | |||
#p-tb h3, | |||
#p-search h3 { | |||
background: var(--box-header) !important; | |||
color: var(--gold) !important; | |||
padding: 4px 6px !important; | |||
} | |||
/* ============================================================ | |||
INPUTS / SEARCH BOX | |||
============================================================ */ | |||
input, | |||
textarea { | |||
background: #142233 !important; | |||
color: var(--sand) !important; | |||
border: 1px solid var(--gold) !important; | |||
} | |||
/* ============================================================ | |||
NOTICES / TEMPLATES | |||
============================================================ */ | |||
.success, | |||
.notice-success { | |||
background: var(--evergreen) !important; | |||
color: #DFF2E4 !important; | |||
} | |||
.warning, | |||
.notice-warning { | |||
background: #3F2E00 !important; | |||
color: #FFDD8A !important; | |||
} | |||
.error, | |||
.notice-error { | |||
background: var(--ember) !important; | |||
color: #F9D0C8 !important; | |||
} | |||
/* ============================================================ | |||
FOOTER | |||
============================================================ */ | |||
#footer { | |||
background: #0A1420 !important; | |||
color: var(--sand) !important; | |||
border-top: 1px solid var(--gold) !important; | |||
} | |||
/* ============================================================ | |||
END OF THEME | |||
============================================================ */ | |||
/* ============================================================ | |||
TEMPLATE FIXES ΓÇö Infoboxes, Navboxes, NPC Tables, Main Page | |||
============================================================ */ | |||
/* --- INFOboxes --- */ | |||
.infobox, | |||
.infobox-npc, | |||
.infobox table { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
color: var(--sand) !important; | |||
} | } | ||
.infobox th, | .infobox th, | ||
. | .infobox-npc th { | ||
background: var(--box-header) !important; | |||
background: # | color: var(--gold) !important; | ||
color: # | border: 1px solid var(--gold) !important; | ||
border- | } | ||
.infobox td, | |||
.infobox-npc td { | |||
background: #0A1420 !important; | |||
color: var(--sand) !important; | |||
border: 1px solid var(--gold) !important; | |||
} | |||
/* --- NPC DETAIL TABLES --- */ | |||
.npc-table, | |||
.npc-table table, | |||
.zone-table, | |||
.zone-table table { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
color: var(--sand) !important; | |||
} | |||
.npc-table th, | |||
.zone-table th { | |||
background: var(--box-header) !important; | |||
color: var(--gold) !important; | |||
border: 1px solid var(--gold) !important; | |||
} | |||
.npc-table td, | |||
.zone-table td { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
color: var(--sand) !important; | |||
} | } | ||
/* | /* --- WIKITABLE OVERRIDES (ALL TABLES) --- */ | ||
table | table.wikitable td, | ||
.wikitable td, | table.wikitable th { | ||
. | |||
background: #0A1420 !important; | background: #0A1420 !important; | ||
border: 1px solid | color: var(--sand) !important; | ||
color: | border: 1px solid var(--gold) !important; | ||
} | |||
table.wikitable th { | |||
background: var(--box-header) !important; | |||
color: var(--gold) !important; | |||
} | } | ||
/* | /* --- Even row accents --- */ | ||
table tr:nth-child(even), | table tr:nth-child(even), | ||
.wikitable tr:nth-child(even) { | .wikitable tr:nth-child(even), | ||
background: # | .npc-table tr:nth-child(even), | ||
.zone-table tr:nth-child(even) { | |||
background: #121E30 !important; | |||
} | } | ||
/* | /* --- MAIN PAGE BOXES --- */ | ||
.mainpage-box, | |||
.mainpage-section, | |||
.mainpage-area, | |||
.portal-box, | |||
.homepage-box { | |||
background: #0A1420 !important; | |||
border: 1px solid var(--gold) !important; | |||
color: var(--sand) !important; | |||
} | |||
.mainpage-box .header, | |||
.mainpage-section .header, | |||
background: | .homepage-box .header, | ||
color: | .portal-box .header { | ||
border: 1px solid | background: var(--box-header) !important; | ||
color: var(--gold) !important; | |||
padding: 8px !important; | |||
text-align: center; | |||
font-size: 1.25em; | |||
border-bottom: 1px solid var(--gold) !important; | |||
} | |||
/* --- NOTES & SUBHEADERS --- */ | |||
h2, | |||
h3 { | |||
color: var(--gold) !important; | |||
border-bottom: 1px solid rgba(255,255,255,0.15) !important; | |||
} | } | ||
span.notice, | |||
. | div.notes, | ||
. | div.section-note { | ||
background: # | background: #0A1420 !important; | ||
color: | color: var(--sand) !important; | ||
padding: 6px 10px !important; | padding: 6px 10px !important; | ||
border: 1px solid var(--gold) !important; | |||
} | |||
h2.right-header { | |||
margin: 0 !important; | |||
padding: 6px 10px !important; | |||
} | |||
body, | |||
#globalWrapper, | |||
#content, | |||
#mw-page-base, | |||
#mw-head-base { | |||
background-color: #0F1626 !important; | |||
} | |||
/* Style only the ONE specific table with ID mob-flag-legend */ | |||
#mob-flag-legend td { | |||
background-color: #1C2B44 !important; | |||
background-image: none !important; | |||
color: #E3B44A !important; | |||
border: none !important; | |||
text-align: center !important; | |||
font-size: 18px !important; /* change to any size you want */ | |||
font-family: "Trebuchet MS", "Verdana", sans-serif !important; | |||
padding: 0 !important; | |||
} | |||
#mob-flag-legend, | |||
#mob-flag-legend * { | |||
background-color: #1C2B44 !important; | |||
background-image: none !important; | |||
color: #E3B44A !important; | |||
} | |||
#mob-flag-legend * { | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
} | |||
/* Style only the ONE specific table with ID mob-flag-legend */ | |||
#mob-leftcolumn td { | |||
text-align: center !important; | |||
font-size: 18px !important; /* change to any size you want */ | |||
font-family: "Trebuchet MS", "Verdana", sans-serif !important; | |||
} | |||
/* ============================ | |||
NPC Template ΓÇö LEFT COLUMN | |||
Better Font + Text Size | |||
============================ */ | |||
/* Left column container */ | |||
.npc-left-column { | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.35 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Labels (Job, Family, etc.) */ | |||
.npc-left-column td:first-child { | |||
font-size: 14px !important; | |||
font-weight: bold !important; | |||
letter-spacing: 0.5px; | |||
} | |||
/* Values (the right side of the table inside the left column) */ | |||
.npc-left-column td:last-child { | |||
font-size: 14px !important; | |||
} | |||
/* NPC Header text improvement */ | |||
.npc-left-column h2 { | |||
font-family: "Trajan Pro", "Georgia", serif !important; | |||
font-size: 20px !important; | |||
letter-spacing: 1px; | |||
} | |||
/* =========================================== | |||
NPC Template ΓÇö Notes / Factions Sections | |||
Better Font + Cleaner Text + Consistent Look | |||
=========================================== */ | |||
/* Section headers (Notes, Factions, Opposing Factions) */ | |||
.right-header { | |||
font-family: "Trajan Pro", "Georgia", serif !important; | |||
font-size: 20px !important; | |||
letter-spacing: 1px; | |||
color: #E3B44A !important; | |||
text-transform: uppercase; | |||
} | |||
/* Text inside the detail tables */ | |||
.eqoa-detail-table td { | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.4 !important; | |||
color: #B9C4D1 !important; | |||
padding: 8px 10px !important; | |||
} | |||
/* Table container adjustments */ | |||
.eqoa-detail-table { | |||
border: 1px solid #E3B44A !important; | |||
background-color: #0A1420 !important; | |||
} | |||
/* =========================================== | |||
NPC Template ΓÇö Notes / Factions / Opposing Text | |||
Target ONLY the {{{notes}}} {{{factions}}} | |||
and {{{opposingfactions}}} content | |||
=========================================== */ | |||
/* Notes cell */ | |||
.eqoa-detail-table td > div.notes, | |||
.eqoa-detail-table td.notes { | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.45 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Factions cell */ | |||
.eqoa-detail-table td > div.factions, | |||
.eqoa-detail-table td.factions { | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.45 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Opposing factions cell */ | |||
.eqoa-detail-table td > div.opposingfactions, | |||
.eqoa-detail-table td.opposingfactions { | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.45 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* ================================ | |||
Unified border box for sections | |||
================================ */ | |||
.eqoa-section-box { | |||
border: 2px solid #E3B44A !important; | |||
background-color: #0A1420 !important; | |||
margin: 10px 0; | |||
padding: 0; | |||
} | |||
/* Remove separate borders so it looks like one box */ | |||
.eqoa-section-box .right-header { | |||
border: none !important; | |||
margin: 0; | |||
padding: 8px 10px !important; | |||
background: #1C2B44 !important; | |||
color: #E3B44A !important; | |||
} | |||
.eqoa-section-box .eqoa-detail-table { | |||
border: none !important; | |||
width: 100%; | |||
background: #0A1420 !important; | |||
} | |||
.eqoa-section-box td { | |||
padding: 10px !important; | |||
} | |||
/* ================================ | |||
MAIN PAGE ΓÇô GLOBAL BOX STYLE | |||
================================ */ | |||
/* Outer border boxes */ | |||
.mp-box { | |||
border: 2px solid #E3B44A !important; | |||
background-color: #0A1420 !important; | |||
color: #B9C4D1 !important; | |||
padding: 0; | |||
margin-bottom: 12px; | |||
} | |||
/* Inner gray sections */ | |||
.mp-inner { | |||
background-color: #1C2B44 !important; | |||
padding: 10px; | |||
border: 1px solid #E3B44A; | |||
} | |||
/* Section headers (orange ones) */ | |||
.mp-section-title { | |||
background-color: #f68825 !important; | |||
color: white !important; | |||
padding: 6px 10px; | |||
border: 2px solid #E3B44A !important; | |||
text-align: center; | |||
font-weight: bold; | |||
} | |||
/* ================================ | |||
TWO-COLUMN LAYOUT | |||
================================ */ | |||
.mp-columns { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: flex-start; | |||
gap: 10px; | |||
} | |||
.mp-col { | |||
flex: 1; | |||
background-color: #1C2B44 !important; | |||
border: 1px solid #E3B44A !important; | |||
padding: 10px; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Links inside columns */ | |||
.mp-col a { | |||
color: #E3B44A !important; | |||
} | |||
.mp-col a:hover { | |||
color: #ffffff !important; | |||
} | |||
/* ================================ | |||
BOTTOM SECTION | |||
================================ */ | |||
.mp-bottom { | |||
border: 2px solid #E3B44A !important; | |||
background-color: #0A1420 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
.mp-bottom .mp-inner { | |||
background-color: #1C2B44 !important; | |||
} | |||
/* COUNT TEXT AT THE VERY BOTTOM */ | |||
.mp-count { | |||
color: #E3B44A !important; | |||
font-weight: bold; | |||
} | |||
/* ============================================ | |||
EQOA Sandstorm ΓÇô Main Page Theme Override | |||
Forces the same color scheme used in NPC/Quest templates | |||
============================================ */ | |||
/* Overall background */ | |||
body.page-Main_Page #content, | |||
body.page-Main_Page .mw-body { | |||
background: #0A1420 !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* --- TOP BANNER --- */ | |||
body.page-Main_Page .eqoa-main-banner, | |||
body.page-Main_Page > div:first-of-type { | |||
background: #1C2B44 !important; | |||
border: 2px solid #E3B44A !important; | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 28px !important; | |||
} | |||
body.page-Main_Page .eqoa-main-banner div, | |||
body.page-Main_Page > div:first-of-type div { | |||
background: #1C2B44 !important; | |||
color: #E3B44A !important; | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 19px !important; | |||
} | |||
/* --- SECTION HEADERS (orange) --- */ | |||
body.page-Main_Page h2 { | |||
background: #F68825 !important; | |||
color: #FFFFFF !important; | |||
border: 2px solid #E3B44A !important; | |||
padding: 5px !important; | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 19px !important; | |||
} | |||
/* --- MAIN PAGE BOX WRAPPERS --- */ | |||
body.page-Main_Page .mp-box, | |||
body.page-Main_Page > div { | |||
background: #1C2B44 !important; | |||
border: 1px solid #E3B44A !important; | |||
color: #B9C4D1 !important; | |||
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important; | |||
font-size: 19px !important; | |||
} | |||
/* Fix gray* | |||
/* MAIN PAGE HEADER BAR COLORS */ | |||
#mw-content-text h2 { | |||
background-color: #F47600!important; | |||
color: #E3B44A !important; | |||
border: 2px solid #E3B44A !important; | |||
padding: 6px !important; | |||
text-align: center !important; | |||
} | |||
/* Remove the light gray background boxes under each header */ | |||
#mw-content-text > div, | |||
#mw-content-text > div > div { | |||
background-color: #0A1420 !important; | |||
border-color: #E3B44A !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Make the two-column blocks match EQOA theme */ | |||
#mw-content-text .flex-container, | |||
#mw-content-text div[style*="display: flex"] { | |||
background-color: #0A1420 !important; | |||
border: 1px solid #E3B44A !important; | |||
} | |||
/* Left + Right column boxes */ | |||
#mw-content-text .flex-container > div, | |||
#mw-content-text div[style*="display: flex"] > div { | |||
background-color: #0A1420 !important; | |||
border: 1px solid #E3B44A !important; | |||
color: #B9C4D1 !important; | |||
} | |||
/* Remove unwanted parent backgrounds */ | |||
#mw-content-text > div[style*="background-color:#cccccc"] { | |||
background-color: transparent !important; | |||
border: none !important; | |||
padding: 0 !important; | |||
} | |||
/* Main Page Section Header Style */ | |||
.mainpage-header { | |||
background: #1C2B44 !important; | |||
color: #E3B44A !important; | |||
border: 1px solid #E3B44A !important; | |||
padding: 6px !important; | |||
text-align: center !important; | |||
margin-bottom: 6px !important; | |||
} | |||
/* SPELL LIST CONTAINER */ | |||
.spell-list { | |||
border: 1px solid #b7c2c7; | |||
background: #e7ecef; | |||
padding: 10px; | |||
margin-bottom: 20px; | |||
} | |||
/* SPELL LIST TITLE */ | |||
.spell-list__title { | |||
background: #c4d3db; | |||
padding: 6px; | |||
text-align: center; | |||
font-weight: bold; | font-weight: bold; | ||
border: 1px solid #a9b5bb; | |||
margin-bottom: 10px; | |||
} | |||
/* COLUMN WRAPPER */ | |||
.spell-list__cols { | |||
display: flex; | |||
gap: 8px; | |||
justify-content: space-between; | |||
} | |||
/* EACH COLUMN */ | |||
.spell-col { | |||
flex: 1; | |||
border: 1px solid #b7c2c7; | |||
background: #f4f7f8; | |||
padding: 0; | |||
} | |||
/* EACH SPELL ROW */ | |||
.spell-row { | |||
display: flex; | |||
border-bottom: 1px solid #d1d9dd; | |||
padding: 4px 6px; | |||
align-items: center; | |||
} | |||
/* LEVEL NUMBER */ | |||
.spell-lvl { | |||
width: 28px; | |||
min-width: 28px; | |||
text-align: center; | |||
font-weight: bold; | |||
color: #333; | |||
} | |||
/* SPELL DATA (icons + name) */ | |||
.spell-data { | |||
display: flex; | |||
align-items: center; | |||
gap: 4px; | |||
} | |||
/* ICON WRAPPER */ | |||
.spell-icon-wrap img { | |||
vertical-align: middle; | |||
width: 20px; | |||
height: 20px; | |||
} | |||
/* Reduce spacing between each spell row */ | |||
.spell-row { | |||
display: flex; | |||
align-items: center; | |||
padding: 2px 4px !important; /* was BIG, now tiny */ | |||
margin: 0 !important; | |||
border-bottom: 1px solid #0c1621; /* optional thin line */ | |||
} | |||
/* Level column ΓÇö tiny spacing, no padding */ | |||
.spell-lvl { | |||
width: 25px; | |||
text-align: center; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
font-size: 12px; | |||
} | |||
/* Spell data container ΓÇö remove extra padding */ | |||
.spell-data { | |||
display: flex; | |||
align-items: center; | |||
gap: 0px; /* small spacing between icon + text */ | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
} | |||
/* Icons closer to text */ | |||
.spell-icon-wrap img { | |||
vertical-align: middle; | |||
margin: 0; | |||
padding: 0; | |||
} | |||
/* Columns ΓÇö remove giant default spacing */ | |||
.spell-list__cols { | |||
display: grid; | |||
grid-template-columns: repeat(5, 1fr); | |||
gap: 0 !important; /* remove spacing between columns */ | |||
} | |||
/* Columns interior */ | |||
.spell-col { | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
} | |||
/* Make each spell row shorter */ | |||
.spell-row { | |||
display: flex; | |||
align-items: center; | |||
padding: 2px 4px !important; /* Γåô smaller padding */ | |||
min-height: 14px !important; /* Γåô controls total row height */ | |||
line-height: 14px !important; | |||
} | |||
/* Shrinks the level number box */ | |||
.spell-lvl { | |||
padding: 0 4px !important; | |||
font-size: 12px !important; | |||
} | |||
/* Make the name + icons sit close with no big gaps */ | |||
.spell-data { | |||
display: flex; | |||
align-items: center; | |||
gap: 4px !important; | |||
} | |||
/* Icon spacing tightened */ | |||
.spell-icon-wrap img { | |||
width: 16px !important; | |||
height: 16px !important; | |||
margin: 0 !important; | |||
} | |||
/* Override big cells from the column container */ | |||
.spell-col > div { | |||
padding: 2px 4px !important; | |||
margin: 0 !important; | |||
} | |||
/* Remove vertical stretching */ | |||
.spell-col { | |||
display: flex; | |||
flex-direction: column; | |||
gap: 2px !important; | |||
} | |||
/** FORCE-COLLAPSE SPELL LIST SPACING ΓÇö ONLY FOR THESE TEMPLATES **/ | |||
/* Remove extra vertical gaps between rows */ | |||
.spell-col { | |||
display: flex; | |||
flex-direction: column; | |||
gap: 0 !important; /* was creating big spacing */ | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
} | |||
/* Tightest possible row height */ | |||
.spell-row { | |||
display: flex; | |||
align-items: center; | |||
padding: 1px 3px !important; /* Γåô tighten padding */ | |||
margin: 0 !important; | |||
border-bottom: 1px solid #d1d9dd; | |||
min-height: 0 !important; | |||
line-height: 14px !important; | |||
} | |||
/* Remove MediaWiki auto-margins inside spell-col */ | |||
.spell-col > * { | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
/* Remove top + bottom whitespace template expansion inserts */ | |||
.spell-col > :first-child, | |||
.spell-col > :last-child { | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
/* Shrink icons + spacing */ | |||
.spell-icon-wrap img { | |||
width: 16px !important; | |||
height: 16px !important; | |||
margin: 0 !important; | |||
} | |||
/* Spell data spacing */ | |||
.spell-data { | |||
display: flex; | |||
align-items: center; | |||
gap: 2px !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | } | ||
/* | /* Level number cell shrink */ | ||
. | .spell-lvl { | ||
width: 24px; | |||
border: 1px solid # | min-width: 24px; | ||
padding: 0 !important; | |||
padding: | margin: 0 !important; | ||
font-size: 12px !important; | |||
line-height: 14px !important; | |||
} | |||
/* --- FORCE SPELL ROWS TO BE SMALL & TIGHT --- */ | |||
.spell-row { | |||
display: flex !important; | |||
align-items: center !important; | |||
padding: 1px 3px !important; | |||
margin: 0 !important; | |||
min-height: 16px !important; | |||
line-height: 16px !important; | |||
height: 16px !important; | |||
border-bottom: 1px solid #c9cfd3 !important; | |||
} | |||
/* --- LEVEL NUMBER BOX TIGHTENED --- */ | |||
.spell-lvl { | |||
width: 22px !important; | |||
min-width: 22px !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
font-size: 12px !important; | |||
line-height: 16px !important; | |||
} | |||
/* --- SPELL NAME & ICON AREA --- */ | |||
.spell-data { | |||
display: flex !important; | |||
align-items: center !important; | |||
gap: 2px !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
line-height: 16px !important; | |||
} | |||
/* --- ICONS REDUCED LIKE YOUR EXAMPLE IMAGE --- */ | |||
.spell-icon-wrap img { | |||
width: 14px !important; | |||
height: 14px !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
/* --- REMOVE GAPS BETWEEN ROWS --- */ | |||
.spell-col { | |||
display: flex !important; | |||
flex-direction: column !important; | |||
gap: 0 !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
} | |||
.spell-col > div { | |||
margin: 0 !important; | |||
padding: 2 !important; | |||
} | |||
/* --- MAKE COLUMNS SKINNY LIKE THE IMAGE --- */ | |||
.spell-list__cols { | |||
gap: 4px !important; | |||
} | |||
.spell-col { | |||
border: 1px solid #c1c7cc !important; | |||
background: #f8fafb !important; | |||
} | |||
/* Remove all white background inside spell columns */ | |||
.spell-col * { | |||
background: transparent !important; | |||
box-shadow: none !important; | |||
} | |||
/* Also clear tables if the template is outputting them internally */ | |||
.spell-col table, | |||
.spell-col tr, | |||
.spell-col td { | |||
background: transparent !important; | |||
border: none !important; | |||
} | |||
/* Prevent wiki default gray/white cell styling */ | |||
.spell-row, | |||
.spell-row * { | |||
background: transparent !important; | |||
} | |||
/* Remove borders from any images inside spell list */ | |||
.spell-list img, | |||
.spell-row img, | |||
.spell-icon-wrap img { | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
background: transparent !important; | |||
} | |||
/* MediaWiki sometimes wraps images in <a> tags ΓÇö strip borders there too */ | |||
.spell-list a img, | |||
.spell-row a img { | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
background: transparent !important; | |||
} | |||
/* Remove ALL table formatting inside spell list columns */ | |||
.spell-col table, | |||
.spell-col tr, | |||
.spell-col td, | |||
.spell-col th { | |||
background: transparent !important; | |||
border: none !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
box-shadow: none !important; | |||
} | } | ||
/* | /* Force MediaWiki to NOT apply default cell backgrounds */ | ||
.spell-list .wikitable, | |||
.spell-list table, | |||
background | .spell-list td, | ||
.spell-list th { | |||
background-color: transparent !important; | |||
border: none !important; | border: none !important; | ||
} | } | ||
/* | /* HARD RESET everything inside spell list */ | ||
# | .spell-list, | ||
.spell-list * { | |||
background: transparent !important; | |||
border: none !important; | |||
box-shadow: none !important; | |||
outline: none !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
} | |||
/* Destroy ALL table formatting inside spell list */ | |||
.spell-list table, | |||
.spell-list tr, | |||
.spell-list td, | |||
.spell-list th { | |||
background: transparent !important; | |||
border: none !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
box-shadow: none !important; | |||
} | |||
/* Destroy MediaWiki's hidden table cell backgrounds */ | |||
.spell-list .wikitable, | |||
.spell-list .mw-parser-output table, | |||
.spell-list .mw-parser-output td, | |||
.spell-list .mw-parser-output th { | |||
background: transparent !important; | |||
border: none !important; | |||
} | |||
/* Strip link/thumbnail image borders */ | |||
.spell-list img, | |||
.spell-list a img { | |||
background: transparent !important; | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
} | |||
/* Prevent Monobook from re-wrapping cells with white backgrounds */ | |||
#content .spell-list td, | |||
#content .spell-list th { | |||
background: transparent !important; | |||
} | |||
/* SPELL LIST WRAPPER */ | |||
.SpellList { | |||
width: 100%; | |||
display: flex; | |||
flex-wrap: wrap; | |||
justify-content: space-between; | |||
background-color: #E0D6CC; /* Desert Sandstone */ | |||
padding: 5px; | |||
border: 2px solid #2C1F0F; /* Desert Night */ | |||
color: #3A2A18; /* Text Color */ | |||
font-family: "Trebuchet MS", "Verdana", sans-serif; | |||
font-size: 14px; | |||
} | |||
/* EACH SPELL ROW (LEFT + RIGHT) */ | |||
.SpellRow { | |||
width: 48%; /* makes both columns bigger */ | |||
background-color: #F0E7DC; | |||
padding: 4px 8px; /* lower padding like you asked */ | |||
margin-bottom: 6px; | |||
border-radius: 6px; | |||
box-sizing: border-box; | |||
color: #3A2A18; | |||
} | |||
/* HEADERS INSIDE SPELL ROWS */ | |||
.SpellRow h3 { | |||
background-color: #CC6A00; /* Ember Orange */ | |||
color: white; | |||
font-size: 15px; | |||
padding: 3px 6px; | |||
margin: 0 0 6px 0; | |||
border-radius: 4px; | |||
} | |||
/* REMOVE IMG BORDERS */ | |||
.SpellRow img, | |||
.SpellList img { | |||
border: none !important; | |||
box-shadow: none !important; | |||
background: none !important; | |||
} | |||
/* OPTIONAL: HOVER EFFECT */ | |||
.SpellRow:hover { | |||
background-color: #E1A857; /* Golden Sand */ | |||
} | } | ||
Revision as of 10:53, 22 November 2025
/* ============================================================
EQOA: Sandstorm WIKI THEME ΓÇö OPTION D (Classic EQ UI Palette)
Applies to ALL pages, ALL namespaces, ALL skins (MonoBook primary)
============================================================ */
:root {
/* BASE */
--midnight: #0F1626; /* Deep EQ-style indigo */
--sand: #B9C4D1; /* Soft blue-gray parchment */
/* ACCENTS */
--gold: #E3B44A; /* Classic EverQuest gold */
--sky: #6DA5E7; /* EQ link blue */
/* STATUS COLORS */
--evergreen: #3E6B52; /* success */
--ember: #9A2E1E; /* danger */
/* BOX HEADER ACCENT */
--box-header: #1C2B44; /* EQ-style header blue */
}
/* ============================================================
GLOBAL PAGE BACKGROUND & TEXT
============================================================ */
body {
background: var(--midnight) !important;
color: var(--sand) !important;
font-family: "Georgia", "Times New Roman", serif;
}
#content,
#bodyContent,
#mw-content-text {
color: var(--sand) !important;
}
/* ============================================================
HEADINGS (GLOBAL OVERRIDES)
============================================================ */
h1, h2, h3, h4, h5, h6,
#firstHeading, .mw-first-heading,
.mw-body h1, .mw-body h2, .mw-body h3,
.mw-body h4, .mw-body h5, .mw-body h6 {
color: var(--gold) !important;
font-family: "Georgia", "Times New Roman", serif !important;
font-weight: 700 !important;
border: none !important;
}
/* Section header underline */
.mw-parser-output > h2 {
border-bottom: 1px solid rgba(255,255,255,0.15) !important;
}
/* ============================================================
LINKS
============================================================ */
a {
color: var(--sky) !important;
}
a:visited {
color: #5E8BC0 !important;
}
a:hover {
color: var(--gold) !important;
}
/* ============================================================
TABLES, ROWS, LISTS
============================================================ */
table,
.wikitable {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
}
.wikitable th {
background: var(--box-header) !important;
color: var(--gold) !important;
}
.wikitable td {
color: var(--sand) !important;
border-color: var(--gold) !important;
}
/* Alternating row accent */
tr:nth-child(even) {
background: #121E30 !important;
}
/* ============================================================
CUSTOM BOXES / PORTALS / HOMEPAGE SECTIONS
============================================================ */
.portal,
.navbox,
.multicol,
.mainpage-box,
.mainpage-header,
div.center-box,
div.portal,
#mp-topbanner,
#mp-left,
#mp-right {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
/* Box headers */
.portal .portal-header,
.mainpage-header,
div.center-box .header,
h2.box-header,
.box-header {
background: var(--box-header) !important;
padding: 6px 10px !important;
color: var(--gold) !important;
font-size: 1.25em !important;
text-align: center;
border-bottom: 1px solid var(--gold) !important;
}
/* ============================================================
SIDEBAR (MonoBook)
============================================================ */
#p-logo {
background: transparent !important;
}
#p-navigation,
#p-interaction,
#p-tb,
#p-search {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
#p-navigation h3,
#p-interaction h3,
#p-tb h3,
#p-search h3 {
background: var(--box-header) !important;
color: var(--gold) !important;
padding: 4px 6px !important;
}
/* ============================================================
INPUTS / SEARCH BOX
============================================================ */
input,
textarea {
background: #142233 !important;
color: var(--sand) !important;
border: 1px solid var(--gold) !important;
}
/* ============================================================
NOTICES / TEMPLATES
============================================================ */
.success,
.notice-success {
background: var(--evergreen) !important;
color: #DFF2E4 !important;
}
.warning,
.notice-warning {
background: #3F2E00 !important;
color: #FFDD8A !important;
}
.error,
.notice-error {
background: var(--ember) !important;
color: #F9D0C8 !important;
}
/* ============================================================
FOOTER
============================================================ */
#footer {
background: #0A1420 !important;
color: var(--sand) !important;
border-top: 1px solid var(--gold) !important;
}
/* ============================================================
END OF THEME
============================================================ */
/* ============================================================
TEMPLATE FIXES ΓÇö Infoboxes, Navboxes, NPC Tables, Main Page
============================================================ */
/* --- INFOboxes --- */
.infobox,
.infobox-npc,
.infobox table {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
.infobox th,
.infobox-npc th {
background: var(--box-header) !important;
color: var(--gold) !important;
border: 1px solid var(--gold) !important;
}
.infobox td,
.infobox-npc td {
background: #0A1420 !important;
color: var(--sand) !important;
border: 1px solid var(--gold) !important;
}
/* --- NPC DETAIL TABLES --- */
.npc-table,
.npc-table table,
.zone-table,
.zone-table table {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
.npc-table th,
.zone-table th {
background: var(--box-header) !important;
color: var(--gold) !important;
border: 1px solid var(--gold) !important;
}
.npc-table td,
.zone-table td {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
/* --- WIKITABLE OVERRIDES (ALL TABLES) --- */
table.wikitable td,
table.wikitable th {
background: #0A1420 !important;
color: var(--sand) !important;
border: 1px solid var(--gold) !important;
}
table.wikitable th {
background: var(--box-header) !important;
color: var(--gold) !important;
}
/* --- Even row accents --- */
table tr:nth-child(even),
.wikitable tr:nth-child(even),
.npc-table tr:nth-child(even),
.zone-table tr:nth-child(even) {
background: #121E30 !important;
}
/* --- MAIN PAGE BOXES --- */
.mainpage-box,
.mainpage-section,
.mainpage-area,
.portal-box,
.homepage-box {
background: #0A1420 !important;
border: 1px solid var(--gold) !important;
color: var(--sand) !important;
}
.mainpage-box .header,
.mainpage-section .header,
.homepage-box .header,
.portal-box .header {
background: var(--box-header) !important;
color: var(--gold) !important;
padding: 8px !important;
text-align: center;
font-size: 1.25em;
border-bottom: 1px solid var(--gold) !important;
}
/* --- NOTES & SUBHEADERS --- */
h2,
h3 {
color: var(--gold) !important;
border-bottom: 1px solid rgba(255,255,255,0.15) !important;
}
span.notice,
div.notes,
div.section-note {
background: #0A1420 !important;
color: var(--sand) !important;
padding: 6px 10px !important;
border: 1px solid var(--gold) !important;
}
h2.right-header {
margin: 0 !important;
padding: 6px 10px !important;
}
body,
#globalWrapper,
#content,
#mw-page-base,
#mw-head-base {
background-color: #0F1626 !important;
}
/* Style only the ONE specific table with ID mob-flag-legend */
#mob-flag-legend td {
background-color: #1C2B44 !important;
background-image: none !important;
color: #E3B44A !important;
border: none !important;
text-align: center !important;
font-size: 18px !important; /* change to any size you want */
font-family: "Trebuchet MS", "Verdana", sans-serif !important;
padding: 0 !important;
}
#mob-flag-legend,
#mob-flag-legend * {
background-color: #1C2B44 !important;
background-image: none !important;
color: #E3B44A !important;
}
#mob-flag-legend * {
border: none !important;
outline: none !important;
box-shadow: none !important;
}
/* Style only the ONE specific table with ID mob-flag-legend */
#mob-leftcolumn td {
text-align: center !important;
font-size: 18px !important; /* change to any size you want */
font-family: "Trebuchet MS", "Verdana", sans-serif !important;
}
/* ============================
NPC Template ΓÇö LEFT COLUMN
Better Font + Text Size
============================ */
/* Left column container */
.npc-left-column {
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 14px !important;
line-height: 1.35 !important;
color: #B9C4D1 !important;
}
/* Labels (Job, Family, etc.) */
.npc-left-column td:first-child {
font-size: 14px !important;
font-weight: bold !important;
letter-spacing: 0.5px;
}
/* Values (the right side of the table inside the left column) */
.npc-left-column td:last-child {
font-size: 14px !important;
}
/* NPC Header text improvement */
.npc-left-column h2 {
font-family: "Trajan Pro", "Georgia", serif !important;
font-size: 20px !important;
letter-spacing: 1px;
}
/* ===========================================
NPC Template ΓÇö Notes / Factions Sections
Better Font + Cleaner Text + Consistent Look
=========================================== */
/* Section headers (Notes, Factions, Opposing Factions) */
.right-header {
font-family: "Trajan Pro", "Georgia", serif !important;
font-size: 20px !important;
letter-spacing: 1px;
color: #E3B44A !important;
text-transform: uppercase;
}
/* Text inside the detail tables */
.eqoa-detail-table td {
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 14px !important;
line-height: 1.4 !important;
color: #B9C4D1 !important;
padding: 8px 10px !important;
}
/* Table container adjustments */
.eqoa-detail-table {
border: 1px solid #E3B44A !important;
background-color: #0A1420 !important;
}
/* ===========================================
NPC Template ΓÇö Notes / Factions / Opposing Text
Target ONLY the {{{notes}}} {{{factions}}}
and {{{opposingfactions}}} content
=========================================== */
/* Notes cell */
.eqoa-detail-table td > div.notes,
.eqoa-detail-table td.notes {
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 14px !important;
line-height: 1.45 !important;
color: #B9C4D1 !important;
}
/* Factions cell */
.eqoa-detail-table td > div.factions,
.eqoa-detail-table td.factions {
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 14px !important;
line-height: 1.45 !important;
color: #B9C4D1 !important;
}
/* Opposing factions cell */
.eqoa-detail-table td > div.opposingfactions,
.eqoa-detail-table td.opposingfactions {
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 14px !important;
line-height: 1.45 !important;
color: #B9C4D1 !important;
}
/* ================================
Unified border box for sections
================================ */
.eqoa-section-box {
border: 2px solid #E3B44A !important;
background-color: #0A1420 !important;
margin: 10px 0;
padding: 0;
}
/* Remove separate borders so it looks like one box */
.eqoa-section-box .right-header {
border: none !important;
margin: 0;
padding: 8px 10px !important;
background: #1C2B44 !important;
color: #E3B44A !important;
}
.eqoa-section-box .eqoa-detail-table {
border: none !important;
width: 100%;
background: #0A1420 !important;
}
.eqoa-section-box td {
padding: 10px !important;
}
/* ================================
MAIN PAGE ΓÇô GLOBAL BOX STYLE
================================ */
/* Outer border boxes */
.mp-box {
border: 2px solid #E3B44A !important;
background-color: #0A1420 !important;
color: #B9C4D1 !important;
padding: 0;
margin-bottom: 12px;
}
/* Inner gray sections */
.mp-inner {
background-color: #1C2B44 !important;
padding: 10px;
border: 1px solid #E3B44A;
}
/* Section headers (orange ones) */
.mp-section-title {
background-color: #f68825 !important;
color: white !important;
padding: 6px 10px;
border: 2px solid #E3B44A !important;
text-align: center;
font-weight: bold;
}
/* ================================
TWO-COLUMN LAYOUT
================================ */
.mp-columns {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 10px;
}
.mp-col {
flex: 1;
background-color: #1C2B44 !important;
border: 1px solid #E3B44A !important;
padding: 10px;
color: #B9C4D1 !important;
}
/* Links inside columns */
.mp-col a {
color: #E3B44A !important;
}
.mp-col a:hover {
color: #ffffff !important;
}
/* ================================
BOTTOM SECTION
================================ */
.mp-bottom {
border: 2px solid #E3B44A !important;
background-color: #0A1420 !important;
color: #B9C4D1 !important;
}
.mp-bottom .mp-inner {
background-color: #1C2B44 !important;
}
/* COUNT TEXT AT THE VERY BOTTOM */
.mp-count {
color: #E3B44A !important;
font-weight: bold;
}
/* ============================================
EQOA Sandstorm ΓÇô Main Page Theme Override
Forces the same color scheme used in NPC/Quest templates
============================================ */
/* Overall background */
body.page-Main_Page #content,
body.page-Main_Page .mw-body {
background: #0A1420 !important;
color: #B9C4D1 !important;
}
/* --- TOP BANNER --- */
body.page-Main_Page .eqoa-main-banner,
body.page-Main_Page > div:first-of-type {
background: #1C2B44 !important;
border: 2px solid #E3B44A !important;
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 28px !important;
}
body.page-Main_Page .eqoa-main-banner div,
body.page-Main_Page > div:first-of-type div {
background: #1C2B44 !important;
color: #E3B44A !important;
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 19px !important;
}
/* --- SECTION HEADERS (orange) --- */
body.page-Main_Page h2 {
background: #F68825 !important;
color: #FFFFFF !important;
border: 2px solid #E3B44A !important;
padding: 5px !important;
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 19px !important;
}
/* --- MAIN PAGE BOX WRAPPERS --- */
body.page-Main_Page .mp-box,
body.page-Main_Page > div {
background: #1C2B44 !important;
border: 1px solid #E3B44A !important;
color: #B9C4D1 !important;
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
font-size: 19px !important;
}
/* Fix gray*
/* MAIN PAGE HEADER BAR COLORS */
#mw-content-text h2 {
background-color: #F47600!important;
color: #E3B44A !important;
border: 2px solid #E3B44A !important;
padding: 6px !important;
text-align: center !important;
}
/* Remove the light gray background boxes under each header */
#mw-content-text > div,
#mw-content-text > div > div {
background-color: #0A1420 !important;
border-color: #E3B44A !important;
color: #B9C4D1 !important;
}
/* Make the two-column blocks match EQOA theme */
#mw-content-text .flex-container,
#mw-content-text div[style*="display: flex"] {
background-color: #0A1420 !important;
border: 1px solid #E3B44A !important;
}
/* Left + Right column boxes */
#mw-content-text .flex-container > div,
#mw-content-text div[style*="display: flex"] > div {
background-color: #0A1420 !important;
border: 1px solid #E3B44A !important;
color: #B9C4D1 !important;
}
/* Remove unwanted parent backgrounds */
#mw-content-text > div[style*="background-color:#cccccc"] {
background-color: transparent !important;
border: none !important;
padding: 0 !important;
}
/* Main Page Section Header Style */
.mainpage-header {
background: #1C2B44 !important;
color: #E3B44A !important;
border: 1px solid #E3B44A !important;
padding: 6px !important;
text-align: center !important;
margin-bottom: 6px !important;
}
/* SPELL LIST CONTAINER */
.spell-list {
border: 1px solid #b7c2c7;
background: #e7ecef;
padding: 10px;
margin-bottom: 20px;
}
/* SPELL LIST TITLE */
.spell-list__title {
background: #c4d3db;
padding: 6px;
text-align: center;
font-weight: bold;
border: 1px solid #a9b5bb;
margin-bottom: 10px;
}
/* COLUMN WRAPPER */
.spell-list__cols {
display: flex;
gap: 8px;
justify-content: space-between;
}
/* EACH COLUMN */
.spell-col {
flex: 1;
border: 1px solid #b7c2c7;
background: #f4f7f8;
padding: 0;
}
/* EACH SPELL ROW */
.spell-row {
display: flex;
border-bottom: 1px solid #d1d9dd;
padding: 4px 6px;
align-items: center;
}
/* LEVEL NUMBER */
.spell-lvl {
width: 28px;
min-width: 28px;
text-align: center;
font-weight: bold;
color: #333;
}
/* SPELL DATA (icons + name) */
.spell-data {
display: flex;
align-items: center;
gap: 4px;
}
/* ICON WRAPPER */
.spell-icon-wrap img {
vertical-align: middle;
width: 20px;
height: 20px;
}
/* Reduce spacing between each spell row */
.spell-row {
display: flex;
align-items: center;
padding: 2px 4px !important; /* was BIG, now tiny */
margin: 0 !important;
border-bottom: 1px solid #0c1621; /* optional thin line */
}
/* Level column ΓÇö tiny spacing, no padding */
.spell-lvl {
width: 25px;
text-align: center;
padding: 0 !important;
margin: 0 !important;
font-size: 12px;
}
/* Spell data container ΓÇö remove extra padding */
.spell-data {
display: flex;
align-items: center;
gap: 0px; /* small spacing between icon + text */
padding: 0 !important;
margin: 0 !important;
}
/* Icons closer to text */
.spell-icon-wrap img {
vertical-align: middle;
margin: 0;
padding: 0;
}
/* Columns ΓÇö remove giant default spacing */
.spell-list__cols {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 0 !important; /* remove spacing between columns */
}
/* Columns interior */
.spell-col {
padding: 0 !important;
margin: 0 !important;
}
/* Make each spell row shorter */
.spell-row {
display: flex;
align-items: center;
padding: 2px 4px !important; /* Γåô smaller padding */
min-height: 14px !important; /* Γåô controls total row height */
line-height: 14px !important;
}
/* Shrinks the level number box */
.spell-lvl {
padding: 0 4px !important;
font-size: 12px !important;
}
/* Make the name + icons sit close with no big gaps */
.spell-data {
display: flex;
align-items: center;
gap: 4px !important;
}
/* Icon spacing tightened */
.spell-icon-wrap img {
width: 16px !important;
height: 16px !important;
margin: 0 !important;
}
/* Override big cells from the column container */
.spell-col > div {
padding: 2px 4px !important;
margin: 0 !important;
}
/* Remove vertical stretching */
.spell-col {
display: flex;
flex-direction: column;
gap: 2px !important;
}
/** FORCE-COLLAPSE SPELL LIST SPACING ΓÇö ONLY FOR THESE TEMPLATES **/
/* Remove extra vertical gaps between rows */
.spell-col {
display: flex;
flex-direction: column;
gap: 0 !important; /* was creating big spacing */
padding: 0 !important;
margin: 0 !important;
}
/* Tightest possible row height */
.spell-row {
display: flex;
align-items: center;
padding: 1px 3px !important; /* Γåô tighten padding */
margin: 0 !important;
border-bottom: 1px solid #d1d9dd;
min-height: 0 !important;
line-height: 14px !important;
}
/* Remove MediaWiki auto-margins inside spell-col */
.spell-col > * {
margin: 0 !important;
padding: 0 !important;
}
/* Remove top + bottom whitespace template expansion inserts */
.spell-col > :first-child,
.spell-col > :last-child {
margin: 0 !important;
padding: 0 !important;
}
/* Shrink icons + spacing */
.spell-icon-wrap img {
width: 16px !important;
height: 16px !important;
margin: 0 !important;
}
/* Spell data spacing */
.spell-data {
display: flex;
align-items: center;
gap: 2px !important;
margin: 0 !important;
padding: 0 !important;
}
/* Level number cell shrink */
.spell-lvl {
width: 24px;
min-width: 24px;
padding: 0 !important;
margin: 0 !important;
font-size: 12px !important;
line-height: 14px !important;
}
/* --- FORCE SPELL ROWS TO BE SMALL & TIGHT --- */
.spell-row {
display: flex !important;
align-items: center !important;
padding: 1px 3px !important;
margin: 0 !important;
min-height: 16px !important;
line-height: 16px !important;
height: 16px !important;
border-bottom: 1px solid #c9cfd3 !important;
}
/* --- LEVEL NUMBER BOX TIGHTENED --- */
.spell-lvl {
width: 22px !important;
min-width: 22px !important;
padding: 0 !important;
margin: 0 !important;
font-size: 12px !important;
line-height: 16px !important;
}
/* --- SPELL NAME & ICON AREA --- */
.spell-data {
display: flex !important;
align-items: center !important;
gap: 2px !important;
margin: 0 !important;
padding: 0 !important;
line-height: 16px !important;
}
/* --- ICONS REDUCED LIKE YOUR EXAMPLE IMAGE --- */
.spell-icon-wrap img {
width: 14px !important;
height: 14px !important;
margin: 0 !important;
padding: 0 !important;
}
/* --- REMOVE GAPS BETWEEN ROWS --- */
.spell-col {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
.spell-col > div {
margin: 0 !important;
padding: 2 !important;
}
/* --- MAKE COLUMNS SKINNY LIKE THE IMAGE --- */
.spell-list__cols {
gap: 4px !important;
}
.spell-col {
border: 1px solid #c1c7cc !important;
background: #f8fafb !important;
}
/* Remove all white background inside spell columns */
.spell-col * {
background: transparent !important;
box-shadow: none !important;
}
/* Also clear tables if the template is outputting them internally */
.spell-col table,
.spell-col tr,
.spell-col td {
background: transparent !important;
border: none !important;
}
/* Prevent wiki default gray/white cell styling */
.spell-row,
.spell-row * {
background: transparent !important;
}
/* Remove borders from any images inside spell list */
.spell-list img,
.spell-row img,
.spell-icon-wrap img {
border: none !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* MediaWiki sometimes wraps images in <a> tags ΓÇö strip borders there too */
.spell-list a img,
.spell-row a img {
border: none !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* Remove ALL table formatting inside spell list columns */
.spell-col table,
.spell-col tr,
.spell-col td,
.spell-col th {
background: transparent !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
box-shadow: none !important;
}
/* Force MediaWiki to NOT apply default cell backgrounds */
.spell-list .wikitable,
.spell-list table,
.spell-list td,
.spell-list th {
background-color: transparent !important;
border: none !important;
}
/* HARD RESET everything inside spell list */
.spell-list,
.spell-list * {
background: transparent !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
padding: 0 !important;
margin: 0 !important;
}
/* Destroy ALL table formatting inside spell list */
.spell-list table,
.spell-list tr,
.spell-list td,
.spell-list th {
background: transparent !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
box-shadow: none !important;
}
/* Destroy MediaWiki's hidden table cell backgrounds */
.spell-list .wikitable,
.spell-list .mw-parser-output table,
.spell-list .mw-parser-output td,
.spell-list .mw-parser-output th {
background: transparent !important;
border: none !important;
}
/* Strip link/thumbnail image borders */
.spell-list img,
.spell-list a img {
background: transparent !important;
border: none !important;
outline: none !important;
box-shadow: none !important;
}
/* Prevent Monobook from re-wrapping cells with white backgrounds */
#content .spell-list td,
#content .spell-list th {
background: transparent !important;
}
/* SPELL LIST WRAPPER */
.SpellList {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
background-color: #E0D6CC; /* Desert Sandstone */
padding: 5px;
border: 2px solid #2C1F0F; /* Desert Night */
color: #3A2A18; /* Text Color */
font-family: "Trebuchet MS", "Verdana", sans-serif;
font-size: 14px;
}
/* EACH SPELL ROW (LEFT + RIGHT) */
.SpellRow {
width: 48%; /* makes both columns bigger */
background-color: #F0E7DC;
padding: 4px 8px; /* lower padding like you asked */
margin-bottom: 6px;
border-radius: 6px;
box-sizing: border-box;
color: #3A2A18;
}
/* HEADERS INSIDE SPELL ROWS */
.SpellRow h3 {
background-color: #CC6A00; /* Ember Orange */
color: white;
font-size: 15px;
padding: 3px 6px;
margin: 0 0 6px 0;
border-radius: 4px;
}
/* REMOVE IMG BORDERS */
.SpellRow img,
.SpellList img {
border: none !important;
box-shadow: none !important;
background: none !important;
}
/* OPTIONAL: HOVER EFFECT */
.SpellRow:hover {
background-color: #E1A857; /* Golden Sand */
}