MediaWiki:Common.css: Difference between revisions

From Bitcraft Wiki
Jump to navigation Jump to search
No edit summary
Tag: Manual revert
No edit summary
Line 1: Line 1:
/* ===== Bitcraft base theme (Vector 2010) ===== */
/* Global colour variables – tweak later */
:root {
:root {
     --bitcraft-body-bg: #050b16;         /* dark outer background */
     --body-main: #fdfcfc;
     --bitcraft-body-main: #ffffff;       /* article background */
    --body-light: #e7e5e4;
     --bitcraft-text-color: #111827;
    --body-mid: #cbb7ae;
     --bitcraft-link: #38bdf8;
    --body-dark: #9f847a;
     --bitcraft-link-hover: #0ea5e9;
    --body-darker: #755c52;
     --bitcraft-footer-text: #e5e7eb;
    --body-border: #bba9a1;
     --bitcraft-footer-bg: #020617;
    --body-border-dark: #bba9a1;
     --body-background-image: url("/images/background.png");
    --body-background-color: #173a4d;
     --button-background: #605443;
    --button-color: #fff;
    --button-border: #3c352a;
    --button-dark: #18140c;
    --button-light: #3a301d;
    --tooltip-button-background: #3a301d;
    --sidebar: #cfc08d;
     --background-text-color: #e2dbc8;
     --background-link-color: #e2bd8a;
     --search-box: #fdfcfc;
    --link-color: #8b694f;
     --table-header-link: #6d5248;
    --redlink-color: #cd4343;
    --text-color: #2F2828;
    --byline-color: #4c4c4c;
    --subtle-color: #afa19a;
    --admin-color: #6bc71f;
    --bureaucrat-color: #855cd8;
    --awb-color: #e874cf;
    --rsw-blue: #438ab6;
    --osrsw-brown: #605443;
    --thumb-bg: var(--body-light);
     --thumb-caption-bg: var(--body-dark);
    --sourceeditor-input-background: #fff;
     --sourceeditor-background: var(--body-light);
    --sourceeditor-background-secondary: var(--body-light);
    --sourceeditor-border: var(--body-mid);
    --codemirror-gutter-background: var(--body-mid);
}
}


/* Overall page background + hero image behind logo & top bar */
@font-face {  
html,
     font-family: 'Lora';
body {
     font-weight: 400 700;
     background-color: var(--bitcraft-body-bg);
     font-style: normal;
     background-image: var(--body-background-image);
     font-display: swap;
     background-repeat: no-repeat;
     src: url('filepath://Lora.woff2') format('woff2');
     background-position: left top;
     background-size: 1000px auto; /* adjust width/height as needed */
}
}


/* Remove default Vector grey/white header blocks */
@font-face {
#mw-page-base,
    font-family: 'Lora';
#mw-head-base {
    font-weight: 400 700;
     background: transparent !important;
     font-style: italic;
     box-shadow: none;
     font-display: swap;
     border: 0;
     src: url('filepath://Lora-Italic.woff2') format('woff2');
}
}


/* Sidebar: let the art show at top, dark lower down */
:root {
#mw-panel {
     --base-text-color: #36414f;
     background: linear-gradient(
     --base-heading-color: #444e5a;
        to bottom,
    --base-heading-border: #e4eaee;
        rgba(5, 11, 22, 0) 0,
     --mw-code-background-color: var(--body-light);
        rgba(5, 11, 22, 0.9) 140px,
     --body-background-image: url('filepath://background.png');
        rgba(5, 11, 22, 1) 100%
    );
     color: #e5e7eb;
}
 
/* Sidebar headings + links */
#mw-panel .vector-menu-heading {
     color: #e5e7eb !important;
     font-weight: 600;
}
}


#mw-panel .vector-menu-content a,
#mw-page-base {
#mw-panel .vector-menu-content a:visited {
     background: none;
    color: #bfdbfe !important;
}
#mw-panel .vector-menu-content a:hover {
     color: #e0f2fe !important;
}
}


/* Article “card” in the middle */
.mw-body {
.mw-body {
     background-color: var(--bitcraft-body-main);
     background-color: var(--body-main);
     color: var(--bitcraft-text-color);
     color: var(--text-color);
    border-color: transparent;
    box-shadow: 0 0 7px rgba(0, 0, 0, 0.3);
}
 
/* Article headings */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
    color: var(--bitcraft-text-color);
    border-color: #e5e7eb;
}
 
