Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
A custom vector.css for Wikipedia. Living document-style, this will be updated as I find other minor tweaks. See http://simianstudios.com/blog/post/a-quick-and-easy-way-to-a-cleaner-more-readable-wikipedia for more info!
body {font-family:"Open Sans", "Helvetica Neue", Arial, sans-serif;}
h1, h2, h3, h4, h5, h6 {border-bottom-color:#ddd;}
p {line-height:1.3em; margin-bottom:1.3em;}
#mw-content-text {font-size:1.1em; line-height:1.3em;}
li:last-of-type, dd:last-of-type {margin-bottom:1.3em;}
#mw-content-text h2 {padding-top:1.7em;}
a, div#content a.external {color:#00d;}
a:visited, div#content a.external:visited{color:#90d;}
.mw-editsection, .mw-editsection a {color:#ccc !important;}
h2:hover .mw-editsection a {color:#666 !important;}
#mw-panel .portal{-webkit-transition: opacity 250ms ease; -moz-transition: opacity 250ms ease; -o-transition: opacity 250ms ease; transition: opacity 250ms ease; opacity:0.3;}
#mw-panel:hover .portal{opacity:1;}
#mw-panel a {color:#666 !important;}
#mw-head{-webkit-transition:opacity 250ms ease; opacity:0.6;}
#mw-head:hover{opacity:1;}
#mw-head a{color:#666 !important;}
#mw-head div.vectorTabs li.selected {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAIAAADITs03AAAAPElEQVR4XuWK2xEAIAzCsPvv5DSu0ahX3yv4wQVyGGCSvg2dnJvduT8sz/IwKOIfjCi2z/76FhHeJcslVZQFLUC06LZ/AAAAAElFTkSuQmCC); background-image: url(https://bits.wikimedia.org/static-1.22wmf8/skins/vector/images/tab-normal-fade.png?2013-06-20T16:33:20Z)!ie; font-weight:bold;}
#mw-head:hover div.vectorTabs li.selected {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkAQAAAABvV2fNAAAADUlEQVQIHWNoYBgWEACJ5TIB0K9KcAAAAABJRU5ErkJggg==); background-image: url(https://bits.wikimedia.org/static-1.22wmf8/skins/vector/images/tab-current-fade.png?2013-06-20T16:33:20Z)!ie;}
.toc {border-color:#ddd !important; margin-bottom:1.3em;}
.toc li:last-of-type {margin-bottom:0 !important;}
sup.reference a {color:#aaa !important;}
table.ambox {border-top:none; border-right:none; border-bottom:none; border-left-width:5px; background-color:#f6f6f6; margin-bottom:1.3em;}
#siteSub {color:#bbb;}
@krisnoble

This comment has been minimized.

Copy link
Owner Author

commented Jul 12, 2013

Update: changed default font to Open Sans (rather than Droid Sans) after a suggestion from Paul Maloney. Thanks Paul!

@paulmaloney

This comment has been minimized.

Copy link

commented Jul 12, 2013

No worries! :D

@krisnoble

This comment has been minimized.

Copy link
Owner Author

commented Jul 12, 2013

Minor update: Made the "From Wikipedia..." subheading a bit lighter, section edit links a bit darker on hover, and added in the cross-browser transitions I forgot about (sorry!)

@krisnoble

This comment has been minimized.

Copy link
Owner Author

commented Apr 24, 2014

Updated: added https: to the two background-image URLs on lines 26 and 28

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.