Skip to content

Votal9x by nemu64

Screenshot of Votal9x

Details

Authornemu64

LicenseWTF-PL

Categoryuserstyle, votal, windows, legacy, retro, throwback

Created

Updated

Size8.0 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Gives Votal a Windows9x theme. I've been banned from Votal and can no longer test this theme for incompatibilities. Use it at your own risk.

Notes

Designed for use with the "litera" Votal theme found under user settings.

Source code

/* ==UserStyle==
@name           Votal9x
@namespace      https://votal.net/c/votal9x
@version        1.1.1
@description    Gives Votal a Windows9x-like theme.
@author         https://votal.com/u/nemu
==/UserStyle== */

@-moz-document domain("votal.net") {
@import url("https://use.typekit.net/yqb7xed.css"); /*Load necessary fonts*/
:root { /*Set up the necessary variables*/
    --bgcolor: #c0c0c0;
    --text: #000;
    --disabledtext: #707070;
    --accent: #000080;
    --shadow: #808080;
    --link: #00c;
    --uvote: mediumspringgreen;
    --dvote: red;
    --dbutton: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAATElEQVQ4jd2SsRFAMQhCGZ3R3IRR/E2aFCbEJv/i3SvhVICk7AIgISk7Q3I2iIgjXjYAUGJvsBNbJ6zE9g8q8c9TuGNAssVIqS6OwwfjF94dU/1HGwAAAABJRU5ErkJggg==");
    --ubutton: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAATklEQVQ4jeXRsQnAMAxE0T/6jaZNbhSlCSYGC2IVhhDBL/UKCdvZDUhsZ2ckzUBEbPUXAOgDwGgbeC5XSAmsllfIR75wDpDU6j5uffU3XVDL3h3jA77MAAAAAElFTkSuQmCC");
}

.navbar { /*Add drop shadow to navigation bar*/
    box-shadow: 0px 2px var(--shadow) !important;
}

.post-title a, .text-muted, .nav-link, label, form { /*Make post titles + small text + navigation bar items + form labels black*/
    color: var(--text) !important;
}

.post-title a:visited { /*Make post titles gray when visited*/
    color: var(--disabledtext) !important;
}

.post-title a:hover, .text-info, .nav-link:hover, a:hover { /*Make upvote count + hovered links + usernames + hovered navigation bar items + hovered links blue*/
    color: var(--accent) !important;
}

a, .vote-bar > .unselectable {color: var(--link) !important} /*Hyperlink + vote count color*/

* { /*Make sizings easier to work with + remove unecessary box shadows + apply font changes*/
    box-sizing: border-box !important;
    box-shadow: none !important;
    font-family: noto nans, sans-serif !important;
    font-kerning: none !important;
}

.pointer.btn.btn-outline-secondary.active { /*Make selected buttons depressed*/
    background-color: var(--bgcolor) !important;
    color: var(--text) !important;
    border-top: 2px black !important;
    border-left: 2px black !important;
    border-right: 2px #dfdfdf !important;
    border-bottom: 2px #dfdfdf !important;
    border-style: inset !important;
    border-radius: 0 !important    
}
.pointer.btn.btn-outline-secondary.false { /*Make unselected buttons beveled out*/
    background-color: var(--bgcolor) !important;
    color: var(--text) !important;
    border-top: 2px #b2b2b2 !important;
    border-left: 2px #b2b2b2 !important;
    border-right: 2px #dfdfdf !important;
    border-bottom: 2px #dfdfdf !important;
    border-style: outset !important;
    border-radius: 0 !important    
}

#search-input.hide-input { /*Truly hide searchbar when collapsed*/
    opacity: 0 !important;
}

select, #search-input, textarea, input[type="text"], input[type="password"], input[type="email"] { /*Theme dropdown menus + searchbar + input fields*/
    background-color: white !important;
    color: var(--text) !important;
    border-top: 1px black !important;
    border-left: 1px black !important;
    border-right: 1px #dfdfdf !important;
    border-bottom: 1px #dfdfdf !important;
    border-style: inset !important;
    border-radius: 0 !important;
}
.custom-select { /*Add dropdown menu button*/
    background: #fff var(--dbutton) no-repeat right center/42px 42px !important;
    image-rendering: crisp-edges !important;
}