/* Top tabs (Read / Edit / View history / More) */
.vector-menu-tabs .vector-menu-content-list > li > a,
.vector-menu-tabs .vector-menu-content-list > li > a:visited {
    color: #e5e7eb;
    background: transparent;
     border-color: transparent;
     border-color: transparent;
}
     box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
 
     margin-top: 0;
.vector-menu-tabs .vector-menu-content-list > li.selected > a {
     background-color: rgba(15, 23, 42, 0.85);
     border-color: #1d4ed8 #1d4ed8 transparent;
    color: #ffffff;
}
 
.vector-menu-tabs .vector-menu-content-list > li > a:hover {
    color: #bfdbfe;
}
 
/* Personal links (Stewie, Talk, Preferences, etc.) */
#p-personal a,
#p-personal a:visited {
    color: #e5e7eb;
}
#p-personal a:hover {
    color: #bfdbfe;
}
 
/* Search box */
#p-search,
.vector-search-box {
    background: transparent;
}
 
.vector-search-box input,
.vector-search-box .cdx-text-input__input {
    background-color: #020617;
    color: #e5e7eb;
    border-color: #1e293b;
}
.vector-search-box input::placeholder,
.vector-search-box .cdx-text-input__input::placeholder {
    color: #64748b;
}
 
/* Links inside article content */
.mw-body a {
    color: var(--bitcraft-link);
}
.mw-body a:hover {
    color: var(--bitcraft-link-hover);
}
.mw-body a:visited {
    color: var(--bitcraft-link-hover);
}
.mw-body a.new {
    color: #f97373 !important; /* redlinks */
}
 
/* Footer */
.mw-footer,
#footer {
    background: var(--bitcraft-footer-bg);
    color: var(--bitcraft-footer-text);
    border-top: none;
}
.mw-footer a,
.mw-footer a:visited,
.mw-footer a:active {
    color: #93c5fd;
}
 
/* Center the main content a bit, like Brighter Shores */
body .mw-body {
    max-width: 75em;
    margin-left: auto;
    margin-right: auto;
}
}

Revision as of 15:00, 27 December 2025

:root {
    --body-main: #fdfcfc;
    --body-light: #e7e5e4;
    --body-mid: #cbb7ae;
    --body-dark: #9f847a;
    --body-darker: #755c52;
    --body-border: #bba9a1;
    --body-border-dark: #bba9a1;
    --body-background-color: #173a4d;
    --button-background: #605443;
    --button-color: #fff;
    --button-border: #3c352a;
    --button-dark: #18140c;
    --button-light: #3a301d;
    --tooltip-button-background: #3a301d;
    --sidebar: #cfc08d;
    --background-text-color: #e2dbc8;
    --background-link-color: #e2bd8a;
    --search-box: #fdfcfc;
    --link-color: #8b694f;
    --table-header-link: #6d5248;
    --redlink-color: #cd4343;
    --text-color: #2F2828;
    --byline-color: #4c4c4c;
    --subtle-color: #afa19a;
    --admin-color: #6bc71f;
    --bureaucrat-color: #855cd8;
    --awb-color: #e874cf;
    --rsw-blue: #438ab6;
    --osrsw-brown: #605443;
    --thumb-bg: var(--body-light);
    --thumb-caption-bg: var(--body-dark);
    --sourceeditor-input-background: #fff;
    --sourceeditor-background: var(--body-light);
    --sourceeditor-background-secondary: var(--body-light);
    --sourceeditor-border: var(--body-mid);
    --codemirror-gutter-background: var(--body-mid);
}

@font-face { 
    font-family: 'Lora';
    font-weight: 400 700;
    font-style: normal;
    font-display: swap;
    src: url('filepath://Lora.woff2') format('woff2');
}

@font-face { 
    font-family: 'Lora';
    font-weight: 400 700;
    font-style: italic;
    font-display: swap;
    src: url('filepath://Lora-Italic.woff2') format('woff2');
}

:root {
    --base-text-color: #36414f;
    --base-heading-color: #444e5a;
    --base-heading-border: #e4eaee;
    --mw-code-background-color: var(--body-light);
    --body-background-image: url('filepath://background.png');
}

#mw-page-base {
    background: none;
}

.mw-body {
    background-color: var(--body-main);
    color: var(--text-color);
    border-color: transparent;
    box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
    margin-top: 0;
}