MediaWiki:Common.css

From MB Wiki
Revision as of 05:16, 11 December 2025 by Ais (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* =======================================================================
   MB WIKI - OFFICIAL COMMON.CSS
   Structure: FGS/Wiki.gg Standardized Variables
   Theme: Teal/Terraria Hybrid
   ======================================================================= */

/* --- 1. FONTS & IMPORTS --- */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

/* --- 2. BASIC VARIABLES (Typography & Layout) --- */
:root {
    /* Terraria/Standard Fonts (Overriding the loaded defaults) */
    --wiki-font-family-body: Helvetica, Arial, sans-serif;
    --wiki-font-family-heading: Verdana, Helvetica, Arial, sans-serif;
    --wiki-font-family-mono: monospace, monospace;
    
    --wiki-content-border-radius: 4px;
    --wiki-sidebar-border-radius: 4px;
    
    /* Layout Variables */
    --main-page-layout--desktop: 'banner banner banner' 'about about updates' 'starts starts starts' 'items items items' 'characters characters characters' 'enemies enemies enemies' 'area area area';
    --main-page-layout--tablet: 'banner banner' 'about updates' 'starts starts' 'items items' 'characters characters' 'enemies enemies' 'area area';
    --main-page-layout--mobile: 'banner' 'about' 'updates' 'starts' 'items' 'characters' 'enemies' 'area';
}

/* --- 3. LIGHT THEME (Your Teal Palette) --- */
:root, .view-light {
    /* Backgrounds */
    --wiki-body-background-color: #f8fdfc; /* Light Cyan */
    --wiki-body-background-image: none; /* Removed placeholder image */
    
    --wiki-content-background-color: #ffffff;
    --wiki-content-background-color--secondary: #e0f7f4; /* Darker Cyan for boxes */
    --wiki-content-border-color: #b2f5ea;
    
    /* Text & Links */
    --wiki-content-text-color: #1a2a2a;
    --wiki-content-link-color: #006d72; /* Dark Teal */
    --wiki-content-link-color--hover: #00474A;
    --wiki-content-link-color--visited: #00585c;
    
    /* Accents */
    --wiki-accent-color: #4fd1c7; /* Vibrant Teal */
    --wiki-accent-label-color: #ffffff;
    
    /* Special Components (Mainbox/Navbox) */
    --mainbox-header-bg: #e7c361; /* Gold (Terraria Style) */
    --mainbox-header-text: #000000;
    --mainbox-header-border: #a2a9b1;
    
    /* Messages/Alerts */
    --wiki-alert-color: #e53e3e;
    --wiki-warning-color: #dd6b20;
    --wiki-success-color: #38a169;
}

/* --- 4. DARK THEME (Your Dark Palette) --- */
.view-dark, .skin-vector-dark {
    /* Backgrounds */
    --wiki-body-background-color: #1a202c; /* Dark Blue-Gray */
    --wiki-body-background-image: none;
    
    --wiki-content-background-color: #2d3748;
    --wiki-content-background-color--secondary: #4a5568;
    --wiki-content-border-color: #4a5568;
    
    /* Text & Links */
    --wiki-content-text-color: #e2e8f0;
    --wiki-content-link-color: #4fd1c7; /* Bright Teal */
    --wiki-content-link-color--hover: #81e6d9;
    --wiki-content-link-color--visited: #38b2ac;
    
    /* Accents */
    --wiki-accent-color: #4fd1c7;
    --wiki-accent-label-color: #1a202c;
    
    /* Special Components */
    --mainbox-header-bg: #d69e2e; /* Darker Gold */
    --mainbox-header-text: #000000;
    --mainbox-header-border: #4a5568;
}

/* =======================================================================
   5. COMPONENT STYLING (Adapted from your provided code)
   ======================================================================= */

/* --- Typography & Global Resets --- */
html, body {
    font-family: var(--wiki-font-family-body);
    font-size: 14px;
    line-height: 1.5;
}

/* Links */
a { transition: color 0.2s; }
a:hover { text-decoration: underline; }

/* Tables (Terraria Style Header) */
.wikitable {
    background-color: var(--wiki-content-background-color);
    border: 1px solid var(--wiki-content-border-color);
    border-collapse: collapse;
    width: 100%;
}
.wikitable > tr > th, .wikitable > * > tr > th {
    background-color: var(--mainbox-header-bg);
    color: var(--mainbox-header-text);
    border: 1px solid var(--mainbox-header-border);
    padding: 8px;
    text-align: center;
    font-weight: bold;
}
.wikitable > tr > td, .wikitable > * > tr > td {
    border: 1px solid var(--wiki-content-border-color);
    padding: 6px;
}

/* --- Main Page Grid System --- */
#mp-container {
    display: grid;
    gap: 10px;
    grid-template-areas: var(--main-page-layout--desktop);
    grid-template-columns: repeat(12, 1fr);
}

