|
Tags: Blanking Manual revert |
(18 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| /* Dark Mode for MediaWiki - Comprehensive Styling */
| |
|
| |
|
| /* Base styles for the entire page */
| |
| html, body {
| |
| background-color: #000; /* Black background */
| |
| color: #fff; /* White text */
| |
| }
| |
|
| |
| /* Headers */
| |
| h1, h2, h3, h4, h5, h6 {
| |
| color: #fff;
| |
| }
| |
|
| |
| /* Links */
| |
| a {
| |
| color: #761626; /* Maroon for links */
| |
| }
| |
| a:hover {
| |
| color: #ff0000; /* Bright red on hover for better visibility */
| |
| }
| |
| a:visited {
| |
| color: #99334d; /* A different shade for visited links */
| |
| }
| |
|
| |
| /* Navigation - Top bar */
| |
| #mw-head {
| |
| background-color: #1a1a1a; /* Darker gray for top navigation */
| |
| color: #fff;
| |
| border-bottom: 1px solid #761626; /* Maroon border */
| |
| }
| |
|
| |
| /* Sidebar */
| |
| #mw-panel {
| |
| background-color: #1a1616; /* Slightly lighter black for sidebar */
| |
| color: #fff;
| |
| border-right: 1px solid #761626; /* Maroon border */
| |
| }
| |
|
| |
| /* Sidebar links */
| |
| #mw-panel .portal .body li a {
| |
| color: #761626; /* Maroon for sidebar links */
| |
| }
| |
| #mw-panel .portal .body li a:hover {
| |
| color: #ff0000; /* Bright red on hover */
| |
| }
| |
|
| |
| /* Content area */
| |
| #content {
| |
| background-color: #000; /* Black for main content */
| |
| border: 1px solid #761626; /* Maroon border */
| |
| }
| |
|
| |
| /* Main content text */
| |
| .mw-body-content {
| |
| color: #fff;
| |
| }
| |
|
| |
| /* Tables */
| |
| table {
| |
| background-color: #1a1a1a; /* Darker gray for tables */
| |
| color: #fff;
| |
| border: 1px solid #761626;
| |
| }
| |
| th, td {
| |
| border: 1px solid #761626;
| |
| }
| |
|
| |
| /* Input fields */
| |
| input, textarea, select {
| |
| background-color: #333; /* Dark background for inputs */
| |
| color: #fff;
| |
| border: 1px solid #761626;
| |
| }
| |
|
| |
| /* Buttons */
| |
| button {
| |
| background-color: #761626;
| |
| color: #fff;
| |
| border: none;
| |
| padding: 10px 20px;
| |
| cursor: pointer;
| |
| }
| |
|
| |
| /* Footer */
| |
| #footer {
| |
| background-color: #1a1a1a;
| |
| color: #fff;
| |
| border-top: 1px solid #761626;
| |
| }
| |
|
| |
| /* Custom adjustments for readability */
| |
| .mw-body-content p {
| |
| color: #fff;
| |
| }
| |
|
| |
| /* Focus styles for accessibility */
| |
| :focus {
| |
| outline: 3px solid #761626; /* Visible focus for keyboard navigation */
| |
| }
| |
|
| |
| /* High contrast mode toggle */
| |
| body.high-contrast {
| |
| background: #000;
| |
| color: #fff;
| |
| }
| |
| body.high-contrast a {
| |
| color: #ff0000; /* Bright red for high contrast */
| |
| }
| |
|
| |
| /* Media query for system preference dark mode */
| |
| @media (prefers-color-scheme: dark) {
| |
| html, body {
| |
| background-color: #000;
| |
| color: #fff;
| |
| }
| |
| a {
| |
| color: #761626;
| |
| }
| |
| /* Add more specific styles if needed based on system preference */
| |
| }
| |
|
| |
| /* Additional styles for other common elements */
| |
| .vector-menu-content {
| |
| background-color: #1a1616;
| |
| }
| |
| .vector-menu-content a {
| |
| color: #761626;
| |
| }
| |
| .vector-menu-content a:hover {
| |
| color: #ff0000;
| |
| }
| |
|
| |
| /* Search bar */
| |
| #simpleSearch {
| |
| background-color: #333;
| |
| border: 1px solid #761626;
| |
| }
| |
| #simpleSearch input {
| |
| background-color: #333;
| |
| color: #fff;
| |
| }
| |
|
| |
| /* User tools */
| |
| #p-personal {
| |
| background-color: #1a1616;
| |
| color: #fff;
| |
| }
| |
| #p-personal a {
| |
| color: #761626;
| |
| }
| |
| #p-personal a:hover {
| |
| color: #ff0000;
| |
| }
| |
|
| |
| /* Ensure all text areas have good contrast */
| |
| pre, code {
| |
| background-color: #333;
| |
| color: #fff;
| |
| }
| |