MediaWiki:Common.css: Difference between revisions

From EQOA Sandstorm Wiki
Jump to navigationJump to search
No edit summary
No edit summary
Line 9: Line 9:
     background-color: #c4c4c4; /* Adjust background color */
     background-color: #c4c4c4; /* Adjust background color */
}
}


/* Exclude Content Header box */
/* Exclude Content Header box */
Line 252: Line 251:
   box-shadow: none !important;
   box-shadow: none !important;
}
}




Line 335: Line 335:
     background-color: inherit !important;
     background-color: inherit !important;
     background: inherit !important;
     background: inherit !important;
}
}


Line 400: Line 399:
.mw-parser-output .npc-bottombox::after,
.mw-parser-output .npc-bottombox::after,
.mw-parser-output .npc-bottombox *::before,
.mw-parser-output .npc-bottombox *::before,
.mw-parser-output .npc-bottombox *::after {
.mw-parser-output .npc-bottombox *::after {
   background: transparent !important;
   background: transparent !important;
Line 505: Line 503:




/* ===== Elementalist spell list styling (safe, specific) ===== */
/* common.css - spell list compact style */


/* Target the spell list container only if present (keeps your original inline border) */
/* Container / list */
.spell-list {
.spell-list {
  background-color: #DFF3EA;
  border: 2px solid #1D4429;
  margin: 0;
  padding: 0;
   box-sizing: border-box;
   box-sizing: border-box;
  font-family: "Courier New", monospace;
}
/* Header */
.spell-list__title {
  background-color: #2B6E3C;
  color: #fff;
  text-align: center;
  margin: 0;
  padding: 6px 8px;
  border-bottom: 2px solid #1D4429;
  font-weight: 600;
  font-size: 14px;
}
}


/* Compact spell row: small padding, single line height */
/* Columns wrapper */
.spell-list .spell-row,
.spell-list__cols {
.spell-row { /* fallback if spell-list not added */
  display: flex;
  gap: 5px;
  padding: 6px;
  box-sizing: border-box;
}
 
/* Each column */
.spell-col {
  flex: 1;
  min-width: 200px;
  border: 1px solid #1D4429;
  padding: 4px;
  box-sizing: border-box;
  background: transparent;
}
 
/* Row (compact) */
.spell-row {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 8px;                /* horizontal gap between level and data */
   gap: 6px;                /* horizontal spacing between level and content */
   padding: 6px 8px;        /* overall row padding (reduce to taste) */
   padding: 2px 4px;        /* outer padding of the row */
   margin: 0;
   border-bottom: 1px solid #1D4429;
  background: transparent;
   box-sizing: border-box;
   box-sizing: border-box;
   font-size: 13px;
   min-height: 22px;         /* ensures consistent row height */
   line-height: 1;
   line-height: 1;
  border-bottom: 1px solid rgba(29,68,41,0.06); /* subtle separator */
}
}


/* Level box: fixed width, centered, no wrapping */
/* Level box - fixed size, bordered */
.spell-list .spell-row .spell-lvl,
.spell-lvl {
.spell-row .spell-lvl {
   width: 30px;             /* fixed width so digits never wrap vertically */
   min-width: 36px;
   min-width: 30px;
   width: 36px;
   height: 20px;             /* short height for compact rows */
   max-width: 36px;
   display: flex;
   text-align: center;
   align-items: center;
   white-space: nowrap;   /* prevents numbers stacking (e.g., "1" above "2") */
   justify-content: center;
   line-height: 1;
   font-weight: 700;
   font-weight: 700;
   padding: 0 4px;
  border: 1px solid #1D4429;
  background: #ffffff;      /* level box background separate from row */
  font-size: 12px;
  box-sizing: border-box;
   padding: 0;
   margin: 0;
   margin: 0;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
}


/* Spell-data area: tight layout, allows name to take remaining space */
/* Spell data area */
.spell-list .spell-row .spell-data,
.spell-data {
.spell-row .spell-data {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 8px;
   gap: 6px;                 /* small gap between icon and name */
   padding: 0;
   padding: 0 2px;
   margin: 0;
   box-sizing: border-box;
   flex: 1 1 auto;
   font-size: 13px;
  min-width: 0;           /* allows text truncation/wrapping properly */
}
}


/* Small icon */
/* Icon size */
.spell-list .spell-row .spell-icon,
.spell-icon {
.spell-row .spell-icon {
   width: 14px;
   width: 16px;
   height: 14px;
   height: 16px;
   display: inline-block;
   display: inline-block;
   margin: 0;
   vertical-align: middle;
   padding: 0;
}
   box-sizing: border-box;
 
/* Spell name: keep background "label" if desired */
.spell-name {
   padding: 6px 14px;        /* small inner padding for the white label bubble */
  background: #ffffff;
  border-radius: 2px;
  border: 1px solid rgba(0,0,0,0.02); /* subtle */
   font-family: inherit;
  font-size: 13px;
}
}


/* Name: compact line-height, allow wrapping but avoid breaking level */
/* Reduce top/bottom spacing inside the name bubble */
.spell-list .spell-row .spell-name,
.spell-name, .spell-lvl {
.spell-row .spell-name {
   line-height: 1;
  margin: 0;
  padding: 0;
   line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}
}


/* If you want ultra-tight rows, add the "compact" helper class to the outer container:
/* Optional: remove last row border */
  .spell-list.compact .spell-row { padding:4px 6px; gap:6px; font-size:12px; }
.spell-col .spell-row:last-child {
*/
  border-bottom: none;
}

Revision as of 07:35, 16 November 2025

/* CSS placed here will be applied to all skins */
/* Apply styles to the main content area of all special pages */

.ns--1 #content {
    font-size: 16px; /* Adjust font size */
    font-family: Arial, sans-serif; /* Adjust font type */
    color: #FFD700; /* Adjust font color */
    font-style: normal; /* Adjust font style */
    background-color: #c4c4c4; /* Adjust background color */
}

/* Exclude Content Header box */
.ns--1 #content .content-header {
    color: inherit; /* Keep default font color for content header */
    background-color: inherit; /* Keep default background color for content header */
}

/* Ensure links in the main content area of special pages follow the same styling */
.ns--1 #content > :not(.content-header) a {
    font-size: 16px; /* Adjust font size for links */
    font-family: Arial, sans-serif; /* Adjust font type for links */
    color: #FFD700 !important; /* Adjust font color for links */
    font-style: normal; /* Adjust font style for links */
    text-decoration: none; /* Remove underline from links */
}