/* Main Page Boxes */
.mp-box {
    display: flex;
    flex-flow: column nowrap;
    background: var(--wiki-content-background-color);
    border: 1px solid var(--wiki-content-border-color);
    border-radius: var(--wiki-content-border-radius);
    padding: 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    overflow: hidden;
}

.mp-body {
    padding: 10px;
    height: 100%;
}

/* Main Page Headers (Terraria Gold Style) */
.mp-box h2 {
    background-color: var(--mainbox-header-bg);
    color: var(--mainbox-header-text);
    margin: 0;
    padding: 8px;
    font-size: 1.25em;
    text-align: center;
    border-bottom: 1px solid var(--mainbox-header-border);
    font-family: var(--wiki-font-family-heading);
    font-weight: bold;
}

/* --- CardGrid / Navbox (From your code) --- */
.card-navbox-container {
    background: var(--wiki-content-background-color--secondary);
    border: 1px solid var(--wiki-content-border-color);
    border-radius: 8px;
    padding: 15px;
    margin: 1em 0;
}
.card-navbox-title {
    background: var(--mainbox-header-bg);
    color: var(--mainbox-header-text);
    padding: 8px;
    text-align: center;
    font-weight: bold;
    border-radius: 4px;
}

/* --- Inline Icons (.iconname) --- */
.iconname {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.iconname img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    image-rendering: pixelated; /* Essential for pixel art */
}

/* --- Portable Infobox --- */
.portable-infobox {
    border: 1px solid var(--wiki-content-border-color);
    background: var(--wiki-content-background-color);
    border-radius: 8px;
    margin-bottom: 1em;
}
.portable-infobox .pi-title {
    background: var(--mainbox-header-bg);
    color: var(--mainbox-header-text);
    font-family: var(--wiki-font-family-heading);
    font-weight: bold;
    border-radius: 7px 7px 0 0;
    padding: 10px;
}
.portable-infobox .pi-data-label {
    background: var(--wiki-content-background-color--secondary);
    font-weight: bold;
}

/* --- Responsive Layouts --- */
@media screen and (max-width: 1350px) {
    #mp-container {
        grid-template-areas: var(--main-page-layout--tablet);
        grid-template-columns: 1fr 1fr;
    }
}
@media screen and (max-width: 990px) {
    #mp-container {
        display: flex;
        flex-direction: column;
    }
    .grid { display: flex; flex-direction: column; }
}

/* =======================================================================
   6. THE "NUCLEAR OPTION" FOR FONTS
   This overrides the `load.php` setting: *,body{font-family:Fredoka...}
   ======================================================================= */
/* 1. Reset Global Font */
html, body, .mw-body, #content {
    font-family: Helvetica, Arial, sans-serif !important;
}

/* 2. Reset Headings to Verdana */
h1, h2, h3, h4, h5, h6, .mw-headline, .firstHeading {
    font-family: Verdana, Helvetica, Arial, sans-serif !important;
    font-weight: normal !important;
}

/* 3. Force Monospace for Code */
pre, code, .mw-code {
    font-family: monospace, monospace !important;
    font-size: 13px !important;
}

/* 4. Kill Fredoka on everything else */
* {
    font-family: inherit; /* Forces elements to listen to body/parent instead of load.php */
}
Retrieved from "https://mbwiki.stairwaygames.work/w/index.php?title=MediaWiki:Common.css&oldid=27491"