3 ms·
Using the "Stylish" plugin or similar custom CSS injection, you can substantially change how vote links look, along with adding space between their placement.
by jcr 11y ago
Using the "Stylish" plugin or similar custom CSS injection, you can substantially change how vote links look, along with adding space between their placement.
My vote links read '▲sig' for up-vote (signal), and empty line of separation, and then '▼din' for down-vote (noise).
/* remove arrow background images */
/* XXX Bug in chrome/webkit requires padding or margin */
div[title="upvote"],
div[title="downvote"] {
margin: 0px !important;
padding: 0px !important;
padding-right: 1ex !important;
text-align: center !important;
display: inline !important;
white-space: pre;
background: none !important;
background-image: none !important;
-moz-transform: none !important;
-webkit-transform: none !important;
-o-transform: none !important;
-ms-transform: none !important;
transform: none !important;
/* width: 6ex !important; */
/* width: 1ex !important; */
/* margin-right: 10px !important; */
}
/* use unicode text arrows */
div[title="upvote"]:after {
content: '▲sig' !important;
}
div[title="downvote"]:after {
content: '\A\A▼din' !important;
}
/* color unicode arrow text green-up, red-down */
a[id^="up"] {
color: #009900 !important;
}
a[id^="down"] {
color: #990000 !important;
}
/* highlight arrows on hover */
a[id^="up"]:hover {
color: #00ff00 !important;
}
a[id^="down"]:hover {
color: #ff0000 !important;
}