/* Ensure visited links in the main content area of special pages follow the same styling */
.ns--1 #content > :not(.content-header) a:visited {
    color: #FFD700 !important; /* Adjust font color for visited links */
}

/* Ensure links in the main content area of special pages follow the same styling on hover */
.ns--1 #content > :not(.content-header) a:hover {
    color: #8e2631 !important; /* Adjust font color for links on hover */
    text-decoration: underline; /* Underline links on hover */
}

/* Apply the same style for URL text or any external links */
.ns--1 #content > :not(.content-header) a.external {
    font-size: 16px; /* Adjust font size for external links */
    font-family: Arial, sans-serif; /* Adjust font type for external links */
    color: #8e2631 !important; /* Adjust font color for external links */
    font-style: normal; /* Adjust font style for external links */
    text-decoration: none; /* Remove underline from external links */
}

/* Ensure external links in the main content area follow the same styling on hover */
.ns--1 #content > :not(.content-header) a.external:hover {
    color: #8e2631 !important; /* Adjust font color for external links on hover */
    text-decoration: underline; /* Underline external links on hover */
}

/* Style headers in the main content area of special pages */
.ns--1 #content > :not(.content-header) h1,
.ns--1 #content > :not(.content-header) h2,
.ns--1 #content > :not(.content-header) h3,
.ns--1 #content > :not(.content-header) h4,
.ns--1 #content > :not(.content-header) h5,
.ns--1 #content > :not(.content-header) h6 {
    font-size: 24px; /* Adjust font size for headers */
    font-family: Arial, sans-serif; /* Adjust font type for headers */
    color: #8e2631; /* Adjust font color for headers */
    font-style: normal; /* Adjust font style for headers */
}

