MediaWiki:Common.css
Jump to navigation
Jump to search
Note: After saving, 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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */
/* ========================= */
/* BODY STYLES */
/* ========================= */
body {
background: linear-gradient(to top, #191919 0%, #1d1d1d 33%, #202020 100%) !important; /* Smooth fade from #191919 to #202020 */
color: #F2F3F5; /* Force text color */
padding: 0; /* Remove padding */
margin: 0; /* Optionally remove margin as well */
}
/* ========================== */
/* ====== BODY BORDER ======= */
/* ========================== */
/* Remove left border */
#content, .mw-body {
border-left: none !important;
outline: none !important;
box-shadow: none !important;
}
/* Or if it's on the body */
body {
border-left: none !important;
outline: none !important;
box-shadow: none !important;
}
/* ========================= */
/* CONTENT STYLES */
/* ========================= */
#content {
background-color: #191919 !important; /* Solid color */
color: #F2F3F5 !important; /* Force text color */
padding: 10px; /* Adjust padding as needed */
}
/* Sets background color of the logo area */
#p-logo {
background-color: transparent !important; /* Remove background color */
}
/* ========================= */
/* NAVIGATION MENU STYLES */
/* ========================= */
#p-navigation {
background: linear-gradient(to bottom, #202020 0%, #191919 100%) !important; /* Fade from #202020 to #191919 */
}
/* Change color for all links in the navigation menu */
#p-navigation a {
color: #90b7f9 !important; /* Set the default link color */
}
/* Change hover color for all links in the navigation menu */
#p-navigation a:hover {
color: #955bc2; /* Set the hover color for links */
}
/* ========================= */
/* TABLE OF CONTENTS STYLES */
/* ========================= */
.mw-parser-output .toc {
background-color: #343434;
border: 1px solid #444241;
}
/* ========================= */
/* HEADING STYLES */
/* ========================= */
h1 {
color: #F2F3F5 !important; /* Force heading colors */
}
h2 {
color: #F2F3F5 !important; /* Force Heading Colors */
}
h3 {
color; #F2F3F5 !important; /* Force Heading Colors */
}
@media screen {
h1, h2, h3, h4, h5, h6 {
color: #e6e6e6;
}
}
/* ========================= */
/* LINK STYLES */
/* ========================= */
a {
color: #90b7f9; /* Set the default link color */
}
a:hover {
color: #955bc2; /* Set the hover color for links */
}
/* ========================= */
/* TOP BAR STYLES */
/* ========================= */
#mw-head {
background: linear-gradient(to bottom, #191919 0%, #202020 100%) !important; /* Fade from #191919 to #202020 */
color: #e6e6e6 !important; /* Ensure text color matches */
padding: 0px; /* Adjust padding as needed */
border: none !important; /* Remove any borders */
margin: 0; /* Remove any margin */
}
#mw-head a {
color: #90b7f9; /* Force link color in top bar */
padding: 5px 10px;
}
/* ========================= */
/* NOTABLE MEMBERS STYLES */
/* ========================= */
.notable-members {
background-color: #343434 !important;
color: #e6e6e6 !important;
}
.notable-members th, .notable-members td {
border: 3px solid #151515;
color: #F2F3F5 !important; /* Force cell text color */
}
/* ========================= */
/* TOOLS SECTION STYLES */
/* ========================= */
#p-tb a {
color: #90b7f9; /* Set the default link color */
}
#p-tb a:hover {
color: #955bc2; /* Set the hover color for links */
}
/* ========================= */
/* GRADIENT MENU STYLES */
/* ========================= */
/* Change background for the "Read," "Edit," and "View history" links */
.ca-menu {
background: linear-gradient(to right, #252525, rgba(144, 183, 249, 0.5)); /* Fade effect */
}
/* Change text color for the links */
.ca-menu a {
color: #90b7f9 !important; /* Set the text color */
}
/* ============================= */
/* Change color of visited links */
/* ============================= */
a:visited {
color: #955bc2; /* Set the visited link color */
}
/* ========================================================================= */
/* THIS IS FOR THE "MAIN PAGE, VIEW, EDIT, READ" BARS ON THE TOP OF THE PAGE */
/* ========================================================================= */
/* Base tab style */
.vectorTabs li a {
background: linear-gradient(to top, #191919 0%, #1a1a1a 15%, #1b1b1b 30%, #1c1c1c 45%, #1d1d1d 60%, #1e1e1e 75%, #202020 100%) !important; /* very smooth fade */
color: #e6e6e6 !important;
padding: 5px 10px !important;
border: none !important; /* Remove any borders */
border-radius: 0 !important; /* Remove rounded corners */
text-decoration: none !important;
position: relative; /* enable pseudo-element positioning */
transition: background 0.3s ease; /* smooth transition */
margin: 0; /* Remove any margin */
box-shadow: none !important; /* Ensure no box shadow is applied */
}
/* Hover effect for color fade */
.vectorTabs li a:hover {
background: linear-gradient(to top, #202020 0%, #1e1e1e 15%, #1d1d1d 30%, #1c1c1c 45%, #1b1b1b 60%, #1a1a1a 75%, #191919 100%) !important; /* reverse gradient on hover */
}
/* Styles for selected tab */
.vectorTabs li.selected a {
background: linear-gradient(to top, #191919 0%, #1d1c1c 100%) !important; /* Fade from #191919 to #1d1c1c */
}
/* Blue fading overlay using a pseudo-element for inactive tabs */
.vectorTabs li:not(.selected) a::before {
content: '';
position: absolute;
top: 0; left: 0px; right: 0; bottom: 0;
background: linear-gradient(
to top,
rgba(30, 144, 255, 0.2), /* DodgerBlue with opacity from bottom */
rgba(25, 25, 25, 0.8) /* dark fade at the top */
);
border-radius: 0 !important; /* No rounded corners */
pointer-events: none; /* allow clicks through this layer */
}
/* Ensure text is above the overlay */
.vectorTabs li.selected a > * {
position: relative;
z-index: 1;
}
/* Remove any padding on list items */
.vectorTabs li {
padding: 0px !important; /* Remove padding */
margin: 0px !important; /* Remove margin */
}
/* =================================================== */
/* ======= border removal from the vector tabs ======= */
/* =================================================== */
@media screen {
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3 {
background-image: url(/wiki/skins/Vector/resources/skins.vector.styles/images/tab-separator.png?09d4b);
background-image: linear-gradient(to bottom,rgba(167,215,249,0) 0,#a7d7f9 100%);
background-repeat: no-repeat;
background-size: 0px 100%;
}
}
/* =================================== */
/* ======== SEARCH BAR CONFIG ======== */
/* =================================== */
/* =============================================== */
/* ============left page coloring ================ */
/* =============================================== */
/* ================================== */
/* ========== TESTING =============== */
/* ================================== */
/* Change background color of the categories and footer area */
.mw-footer {
background-color: #202020;
}