User:Hawk/vector.css

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)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

/* TCRF.net - Dark Vector-specific CSS */

:root {
 --bg-dark: hsl(120, 2%, 19%);
 
 --dark-5: hsl(0, 0%, 5%);
 --dark-10: hsl(0, 0%, 10%);
 --dark-15: hsl(0, 0%, 15%);
 --dark-20: hsl(0, 0%, 20%);
 --dark-25: hsl(0, 0%, 25%);
 --dark-30: hsl(0, 0%, 30%);
 --dark-35: hsl(0, 0%, 35%);
 --dark-40: hsl(0, 0%, 40%);
 --dark-45: hsl(0, 0%, 45%);
 --dark-50: hsl(0, 0%, 50%);
 --dark-55: hsl(0, 0%, 55%);

 --blue: hsl(220, 100%, 66%);
 --lightblue: hsl(220, 100%, 80%);

 --red: hsl(1, 100%, 66%);
 --lightred: hsl(0, 70%, 70%);

 --diff-red: hsl(1, 100%, 66%);
 --diff-green: hsl(120, 100%, 66%);
 
 --green: hsl(120, 100%, 66%);
 --lightgreen: hsl(120, 100%, 87%);
 
 --lightyellow: hsl(45, 100%, 50%);
 --yellow: hsl(45, 50%, 20%);

 --white-90: hsl(0, 0%, 90%);

 --border-radius-2: 2px;
 --border-dark-45: 1px solid var(--dark-45);
}

/* Vector Menu SVGs */
.vectorTabs #ca-watch.icon a {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-watch.svg");
}
.vectorTabs #ca-unwatch.icon a {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-watch-hover.svg");
}
.vectorTabs #ca-watch.icon a:hover {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-unwatch.svg");
}
.vectorTabs #ca-unwatch.icon a:hover {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-unwatch.svg");
}
.vectorTabs #ca-watch.icon a:focus {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-watch.svg");
}
.vectorTabs #ca-unwatch.icon a:focus {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/vector-watch-hover.svg");
}
.vectorMenu h3 span::after {
    background-image: url("https://raw.githubusercontent.com/TCRF/DarkMode/main/assets/more-dropdown.svg");
}
/* "More" vectormenu option */
.vectorMenu h3 span {
    color: var(--lightblue);
    font-weight: bold;
}
.vectorMenu li a {
    color: var(--lightblue);
    background-color: var(--dark-25);
    font-weight: bold;
}
.vectorMenu .menu {
    border: var(--border-dark-45);
}

/* Vector Tabs */
.vectorTabs li {
    background-image: linear-gradient(to top, var(--dark-25) 0.063em, var(--dark-15) 100%);
    font-weight: bold;
}
.vectorTabs li a {
    color: var(--lightblue);
}
.vectorTabs, .vectorTabs span, #mw-head .vectorMenu h3 {
    background-image: linear-gradient(to top, var(--dark-45) 0, var(--dark-15) 100%);
}
.vectorTabs .selected {
    background-image: linear-gradient(to top, var(--dark-25) 0.063em, var(--dark-15) 100%);
    background-color: var(--dark-25);
}
.vectorTabs .selected a, .vectorTabs .selected a:visited {
    color: var(--blue);
}
.vectorMenu h3:hover span, .vectorMenu h3:focus span {
    color: var(--lightblue);
}

/* These were fixes for something, but I don't remember what. */
.skin-vector .uls-menu {
    border-color: var(--dark-45);
}
.skin-vector .uls-lcd-region-title {
    color: var(--white-90);
}
.skin-vector .uls-search {
    border-bottom-color: var(--dark-45);
}

User:Hawk/vector.css

Navigation menu

Search