MediaWiki:Common.css
Appearance
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* CSS placed here will be applied to all skins */ img { filter: none !important; } /* Ensure text in ConfirmAccount fields is visible */ textarea { color: black !important; background-color: white !important; } .collapsible-header { cursor: pointer; font-weight: bold; padding: 8px; background-color: #e6e6e6; border-radius: 5px; margin-bottom: 5px; } .collapsible-header::before { content: "▶ "; } .collapsible-header.active::before { content: "▼ "; } .collapsible-content { display: none; padding-left: 15px; } .collapsible-subheader { cursor: pointer; font-weight: bold; padding-left: 10px; } .collapsible-subheader::before { content: "▶ "; } .collapsible-subheader.active::before { content: "▼ "; } .collapsible-subcontent { display: none; padding-left: 20px; } /* Make main menu sections collapsible */ .collapsible-header { cursor: pointer; font-weight: bold; padding: 5px; border-bottom: 1px solid #ddd; } .collapsible-content { display: none; padding-left: 10px; } /* Make submenus collapsible */ .collapsible-subheader { cursor: pointer; font-weight: bold; padding: 5px; margin-left: 10px; border-bottom: 1px solid #ccc; } .collapsible-subcontent { display: none; padding-left: 20px; } /* Ensure collapsible headers are readable in dark mode */ .collapsible-header, .collapsible-subheader { color: var(--theme-text-color, white) !important; /* Dynamic text color */ background-color: var(--theme-background-color, #831f82) !important; /* Slight contrast */ border-radius: 5px; /* Slightly rounded corners for a clean look */ padding: 5px 10px; font-weight: bold; } /* Dark mode adjustments */ .skin-dark .collapsible-header, .skin-dark .collapsible-subheader { color: white !important; /* Make text white in dark mode */ background-color: #222 !important; /* Dark background */ border: 1px solid #444; /* Subtle border */ } .collapsible-header { width: 75%; /* Change this to any percentage or pixel value */ max-width: 600px; /* Prevents bars from getting too wide on large screens */ } .collapsible-subheader { width: 75%; /* Ensures submenus match main menu width */ max-width: 600px; } .collapsible-subcontent { width: 75%; /* Ensures submenus match main menu width */ max-width: 600px; } .footer-button { background-color: #5d1361 !important; color: white !important; padding: 8px 15px; margin: 5px; border-radius: 5px; text-decoration: none !important; display: inline-block; } .footerlinks { clear: both !important; /* Pushes footer BELOW all floating elements */ background-color: #831f82; color: white; text-align: center; padding: 5px; } /* This rule targets all states for links inside .custom-link-container */ .custom-link-container a, .custom-link-container a:link, .custom-link-container a:visited, .custom-link-container a:hover, .custom-link-container a:active, .custom-link-container a:focus { color: #ffffff !important; /* White text in all states */ /* text-decoration: none !important; No underline */ background-color: transparent !important; /* Remove any background on hover */ box-shadow: none !important; /* Disable any box-shadow that might simulate a border */ }