MediaWiki:Common.css: Difference between revisions

Revision as of 20:46, 20 March 2026

/* ==========================================================================
   OREYNIA WIKI MASTER STYLESHEET
   
   TABLE OF CONTENTS:
   1. CSS Variables (The Control Panel)
   2. Global Typography (Fonts, Links, Paragraphs)
   3. Main Layout (Backgrounds, Headers, Sidebars)
   4. Wiki Components (Infoboxes, Tables, Quote Blocks)
   5. Utility Classes (Hidden elements, alignments)
   ========================================================================== */

/* #region 1. CSS VARIABLES */

:root {
    --oreynia-color-primary: #ffffff;
    --oreynia-color-secondary: #000000;

    --oreynia-background-color-primary: #59505f;
    --oreynia-background-color-secondary: #537895;
    --oreynia-background-color-tertiary: #BCC5CE;
    --oreynia-background-color-quaternary: #929EAD;

    --oreynia-interactive-color-primary: magenta;
    --oreynia-interactive-color-secondary: darkmagenta;
    --oreynia-interactive-color-tertiary: red

    --oreynia-highlight-color-primary: cyan;
    --oreynia-highlight-color-secondary: lightcyan;
}

/* #endregion */

/* #region 2. GLOBAL TYPOGRAPHY */

p {
    color: var(--oreynia-color-primary);
}

a {
    color: var(--oreynia-interactive-color-primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    color: var(--oreynia-interactive-color-primary);
}

a:visited {
    color: var(--oreynia-interactive-color-secondary);
}

a.new {
    color: var(--oreynia-interactive-color-tertiary);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--oreynia-color-secondary);
}

/* #endregion */

/* #region 3. MAIN LAYOUT */

html, body {
    min-height: 100vh !important;
    height: auto;
    margin: 0;
    background: linear-gradient(-180deg, var(--oreynia-background-color-tertiary) 0%, var(--oreynia-background-color-quaternary) 98%), radial-gradient(at top left, rgba(255,255,255,0.30) 0%, rgba(0,0,0,0.30) 100%) !important;
    background-blend-mode: screen !important;
    background-attachment: fixed !important; 
    background-size: cover !important;
}

.mw-page-container
{
  min-height: 100vh;
  height: auto !important;
  background-image: linear-gradient(0deg, var(--oreynia-background-color-primary) 0%, var(--oreynia-background-color-secondary) 100%);
}

.mw-header {
  background-image: linear-gradient(30deg, var(--oreynia-background-color-primary) 0%, var(--oreynia-background-color-secondary) 100%);
}

/* #endregion */