Skip to content

Instantly share code, notes, and snippets.

@EvanHahn
Created May 31, 2012 23:00
Show Gist options
  • Save EvanHahn/2847033 to your computer and use it in GitHub Desktop.
Save EvanHahn/2847033 to your computer and use it in GitHub Desktop.
Wikipedia restyling
/*
Wikipedia restyling
by Evan Hahn (evanhahn.com)
Made for Stylebot.
**********************************************************************
This is free and unencumbered software released into the public domain.
Anyone is free to copy, modify, publish, use, compile, sell, or
distribute this software, either in source code form or as a compiled
binary, for any purpose, commercial or non-commercial, and by any
means.
In jurisdictions that recognize copyright laws, the author or authors
of this software dedicate any and all copyright interest in the
software to the public domain. We make this dedication for the benefit
of the public at large and to the detriment of our heirs and
successors. We intend this dedication to be an overt act of
relinquishment in perpetuity of all present and future rights to this
software under copyright law.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
For more information, please refer to
*/
/* Things to hide */
#siteSub,
div.topicon,
#coordinates,
#footer,
#p-logo,
#p-coll-print_export,
#mw-articlefeedback,
#filetoc {
display : none;
}
/* Global styles */
body {
border-top : 5px solid #009;
font-family : 'PT Sans', Helvetica, Arial, sans-serif;
font-size : 16pt;
background : #fff;
}
a:link {
color : #009;
-webkit-transition : all ease 0.1s 0;
}
a:visited {
color : #909;
-webkit-transition : all ease 0.1s 0;
}
a:hover,
a:active {
color : #fff;
text-decoration : none;
background-color : #009;
-webkit-transition : all ease 0.1s 0;
}
a:active {
position : relative;
top : 1px;
}
a.new {
color : #900;
}
::selection {
color : #fff;
background-color : #009;
}
ul {
list-style-image : none;
}
/* Header stuff */
#mw-page-base {
position : absolute;
top : 0;
left : 0;
background : none;
}
#mw-head {
position : absolute;
top : 4px;
left : 0;
height : 55px;
opacity : 0;
-webkit-transition : all ease 0.2s 0;
}
#mw-head:hover {
opacity : 1;
-webkit-transition : all ease 0.2s 0;
}
#p-personal {
display : none;
}
#pt-login {
text-transform : lowercase;
}
#left-navigation,
#right-navigation {
position : static;
margin : 0;
}
#mw-head ul li,
div.vectorTabs span {
border : 0;
line-height : 1em;
background : none;
}
#mw-head ul li.selected {
display : none;
}
div.vectorTabs ul {
background : none;
}
div.vectorTabs li a {
padding : 18px 1em 8px 1em;
font-size : 16px;
text-transform : lowercase;
color : #999;
-webkit-transition : all ease 0.2s 0;
}
div.vectorTabs li a:hover {
color : #fff;
background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#009), color-stop(50%,#008), color-stop(51%,#007), color-stop(100%,#008));
-webkit-transition : all ease 0.2s 0;
}
div#simpleSearch {
border : 0;
background : transparent;
}
div#simpleSearch input#searchInput {
position : static;
width : auto;
border : 1px solid #f0f0f0;
font : inherit;
font-size : 16px;
background : rgba(255, 255, 255, .5);
box-shadow : 0 1px 5px #f0f0f0;
}
div#simpleSearch img {
display : none;
}
#mw-head-base {
border : 0;
background : none;
}
/* Content */
#content {
margin : 0 auto;
padding : 0;
background : transparent;
}
#firstHeading { /* height comes out to 55px */
padding : 8px 1em 3px 1em;
text-align : center;
font-size : 36px;
font-weight : bold;
text-shadow : 0 -1px 0 white;
background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
}
#bodyContent {
width : 90%;
max-width : 720px;
margin : 5px auto 0 auto; /* pushed down from control box */
padding : 0 10px;
}
.thumbcaption img {
display : none;
}
h2 .editsection,
h3 .editsection,
h4 .editsection,
.toc .toctoggle {
opacity : 0;
-webkit-transition : all ease 0.2s 0;
}
h2:hover .editsection,
h3:hover .editsection,
h4:hover .editsection,
.toc:hover .toctoggle {
opacity : 1;
-webkit-transition : all ease 0.2s 0;
}
.stub,
.metadata {
margin : 1em 0;
}
#catlinks {
text-align : center;
color : transparent;
}
#catlinks a {
display : none;
}
#catlinks ul a {
display : inline-block;
padding : .5em 1em;
border-radius : 5px;
}
.catlinks li {
margin : 0;
border-left : 0;
}
.quotebox {
position : relative;
float : none;
display : block;
margin : 0 auto;
border : 0;
font-size : inherit;
font-style : italic;
background : transparent;
}
.quotebox:before,
.quotebox:after {
position : absolute;
font-size : 60pt;
font-family : Georgia, serif;
color : #999;
}
.quotebox:before {
content : '“';
top : .5em;
left : -.75em;
}
.quotebox:after {
content : '”';
bottom : 0;
right : -.5em;
}
.wikitable, .toc, .infobox, .navbox, #catlinks, .toccolours, .metadata, .fmbox, .layouttemplate {
border-radius : 3px;
box-shadow : 0 2px 2px #ddd;
}
/* Sidebar becomes footer */
#mw-panel {
position : static;
display : block;
width : 100%;
margin : 1em 0 0 0;
padding : 0;
text-align : center;
background : #444 url(http://evanhahn.com/wp-content/uploads/2012/05/px_by_Gre3g.png) repeat;
}
#mw-panel li {
display : inline-block;
}
#mw-panel.collapsible-nav div.portal {
width : 90%;
max-width : 720px;
margin : 0 auto;
border-bottom : 1px solid rgba(255,255,255,.25);
background : transparent;
}
#mw-panel.collapsible-nav div.portal h5 {
display : none;
background : none;
}
div#mw-panel div.portal div.body ul li a {
padding : .5em;
opacity : .9;
color : #fff;
border-radius : 1000px;
}
/* Special pages */
#file a:first-child {
display : block;
text-align : center;
background : transparent;
}
#file a img {
margin : 1em 0 3em 0;
border : 1px solid #999;
box-shadow : 0 3px 10px #999;
}
#file img:hover {
box-shadow : 0 3px 10px #009;
}
#file div.mw-filepage-resolutioninfo a,
.mw-thumbnail-link {
display : inline;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment