MediaWiki:Common.css: Difference between revisions

From EQOA Sandstorm Wiki
Jump to navigationJump to search
No edit summary
No edit summary
Line 74: Line 74:
}
}


/* Apply only to the main page */
 
body.page-Main_Page {
 
 
 
 
 
/* === GLOBAL SITE BACKGROUND COLOR THEME === */
 
/* Base background color for everything */
html, body {
   background-color: #405b74 !important;
   background-color: #405b74 !important;
  background-image: none !important;
}
}


/* Optional: make page content stand out slightly */
/* Core structural elements (header, sidebar, content, footer) */
#content, #mw-content-text {
#mw-page-base,
   background: none !important;
#mw-head-base,
#mw-head,
#mw-panel,
#mw-panel div.portal,
#mw-panel h3,
#mw-panel ul,
#mw-panel li,
#mw-panel a,
#mw-panel #p-logo,
#mw-sidebar,
#mw-content,
#content,
#footer,
#mw-footer,
#mw-data-after-content {
  background-color: #405b74 !important;
   background-image: none !important;
  border: none !important;
}
}


/* === MAIN PAGE ONLY BACKGROUND COLOR FIX === */
/* Make sidebar text readable */
body.page-Main_Page {
#mw-panel,
   background-color: #405b74 !important; /* sets the page-wide color */
#mw-panel a,
#mw-panel h3 {
   color: #ffffff !important;
}
}


/* Also color the full page wrapper and sidebar areas */
/* Optional hover effect for sidebar links */
body.page-Main_Page #mw-page-base,
#mw-panel a:hover {
body.page-Main_Page #mw-head-base,
   color: #f68825 !important; /* matches your header orange */
body.page-Main_Page #mw-panel,
   text-decoration: underline;
body.page-Main_Page #mw-head,
body.page-Main_Page #mw-sidebar,
body.page-Main_Page #content {
   background-color: #405b74 !important;
  background-image: none !important; /* removes any default gradients */
   border: none !important;
}
}


/* Remove default white/gray backgrounds */
/* Remove white background from main content area */
body.page-Main_Page #mw-content-text,
#mw-content-text,
body.page-Main_Page #contentSub,
#contentSub,
body.page-Main_Page #siteSub {
#siteSub,
#bodyContent {
   background: none !important;
   background: none !important;
}
}


/* Optional: Adjust the sidebar text color for contrast if needed */
/* Optional: keep text areas inside content readable */
body.page-Main_Page #mw-panel div.portal,
#mw-content-text,
body.page-Main_Page #mw-panel h3,
.mw-body {
body.page-Main_Page #mw-panel a {
  color: #000000;
   color: #ffffff !important;
}
 
/* Logo background (where the logo image sits) */
#p-logo,
#p-logo a,
#p-logo a:hover {
   background-color: #405b74 !important;
  background-image: none !important;
  border: none !important;
}
}

Revision as of 04:36, 13 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 SITE BACKGROUND COLOR THEME === */

/* Base background color for everything */
html, body {
  background-color: #405b74 !important;
  background-image: none !important;
}

/* Core structural elements (header, sidebar, content, footer) */
#mw-page-base,
#mw-head-base,
#mw-head,
#mw-panel,
#mw-panel div.portal,
#mw-panel h3,
#mw-panel ul,
#mw-panel li,
#mw-panel a,
#mw-panel #p-logo,
#mw-sidebar,
#mw-content,
#content,
#footer,
#mw-footer,
#mw-data-after-content {
  background-color: #405b74 !important;
  background-image: none !important;
  border: none !important;
}

/* Make sidebar text readable */
#mw-panel,
#mw-panel a,
#mw-panel h3 {
  color: #ffffff !important;
}

/* Optional hover effect for sidebar links */
#mw-panel a:hover {
  color: #f68825 !important;  /* matches your header orange */
  text-decoration: underline;
}

/* Remove white background from main content area */
#mw-content-text,
#contentSub,
#siteSub,
#bodyContent {
  background: none !important;
}

/* Optional: keep text areas inside content readable */
#mw-content-text,
.mw-body {
  color: #000000;
}

/* Logo background (where the logo image sits) */
#p-logo,
#p-logo a,
#p-logo a:hover {
  background-color: #405b74 !important;
  background-image: none !important;
  border: none !important;
}