Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
Line 17: | Line 17: | ||
} | } | ||
− | /* Sets background color of the logo area | + | /* Sets background color of the logo area */ |
#p-logo { | #p-logo { | ||
background-color: #202020; | background-color: #202020; | ||
Line 29: | Line 29: | ||
} | } | ||
− | /* | + | /* Navigation links */ |
#p-navigation a { | #p-navigation a { | ||
− | color: #90b7f9 !important; /* | + | color: #90b7f9 !important; /* Default link color */ |
} | } | ||
− | |||
#p-navigation a:hover { | #p-navigation a:hover { | ||
− | color: #955bc2; /* | + | color: #955bc2; /* Hover color */ |
} | } | ||
Line 50: | Line 49: | ||
/* HEADING STYLES */ | /* HEADING STYLES */ | ||
/* ========================= */ | /* ========================= */ | ||
− | + | h1, h2, h3 { | |
− | h1 { | ||
color: #e6e6e6 !important; /* Force heading colors */ | color: #e6e6e6 !important; /* Force heading colors */ | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
Line 67: | Line 57: | ||
/* ========================= */ | /* ========================= */ | ||
a { | a { | ||
− | color: #90b7f9; /* | + | color: #90b7f9; /* Default link color */ |
} | } | ||
a:hover { | a:hover { | ||
− | color: #955bc2; /* | + | color: #955bc2; /* Hover color */ |
+ | } | ||
+ | |||
+ | a:visited { | ||
+ | color: #955bc2; /* Visited link color */ | ||
} | } | ||
Line 82: | Line 76: | ||
#mw-head a { | #mw-head a { | ||
− | color: #90b7f9; /* | + | color: #90b7f9; /* Link color in top bar */ |
padding: 5px 10px; | padding: 5px 10px; | ||
} | } | ||
/* ========================= */ | /* ========================= */ | ||
− | /* NOTABLE MEMBERS STYLES | + | /* NOTABLE MEMBERS STYLES */ |
/* ========================= */ | /* ========================= */ | ||
.notable-members { | .notable-members { | ||
Line 103: | Line 97: | ||
/* ========================= */ | /* ========================= */ | ||
#p-tb a { | #p-tb a { | ||
− | color: #90b7f9; /* | + | color: #90b7f9; /* Default link color */ |
} | } | ||
#p-tb a:hover { | #p-tb a:hover { | ||
− | color: #955bc2; /* | + | color: #955bc2; /* Hover color */ |
} | } | ||
Line 113: | Line 107: | ||
/* GRADIENT MENU STYLES */ | /* GRADIENT MENU STYLES */ | ||
/* ========================= */ | /* ========================= */ | ||
− | |||
.ca-menu { | .ca-menu { | ||
background: linear-gradient(to right, #252525, rgba(144, 183, 249, 0.5)); /* Fade effect */ | background: linear-gradient(to right, #252525, rgba(144, 183, 249, 0.5)); /* Fade effect */ | ||
} | } | ||
− | |||
.ca-menu a { | .ca-menu a { | ||
− | color: #90b7f9 !important; /* | + | color: #90b7f9 !important; /* Text color */ |
} | } | ||
− | /* | + | /* ========================= */ |
− | /* | + | /* TABS STYLES */ |
− | /* | + | /* ========================= */ |
− | + | .vectorTabs { | |
− | + | border-top: 2px solid #1e90ff; /* Blue top border for the tabs */ | |
+ | padding: 0; /* Remove padding */ | ||
+ | margin: 0; /* Remove margin */ | ||
+ | box-shadow: none !important; /* Ensure no shadow */ | ||
} | } | ||
− | /* | + | /* Base tab item style */ |
− | /* | + | .vectorTabs li { |
− | /* | + | padding: 0 !important; /* Remove padding */ |
+ | margin: 0 !important; /* Remove margin */ | ||
+ | } | ||
− | /* | + | /* Tab links */ |
.vectorTabs li a { | .vectorTabs li a { | ||
− | background-color: #191919 !important; /* | + | background-color: #191919 !important; /* Dark base */ |
color: #e6e6e6 !important; | color: #e6e6e6 !important; | ||
− | padding: 5px 10px !important; | + | padding: 5px 10px !important; /* Adjust padding */ |
− | border: none !important; /* Remove | + | border: none !important; /* Remove borders */ |
− | border-radius: 0 !important; /* | + | border-radius: 0 !important; /* No rounded corners */ |
text-decoration: none !important; | text-decoration: none !important; | ||
− | position: relative; /* | + | position: relative; /* Enable pseudo-element positioning */ |
− | transition: background-color 0.3s ease | + | transition: background-color 0.3s ease; /* Transition effect */ |
− | |||
− | |||
} | } | ||
/* Hover effect */ | /* Hover effect */ | ||
.vectorTabs li a:hover { | .vectorTabs li a:hover { | ||
− | background-color: #212121 !important; | + | background-color: #212121 !important; /* Darker on hover */ |
color: white !important; | color: white !important; | ||
} | } | ||
− | /* Active tab | + | /* Active tab style */ |
.vectorTabs li.selected a { | .vectorTabs li.selected a { | ||
background-color: #191919 !important; | background-color: #191919 !important; | ||
− | color: #cce4ff !important; /* | + | color: #cce4ff !important; /* Lighter text color */ |
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
− | /* | + | /* Overlay effect for active tab */ |
.vectorTabs li.selected a::before { | .vectorTabs li.selected a::before { | ||
content: ''; | content: ''; | ||
Line 168: | Line 163: | ||
background: linear-gradient( | background: linear-gradient( | ||
to top, | to top, | ||
− | rgba(30, 144, 255, 0.2), | + | rgba(30, 144, 255, 0.2), /* DodgerBlue with opacity from bottom */ |
− | rgba(25, 25, 25, 0.8) | + | rgba(25, 25, 25, 0.8) /* Dark fade at the top */ |
); | ); | ||
border-radius: 0 !important; /* No rounded corners */ | border-radius: 0 !important; /* No rounded corners */ | ||
− | pointer-events: none; /* | + | pointer-events: none; /* Allow clicks through this layer */ |
z-index: 0; | z-index: 0; | ||
} | } | ||
Line 180: | Line 175: | ||
position: relative; | position: relative; | ||
z-index: 1; | z-index: 1; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } |
Revision as of 06:54, 5 May 2025
/* CSS placed here will be applied to all skins */ /* ========================= */ /* BODY STYLES */ /* ========================= */ body { background: #202020; color: #e6e6e6; /* Force text color */ } /* ========================= */ /* CONTENT STYLES */ /* ========================= */ #content { background-color: #191919; color: #e6e6e6 !important; /* Force text color */ } /* Sets background color of the logo area */ #p-logo { background-color: #202020; } /* ========================= */ /* NAVIGATION MENU STYLES */ /* ========================= */ #p-navigation { background-color: #202020; } /* Navigation links */ #p-navigation a { color: #90b7f9 !important; /* Default link color */ } #p-navigation a:hover { color: #955bc2; /* Hover color */ } /* ========================= */ /* TABLE OF CONTENTS STYLES */ /* ========================= */ .mw-parser-output .toc { background-color: #343434; border: 1px solid #444241; } /* ========================= */ /* HEADING STYLES */ /* ========================= */ h1, h2, h3 { color: #e6e6e6 !important; /* Force heading colors */ } /* ========================= */ /* LINK STYLES */ /* ========================= */ a { color: #90b7f9; /* Default link color */ } a:hover { color: #955bc2; /* Hover color */ } a:visited { color: #955bc2; /* Visited link color */ } /* ========================= */ /* TOP BAR STYLES */ /* ========================= */ #mw-head { background-color: #202020; } #mw-head a { color: #90b7f9; /* 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: 2px solid #e6e6e6; color: #e6e6e6 !important; /* Force cell text color */ } /* ========================= */ /* TOOLS SECTION STYLES */ /* ========================= */ #p-tb a { color: #90b7f9; /* Default link color */ } #p-tb a:hover { color: #955bc2; /* Hover color */ } /* ========================= */ /* GRADIENT MENU STYLES */ /* ========================= */ .ca-menu { background: linear-gradient(to right, #252525, rgba(144, 183, 249, 0.5)); /* Fade effect */ } .ca-menu a { color: #90b7f9 !important; /* Text color */ } /* ========================= */ /* TABS STYLES */ /* ========================= */ .vectorTabs { border-top: 2px solid #1e90ff; /* Blue top border for the tabs */ padding: 0; /* Remove padding */ margin: 0; /* Remove margin */ box-shadow: none !important; /* Ensure no shadow */ } /* Base tab item style */ .vectorTabs li { padding: 0 !important; /* Remove padding */ margin: 0 !important; /* Remove margin */ } /* Tab links */ .vectorTabs li a { background-color: #191919 !important; /* Dark base */ color: #e6e6e6 !important; padding: 5px 10px !important; /* Adjust padding */ border: none !important; /* Remove borders */ border-radius: 0 !important; /* No rounded corners */ text-decoration: none !important; position: relative; /* Enable pseudo-element positioning */ transition: background-color 0.3s ease; /* Transition effect */ } /* Hover effect */ .vectorTabs li a:hover { background-color: #212121 !important; /* Darker on hover */ color: white !important; } /* Active tab style */ .vectorTabs li.selected a { background-color: #191919 !important; color: #cce4ff !important; /* Lighter text color */ font-weight: bold !important; } /* Overlay effect for active tab */ .vectorTabs li.selected a::before { content: ''; position: absolute; top: 0; left: 0; 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 */ z-index: 0; } /* Ensure text is above the overlay */ .vectorTabs li.selected a > * { position: relative; z-index: 1; }