/* Style headers in the main content area of special pages on hover */
.ns--1 #content > :not(.content-header) h1:hover,
.ns--1 #content > :not(.content-header) h2:hover,
.ns--1 #content > :not(.content-header) h3:hover,
.ns--1 #content > :not(.content-header) h4:hover,
.ns--1 #content > :not(.content-header) h5:hover,
.ns--1 #content > :not(.content-header) h6:hover {
    color: #8e2631; /* Adjust font color for headers on hover */
}







/* === GLOBAL PAGE BACKGROUND === */
html, body {
  background-color: #cccccc !important;
  background-image: none !important;
  color: #000000;
}

/* Apply consistent background across layout sections */
#mw-page-base,
#mw-head-base,
#mw-head,
#mw-panel,
#content,
#footer,
#mw-footer,
#mw-data-after-content,
#mw-wrapper,
#mw-data-before-content {
  background-color: #cccccc !important;
  background-image: none !important;
  border: none !important;
}

/* === SIDEBAR STYLING === */
#mw-panel,
#mw-panel h3,
#mw-panel a {
  color: #ffffff !important;
  background: none !important;
}

#mw-panel a:hover {
  color: #f68825 !important;
  text-decoration: underline;
}

/* === MAIN CONTENT AREA === */
#mw-content-text,
#contentSub,
#siteSub,
#bodyContent {
  background: none !important;
}

.mw-body,
#mw-content-text {
  color: #000000;
}

/* === LOGO AREA FIXED === */
#p-logo {
  background-color: #cccccc !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  height: auto !important;
  position: relative;
  overflow: visible !important;
}

/* Restore and center the logo image */
#p-logo a {
  display: block;
  background: url("/eqoawiki/resources/assets/sandstorm_logo1.png") no-repeat center center !important;
  background-size: contain !important;
  width: 135px !important;
  height: 155px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-indent: -9999px;
  overflow: hidden;
  border: none !important;
}


/* Ensure no invisible overlays block the logo */
#p-logo a img,
#p-logo img {
  display: none !important; /* Hide fallback <img> if present */
}

/* === TOP NAVIGATION BAR THEMING === */
#mw-head,
#p-personal,
#p-views,
#right-navigation,
#left-navigation {
  background-color: #cccccc !important;
  background-image: none !important;
  border: none !important;
}

/* Navigation bar text */
#p-personal a,
#p-views a,
#right-navigation a,
#left-navigation a {
  color: #ffffff !important;
  font-weight: bold;
}

/* Hover and active states */
#p-personal a:hover,
#p-views a:hover,
#right-navigation a:hover,
#left-navigation a:hover,
#p-personal li.active a,
#p-views li.selected a {
  color: #f68825 !important;
  text-decoration: underline;
}

/* Remove any white separator line */
#mw-head-base {
  border-bottom: none !important;
}





/* MediaWiki:Common.css */
.quest-reward { background-color: #cccccc !important; }
.quest-reward, .quest-reward * { background-color: transparent !important; }




/* MediaWiki:Common.css */
/* Force any inner elements inside quest right column to be transparent */
.quest-right,
.quest-reward,
.quest-walkthrough {
  background-color: #cccccc !important;  /* keep outer gray */
  border-color: transparent !important;
}

/* Override inner whites and borders */
.quest-right * ,
.quest-reward * ,
.quest-walkthrough * {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Keep outer gray box */
.quest-right,
.quest-reward,
.quest-walkthrough {
  background-color: #cccccc !important;
  border: none !important;
}

/* Restore the orange header */
.quest-header {
  background-color: #f68825 !important;
  color: white !important;
  border: none !important;
}

/* Force any inner white backgrounds to disappear */
.quest-right * ,
.quest-reward * ,
.quest-walkthrough * {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}



/* Adjust panel content to move down slightly, so it doesnΓÇÖt overlap the logo */
#mw-panel {
  padding-top: 170px !important; /* adjust to your logo height */
}

/* Remove space above sidebar logo */
#p-logo {
  margin-top: 0 !important;
  padding-top: 0 !important;
  position: absolute !important;
  top: 0 !important;
}