.icon {color: var(--text) !important} /*Icon colors*/
.icon:hover {color: var(--accent) !important}
button.btn-animate.btn.btn-link.p-0.text-muted > .icon.upvote, button.btn-animate.btn.btn-link.p-0.text-muted > .icon.downvote { /*inactive upvote/downvote button colors*/
    color: var(--shadow) !important;
    opacity: 1 !important;
}
button.btn-animate.btn.btn-link.p-0.text-info > .icon.upvote, .icon.upvote:hover { /*Upvote/downvote button colors*/
    color: var(--uvote) !important;
    fill: var(--uvote) !important;
    opacity: 1 !important;
}
button.btn-animate.btn.btn-link.p-0.text-danger > .icon.downvote, .icon.downvote:hover {
    color: var(--dvote) !important;
    fill: var(--dvote) !important;
    opacity: 1 !important;
}

.card {border-width: 2px !important} /*Mark sidebar card borders thicker*/

.btn.btn-block.btn-danger { /*Delete account button*/
    background-color: #d9534f !important;
    color: white !important;
    border-top: 1px white !important;
    border-left: 1px white !important;
    border-right: 1px black !important;
    border-bottom: 1px black !important;
    border-style: outset !important;
    border-radius: 0 !important     
}
.btn.btn-success, .btn.btn-sm.text-muted, .btn.btn-secondary, .card { /*Theme most buttons + sidebar cards*/
    background-color: var(--bgcolor) !important;
    color: var(--text) !important;
    border-top: 1px white !important;
    border-left: 1px white !important;
    border-right: 1px black !important;
    border-bottom: 1px black !important;
    border-style: outset !important;
    border-radius: 0 !important
}

body { /*Apply main page bg color*/
    background-color: var(--bgcolor) !important;
}

hr {display: none !important;} /*Remove space between posts*/

div.main-content-wrapper > div > div > div, div.comment-node { /*Add Windows-like seperators between posts/comments*/
    padding: 0.5em !important;
    border-top: solid 1px white !important;
    border-bottom: solid 1px #808080 !important;
    border-left: solid 1px white !important;
    border-right: solid 1px #808080 !important;
}

.tippy-box, tooltip, #tooltip, .tooltip, #aHTMLTooltip { /*Theme tooltips*/
    background-color: #ffffe1 !important;
    color: black !important;
    border: solid 1px black !important;
    border-radius: 0 !important;
    transition: none !important;
}
.tippy-arrow::before { /*Remove tooltip arrow*/
    border-bottom-color: transparent !important;
    border-top-color: transparent !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important
}

.badge { /*Badge colors padding*/
    background-color: var(--accent) !important;
    color: white !important;
    padding: 3px 5px;
}
.badge:hover {
    background-color: var(--link) !important;
    color: white !important;
}

.mr-1, .mx-1 { /*Expando button*/
    margin: 0.05rem 0.25rem !important;
}

::selection { /*Highlighted text*/
    color: white !important;
    background-color: #000080 !important;
}
::moz-selection { /*Compatibility for older browsers*/
    color: white !important;
    background-color: #000080 !important;
}

::-webkit-scrollbar { /*Scrollbar colors (Chrome only)*/
    width: 18px
}
::-webkit-scrollbar-track {
    background-color: #808080 !important;
    border-top: 1px black !important;
    border-left: 1px black !important;
    border-right: 1px #dfdfdf !important;
    border-bottom: 1px #dfdfdf !important;
    border-style: outset !important;
    border-radius: 0 !important
}
::-webkit-scrollbar-thumb {
    background-color: #c0c0c0 !important;
    border-top: 1px white !important;
    border-left: 1px white !important;
    border-right: 1px black !important;
    border-bottom: 1px black !important;
    border-style: outset !important;
    border-radius: 0 !important
}
::-webkit-scrollbar-button:decrement {
    background: var(--ubutton) !important;
    background-size: 18px 18px !important;
    image-rendering: crisp-edges !important;
    }
::-webkit-scrollbar-button:increment {
    background: var(--dbutton) !important;
    background-size: 18px 18px !important;
    image-rendering: crisp-edges !important;
}

html { /*Scrollbar colors (Firefox only)*/
    scrollbar-color: #c0c0c0 #808080 !important;
	scrollbar-width: auto !important;
}}

Reviews

No reviews yet.