|
|
| Line 1: |
Line 1: |
| /* All CSS here will be loaded for users of the Vector skin */
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 1. Global / Base Styles */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Dark background for the overall page, top header strip, and page background */
| |
| body,
| |
| #mw-head-base,
| |
| #mw-page-base {
| |
| background-color: #1a1a1a; /* Very dark gray, almost black */
| |
| color: #e0e0e0; /* Light gray for default text */
| |
| }
| |
|
| |
| /* General link styles (fallback for links not covered by more specific rules) */
| |
| a {
| |
| color: #7aa06e; /* Dull aqua green for unvisited links */
| |
| }
| |
| a:visited {
| |
| color: #cccccc; /* Light grey for visited links */
| |
| }
| |
| a:hover {
| |
| color: #a3be8c; /* A light green for hover */
| |
| }
| |
|
| |
| /* Style for links to non-existent pages ("red links") */
| |
| a.new {
| |
| color: #ffff00; /* Yellow for non-existent page links */
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 2. Main Content Area (#content) and Main Page Text */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| #content {
| |
| background-color: #2a2a2a; /* A slightly lighter dark gray for contrast with body */
| |
| color: #e0e0e0; /* Light gray for general text within the content area */
| |
| border-color: #444; /* Darker border if there's one around the content */
| |
| }
| |
|
| |
| /* Ensure all common text elements within the main content area are light */
| |
| #content p,
| |
| #content ul,
| |
| #content ol,
| |
| #content li,
| |
| #content dl,
| |
| #content dd,
| |
| #content dt,
| |
| #content div { /* Added div for general block elements */
| |
| color: #e0e0e0;
| |
| }
| |
|
| |
| /* Headings within content */
| |
| #content h1,
| |
| #content h2,
| |
| #content h3,
| |
| #content h4,
| |
| #content h5,
| |
| #content h6 {
| |
| color: #f0f0f0; /* Slightly lighter headings */
| |
| }
| |
|
| |
| /* Specific link styles for links inside the main content area */
| |
| #content a {
| |
| color: #7aa06e; /* Dull aqua green for unvisited links within content */
| |
| }
| |
| #content a:visited {
| |
| color: #cccccc; /* Light grey for visited links within content */
| |
| }
| |
| #content a:hover {
| |
| color: #a3be8c; /* Light green on hover for links within content */
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 3. Table of Contents (TOC) */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Style for the Table of Contents heading */
| |
| .mw-toc-heading {
| |
| color: #f0f0f0; /* Set a light color for the heading text */
| |
| background-color: #3a3a3a; /* Set a dark background color for the heading */
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 4. Footer */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Style for the footer area */
| |
| #footer {
| |
| background-color: #1a1a1a; /* Match your body background for consistency */
| |
| color: #e0e0e0; /* Light gray for general text in the footer */
| |
| }
| |
|
| |
| /* Specific link styles within the footer */
| |
| #footer a {
| |
| color: #7aa06e; /* Dull aqua green for unvisited links in footer */
| |
| }
| |
| #footer a:visited {
| |
| color: #cccccc; /* Light grey for visited links in footer */
| |
| }
| |
| #footer a:hover {
| |
| color: #a3be8c; /* Light green on hover in footer */
| |
| }
| |
|
| |
| /* Specific list item text color within the footer */
| |
| #footer li {
| |
| color: #e0e0e0;
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 5. Search Box */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Style for the search input field */
| |
| #searchInput {
| |
| background-color: #ffffff; /* White interior */
| |
| color: #333333; /* Darker color for typed text */
| |
| }
| |
|
| |
| /* Style for the placeholder text (the default text in the search window) */
| |
| #searchInput::placeholder { /* Standard placeholder selector */
| |
| color: #666666; /* A dark grey for the default placeholder text */
| |
| opacity: 1; /* Ensure full opacity in Firefox */
| |
| }
| |
| #searchInput::-webkit-input-placeholder { /* For Webkit browsers (Chrome, Safari) */
| |
| color: #666666;
| |
| }
| |
| #searchInput::-moz-placeholder { /* For Firefox */
| |
| color: #666666;
| |
| opacity: 1; /* Override Firefox's default lower opacity */
| |
| }
| |
| #searchInput:-ms-input-placeholder { /* For Internet Explorer 10+ */
| |
| color: #666666;
| |
| }
| |
| #searchInput::-ms-input-placeholder { /* For Microsoft Edge */
| |
| color: #666666;
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 6. Main Page and Discussion Tabs (Page-level navigation) */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Base styles for all top tabs */
| |
| #p-views ul li {
| |
| background-color: #3a3a3a; /* Dark background for unselected tabs */
| |
| border-color: #444; /* Darker border for tabs */
| |
| /* Override any default background images for tabs */
| |
| background-image: none !important;
| |
| }
| |
|
| |
| #p-views ul li a {
| |
| color: #e0e0e0; /* Light text color for tab links */
| |
| /* Override any default background images for tab links */
| |
| background-image: none !important;
| |
| }
| |
|
| |
| /* Styles for the currently selected tab */
| |
| #p-views ul li.selected {
| |
| background-color: #2a2a2a; /* Darker background for the selected tab (match #content) */
| |
| border-color: #444; /* Darker border */
| |
| background-image: none !important; /* Override background image for selected tab too */
| |
| }
| |
|
| |
| #p-views ul li.selected a {
| |
| color: #f0f0f0; /* Slightly lighter text color for the selected tab link */
| |
| }
| |
|
| |
| /* Hover state for tabs */
| |
| #p-views ul li:not(.selected):hover {
| |
| background-color: #4a4a4a; /* Slightly lighter dark background on hover for unselected tabs */
| |
| background-image: none !important; /* Override background image on hover */
| |
| }
| |
|
| |
| #p-views ul li:not(.selected):hover a {
| |
| color: #ffffff; /* White text on hover for unselected tabs */
| |
| }
| |
|
| |
| /* Specific overrides for the vector-menu-tabs and dropdown heading for background gradients */
| |
| .vector-menu-tabs,
| |
| .vector-menu-tabs a,
| |
| #mw-head .vector-menu-dropdown .vector-menu-heading {
| |
| background-image: none !important; /* Remove the light gradient */
| |
| background-color: #3a3a3a !important; /* Set to a dark solid color */
| |
| color: #e0e0e0 !important; /* Ensure text is light */
| |
| }
| |
|
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 7. Header elements (mw-head, mw-wiki-logo) */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Styles for the main header area, including borders and background */
| |
| #mw-head {
| |
| background-color: #1a1a1a; /* Ensure the header background is dark */
| |
| border-bottom-color: #444; /* Dark border at the bottom of the header */
| |
| }
| |
|
| |
| /* Styles for the wiki logo area */
| |
| #mw-wiki-logo {
| |
| background-color: transparent; /* Ensure the logo background is transparent or matches main background */
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */
| |
| /* 8. Left Navigation / Sidebar (#mw-panel) */
| |
| /* -------------------------------------------------------- */
| |
|
| |
| /* Overall sidebar background */
| |
| #mw-panel {
| |
| background-color: #1a1a1a; /* Match body background */
| |
| color: #e0e0e0; /* Light text for general sidebar content */
| |
| border-color: #444; /* Darker border for the sidebar if present */
| |
| }
| |
|
| |
| /* Individual portal (section) within the sidebar */
| |
| #mw-panel div.portal {
| |
| background-color: #1a1a1a; /* Ensure portal backgrounds are dark */
| |
| border-color: #444; /* Darker borders for sections */
| |
| }
| |
|
| |
| /* Headings for sidebar sections (e.g., "Navigation", "Tools") */
| |
| #mw-panel div.portal h3 {
| |
| color: #f0f0f0; /* Light color for section headings */
| |
| border-color: #444; /* Darker border under headings */
| |
| }
| |
|
| |
| /* Links within sidebar sections */
| |
| #mw-panel div.body ul li a {
| |
| color: #7aa06e; /* Dull aqua green for unvisited links */
| |
| }
| |
|
| |
| #mw-panel div.body ul li a:visited {
| |
| color: #cccccc; /* Light grey for visited links */
| |
| }
| |
|
| |
| #mw-panel div.body ul li a:hover {
| |
| color: #a3be8c; /* Light green on hover */
| |
| background-color: #3a3a3a; /* Slight dark background on hover */
| |
| }
| |
|
| |
| /* Ensure list item text is visible if it's not a link */
| |
| #mw-panel div.body ul li {
| |
| color: #e0e0e0; /* Light text for any non-link list items */
| |
| }
| |
|
| |
| /* Specific styling for list items with mw-list-item class in the sidebar */
| |
| #mw-panel li.mw-list-item a {
| |
| color: #7aa06e; /* Apply dull aqua green for links inside mw-list-item */
| |
| }
| |
|
| |
| #mw-panel li.mw-list-item a:visited {
| |
| color: #cccccc; /* Apply light grey for visited links */
| |
| }
| |
|
| |
| #mw-list-item a:hover {
| |
| color: #a3be8c; /* Apply light green on hover */
| |
| background-color: #3a3a3a; /* Apply slight dark background on hover */
| |
| }
| |
|
| |
| /* Ensure the list item itself has a dark background and light text if not a link */
| |
| #mw-panel li.mw-list-item {
| |
| background-color: transparent; /* Or a specific dark color if needed */
| |
| color: #e0e0e0; /* Light text color for the list item itself */
| |
| }
| |
|
| |
| /* -------------------------------------------------------- */ | | /* -------------------------------------------------------- */ |
| /* 9. Main Page Custom Styles - Future Use */ | | /* 9. Main Page Custom Styles - Future Use */ |
| Line 298: |
Line 34: |
| } | | } |
| */ | | */ |
| | |
| | .qme-column { |
| | background-color: #2a2a2a; /* Dark background */ |
| | color: #e0e0e0; /* Light text color */ |
| | border: 1px solid #444; /* Optional: A subtle dark border for consistency */ |
| | padding: 1em; /* Add some padding if needed, adjust as desired */ |
| | } |