/* === FIX: Restore orange headers for Reward and Walkthrough === */
.quest-header {
  background-color: #d86f34!important;
  color: white !important;
  padding: 5px !important;
  border: none !important;
  margin: 0 !important;
}

.quest-header h2,
.quest-header {
  background-color: #d86f34!important;
  color: white !important;
  text-align: left;
  padding: 6px 10px !important;
  margin: 0 !important;
  border-radius: 3px;
  border: none !important;
}










/* === Global Link Style === */
a,
a:visited,
a:active {
  color: #c51c19!important;      /* Makes all links white */
  font-weight: bold;           /* Makes them bold */
  text-decoration: none;       /* Removes underline */
}

/* Optional: hover effect for better UX */
a:hover {
  color: #f9ce41 !important;   /* Light gold highlight on hover */
  text-decoration: underline;  /* Adds underline on hover */
}











/* Scoped overrides only for NPC right panel legend/table to prevent white bg from skin */
.mw-parser-output .npc-right-panel,
.mw-parser-output .npc-right-panel * {
    background-color: transparent !important;
    background: transparent !important;
}

/* Allow the template to style the legend table and its cells */
.mw-parser-output .npc-right-panel table.wikitable,
.mw-parser-output .npc-right-panel table.wikitable tr,
.mw-parser-output .npc-right-panel table.wikitable td,
.mw-parser-output .npc-right-panel table.wikitable th {
    background-color: inherit !important;
    background: inherit !important;
}

/* If you want the legend table forced to your gold color, this makes it explicit */
.mw-parser-output .npc-right-panel table.wikitable.legend-force {
    background-color: #D1A84C !important;
    color: #2C1F0F !important;
    border:2px solid #2C1F0F !important;
}
.mw-parser-output .npc-right-panel table.wikitable.legend-force tr,
.mw-parser-output .npc-right-panel table.wikitable.legend-force td {
    background-color: #D1A84C !important;
    color: #2C1F0F !important;
}



/* ********* Scoped NPC bottom-box fixes (ONLY affects .npc-bottombox) ********* */

/* Base: ensure the container has the panel color and no inner white boxes */
.mw-parser-output .npc-bottombox {
  background-color: #E0D6CC !important;
  border: 2px solid #2C1F0F !important;
  padding: 0 !important;
  margin-top: 12px !important;
}

