MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* ===== Bitcraft | /* ===== Bitcraft base theme (Vector 2010) ===== */ | ||
/* | /* Global colour variables – tweak later */ | ||
:root { | |||
--bitcraft-body-bg: #050b16; /* dark outer background */ | |||
--bitcraft-body-main: #ffffff; /* article background */ | |||
--bitcraft-text-color: #111827; | |||
--bitcraft-link: #38bdf8; | |||
--bitcraft-link-hover: #0ea5e9; | |||
--bitcraft-footer-text: #e5e7eb; | |||
--bitcraft-footer-bg: #020617; | |||
--body-background-image: url("/images/background.png"); | |||
} | |||
/* Overall page background + hero image behind logo & top bar */ | |||
html, | html, | ||
body { | body { | ||
background-color: | background-color: var(--bitcraft-body-bg); | ||
background-image: var(--body-background-image); | |||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: left top; | background-position: left top; | ||
background-size: | background-size: 1000px auto; /* adjust width/height as needed */ | ||
} | } | ||
/* Remove default Vector grey/white header blocks */ | |||
#mw-page-base, | |||
#mw-head-base { | #mw-head-base { | ||
background: | background: transparent !important; | ||
box-shadow: none; | |||
border: 0; | |||
box-shadow: | |||
} | } | ||
/* | /* Sidebar: let the art show at top, dark lower down */ | ||
#mw-panel { | #mw-panel { | ||
background: rgba( | background: linear-gradient( | ||
to bottom, | |||
rgba(5, 11, 22, 0) 0, | |||
rgba(5, 11, 22, 0.9) 140px, | |||
rgba(5, 11, 22, 1) 100% | |||
); | |||
color: #e5e7eb; | color: #e5e7eb; | ||
} | } | ||
/* Sidebar headings + links */ | |||
#mw-panel .vector-menu-heading { | #mw-panel .vector-menu-heading { | ||
color: #e5e7eb !important; | color: #e5e7eb !important; | ||
| Line 54: | Line 50: | ||
#mw-panel .vector-menu-content a, | #mw-panel .vector-menu-content a, | ||
#mw-panel .vector-menu-content a:visited { | #mw-panel .vector-menu-content a:visited { | ||
color: #bfdbfe !important; | color: #bfdbfe !important; | ||
} | } | ||
#mw-panel .vector-menu-content a:hover { | #mw-panel .vector-menu-content a:hover { | ||
color: #e0f2fe !important; | color: #e0f2fe !important; | ||
} | } | ||
/* | /* Article “card” in the middle */ | ||
.mw-body { | |||
background-color: var(--bitcraft-body-main); | |||
color: var(--bitcraft-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, | ||
.vector-menu-tabs .vector-menu-content-list > li > a:visited { | .vector-menu-tabs .vector-menu-content-list > li > a:visited { | ||
| Line 71: | Line 84: | ||
.vector-menu-tabs .vector-menu-content-list > li.selected > a { | .vector-menu-tabs .vector-menu-content-list > li.selected > a { | ||
background-color: rgba(15, 23, 42, 0.85); | background-color: rgba(15, 23, 42, 0.85); | ||
border-color: #1d4ed8 #1d4ed8 transparent; | border-color: #1d4ed8 #1d4ed8 transparent; | ||
color: #ffffff; | color: #ffffff; | ||
| Line 85: | Line 98: | ||
color: #e5e7eb; | color: #e5e7eb; | ||
} | } | ||
#p-personal a:hover { | #p-personal a:hover { | ||
color: #bfdbfe; | color: #bfdbfe; | ||
} | } | ||
/* | /* Search box */ | ||
#p-search, | |||
.vector-search-box { | |||
background: transparent; | |||
} | |||
.vector-search-box input, | .vector-search-box input, | ||
| Line 98: | Line 114: | ||
border-color: #1e293b; | border-color: #1e293b; | ||
} | } | ||
.vector-search-box input::placeholder, | .vector-search-box input::placeholder, | ||
.vector-search-box .cdx-text-input__input::placeholder { | .vector-search-box .cdx-text-input__input::placeholder { | ||
| Line 104: | Line 119: | ||
} | } | ||
/* | /* Links inside article content */ | ||
.mw-body a { | .mw-body a { | ||
color: | color: var(--bitcraft-link); | ||
} | } | ||
.mw-body a:hover { | |||
.mw-body a: | color: var(--bitcraft-link-hover); | ||
.mw-body a: | } | ||
color: | .mw-body a:visited { | ||
color: var(--bitcraft-link-hover); | |||
} | } | ||
.mw-body a.new { | .mw-body a.new { | ||
color: #f97373 !important; /* redlinks */ | color: #f97373 !important; /* redlinks */ | ||
} | } | ||
/* | /* Footer */ | ||
.mw-footer, | .mw-footer, | ||
#footer { | #footer { | ||
background: | background: var(--bitcraft-footer-bg); | ||
color: | color: var(--bitcraft-footer-text); | ||
border-top: none; | |||
} | } | ||
.mw-footer a, | .mw-footer a, | ||
.mw-footer a:visited, | .mw-footer a:visited, | ||
| Line 133: | Line 146: | ||
} | } | ||
/* | /* Center the main content a bit, like Brighter Shores */ | ||
body .mw-body { | body .mw-body { | ||
max-width: 75em; | max-width: 75em; | ||
Revision as of 14:50, 27 December 2025
/* ===== Bitcraft base theme (Vector 2010) ===== */
/* Global colour variables – tweak later */
:root {
--bitcraft-body-bg: #050b16; /* dark outer background */
--bitcraft-body-main: #ffffff; /* article background */
--bitcraft-text-color: #111827;
--bitcraft-link: #38bdf8;
--bitcraft-link-hover: #0ea5e9;
--bitcraft-footer-text: #e5e7eb;
--bitcraft-footer-bg: #020617;
--body-background-image: url("/images/background.png");
}
/* Overall page background + hero image behind logo & top bar */
html,
body {
background-color: var(--bitcraft-body-bg);
background-image: var(--body-background-image);
background-repeat: no-repeat;
background-position: left top;
background-size: 1000px auto; /* adjust width/height as needed */
}
/* Remove default Vector grey/white header blocks */
#mw-page-base,
#mw-head-base {
background: transparent !important;
box-shadow: none;
border: 0;
}
/* Sidebar: let the art show at top, dark lower down */
#mw-panel {
background: linear-gradient(
to bottom,
rgba(5, 11, 22, 0) 0,
rgba(5, 11, 22, 0.9) 140px,
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-panel .vector-menu-content a:visited {
color: #bfdbfe !important;
}
#mw-panel .vector-menu-content a:hover {
color: #e0f2fe !important;
}
/* Article “card” in the middle */
.mw-body {
background-color: var(--bitcraft-body-main);
color: var(--bitcraft-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;
}
.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;
}