/* Kill white backgrounds on any auto-inserted paragraphs inside only this box */
.mw-parser-output .npc-bottombox p,
.mw-parser-output .npc-bottombox p * {
  background: transparent !important;
  background-color: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Kill white backgrounds that some skins place on direct children */
.mw-parser-output .npc-bottombox > * {
  background: transparent !important;
  background-color: transparent !important;
}

/* If skin wraps elements in extra divs (Vector/Citizen/Timeless), nuke their bg here */
.mw-parser-output .npc-bottombox .mw-parser-output,
.mw-parser-output .npc-bottombox .thumb,
.mw-parser-output .npc-bottombox .box,
.mw-parser-output .npc-bottombox .mw-collapsible,
.mw-parser-output .npc-bottombox .module {
  background: transparent !important;
  background-color: transparent !important;
}

/* Force any table cells inside to display desired panel bg (cells sometimes default white) */
.mw-parser-output .npc-bottombox td,
.mw-parser-output .npc-bottombox th,
.mw-parser-output .npc-bottombox tr {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
}

/* If a skin uses pseudo-elements to paint a box, remove it inside this container */
.mw-parser-output .npc-bottombox::before,
.mw-parser-output .npc-bottombox::after,
.mw-parser-output .npc-bottombox *::before,
.mw-parser-output .npc-bottombox *::after {
  background: transparent !important;
  background-color: transparent !important;
}

/* If you want to be extra-paranoid, force any inline style backgrounds to inherit */
.mw-parser-output .npc-bottombox * {
  background: inherit !important;
  background-color: inherit !important;
}

/* Remove white BG + border ONLY from the right-column text areas */
.eqoa-detail-table,
.eqoa-detail-table td {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.right-header {
    background-color:#D1A84C !important;
    color:#2C1F0F !important;
    padding:6px !important;
    margin:0 !important;
    border:2px solid #2C1F0F !important;
}

/* Kill white background for Legend table only */
.npc-legend-table,
.npc-legend-table td,
.npc-legend-table tr {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Kill any skin-injected white background inside the legend table */
.npc-legend-table *,
.npc-legend-table td {
    background: transparent !important;
    background-color: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* === NPC Legend Table Fixes === */
.npc-legend-table {
    background-color: #D1A84C !important;  /* EQOA Gold bg */
    border: 2px solid #000 !important;     /* Black border */
    border-collapse: collapse !important;
    border-spacing: 0 !important;          /* remove inner spacing */
    margin: 0 !important;
    padding: 0 !important;
}

.npc-legend-table td {
    background: transparent !important;    /* remove skin-injected bg */
    border: none !important;               /* remove inner borders */
    padding: 0 !important;                 /* remove internal padding */
}

.npc-legend-table .npc-legend-content {
    background-color: #D1A84C !important;  /* gold background */
    color: #2C1F0F !important;             /* text color */
    padding: 6px !important;               /* controlled padding inside div */
    margin: 0 !important;
}

.npc-legend-table b {
    background: transparent !important;    /* bold text bg */
}

/* remove any skin-injected pseudo-elements that may create a box */
.npc-legend-table::before,
.npc-legend-table::after,
.npc-legend-table *::before,
.npc-legend-table *::after {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}


/* Remove global table cell background interfering with spells */
.spell-col {
    background: none !important;
    padding: 0 !important;
    margin: 0;
    line-height: 1.6;
}

/* Each spell entry becomes a row */
.spell-col > div {
    padding: 4px 6px;
    border-bottom: 1px solid #1D4429;
}

/* Remove last border */
.spell-col > div:last-child {
    border-bottom: none;
}


/* common.css - spell list compact style */

/* Container / list */
.spell-list {
  background-color: #DFF3EA;
  border: 2px solid #1D4429;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Courier New", monospace;
}

/* Header */
.spell-list__title {
  background-color: #2B6E3C;
  color: #fff;
  text-align: center;
  margin: 0;
  padding: 6px 8px;
  border-bottom: 2px solid #1D4429;
  font-weight: 600;
  font-size: 14px;
}

/* Columns wrapper */
.spell-list__cols {
  display: flex;
  gap: 5px;
  padding: 6px;
  box-sizing: border-box;
}

/* Each column */
.spell-col {
  flex: 1;
  min-width: 200px;
  border: 1px solid #1D4429;
  padding: 4px;
  box-sizing: border-box;
  background: transparent;
}

/* Row (compact) */
.spell-row {
  display: flex;
  align-items: center;
  gap: 6px;                 /* horizontal spacing between level and content */
  padding: 2px 4px;         /* outer padding of the row */
  border-bottom: 1px solid #1D4429;
  box-sizing: border-box;
  min-height: 22px;         /* ensures consistent row height */
  line-height: 1;
}

/* Level box - fixed size, bordered */
.spell-lvl {
  width: 30px;              /* fixed width so digits never wrap vertically */
  min-width: 30px;
  height: 20px;             /* short height for compact rows */
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  border: 1px solid #1D4429;
  background: #ffffff;      /* level box background separate from row */
  font-size: 12px;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

/* Spell data area */
.spell-data {
  display: flex;
  align-items: center;
  gap: 6px;                 /* small gap between icon and name */
  padding: 0 2px;
  box-sizing: border-box;
  font-size: 13px;
}

/* Icon size */
.spell-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: middle;
}

/* Spell name: keep background "label" if desired */
.spell-name {
  padding: 6px 14px;        /* small inner padding for the white label bubble */
  background: #ffffff;
  border-radius: 2px;
  border: 1px solid rgba(0,0,0,0.02); /* subtle */
  font-family: inherit;
  font-size: 13px;
}

/* Reduce top/bottom spacing inside the name bubble */
.spell-name, .spell-lvl {
  line-height: 1;
}

/* Optional: remove last row border */
.spell-col .spell-row:last-child {
  border-bottom: none;
}