MediaWiki:Monobook.css

From Wiki³
Revision as of 21:54, 18 July 2017 by Kyau (talk | contribs)

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.
/* Monobook Skin :: Wiki3 Additions
 */

@import url('//cdn.jsdelivr.net/font-hack/2.020/css/hack-extended.min.css');
@import url('//fonts.googleapis.com/css?family=Titillium+Web');

/* Links
 */
a:link, a:active, a:visited { color: #07b !important; }  /* regular links */
a:hover { color: #666 !important; }
a.new:link, a.new:active, a.new:visited { color: #a00 !important; }  /* page does not exist links */
a.new:hover { color: #666 !important; }
a.extiw:link, a.extiw:active, a.extiw:visited { color: #07b !important; }  /* external wiki links */
a.extiw:hover { color: #666 !important; }
a.external:link, a.external:active, a.external:visited { color: #07b !important; }  /* external links */
a.external:hover { color: #666 !important; }


/* General
 */
body {
  background: #f1f1f1;
  background-attachment: fixed;
  color: #313131;
  font-family: 'Titillium Web',Tahoma,Geneva,sans-serif;
  font-size: 8pt;
  line-height: 100%;
}
h1, h2, h6 { font-weight: normal; }
h3 { margin-top: 0.3em; }
input {
  font-family: 'Titillium Web',Tahoma,Geneva,sans-serif;
  font-size: 8pt;
  line-height: 100%;
}
pre,textarea {
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 10pt;
  line-height: 100%;
}
table { 
  border-spacing: 0;
  border-collapse: collapse;
}
td { padding: 0; }
#mw-read-only-warning { color: #a00; }
#mw-read-only-warning > p > strong { display: block; }
#mw-content-text > pre { display: table; }


/* Tables
 */
table.sortable { border-collapse: collapse; border-spacing: 0; border-top: solid 1px #96aac8; border-bottom: solid 1px #96aac8; margin: 0 auto; }
table.sortable tr { border: none; }
table.sortable td, table.sortable th { border-right: solid 1px #96aac8; border-left: solid 1px #96aac8; padding: 5px 10px; vertical-align: center; }
table.sortable th { border-bottom: solid 1px #96aac8; }
table.wikitable  {
  background: #f9f9f9;
  margin: 5px 15px;
  box-shadow: 1px 1px 5px 0px rgba(170,170,170,0.4);
}
table.wikitable:not(.filehistory) td { padding: 4px; }
table.wikitable:not(.filehistory) th, table.wikitable:not(.filehistory) tr, table.wikitable:not(.filehistory) td { border: 1px #aaa solid; }
table.mw-collapsible.optional {
  background: rgba(235,241,245,1);
  border-collapse: collapse;
  border-spacing: 0; 
  margin: 16px 15px;
  border: 1px solid rgba(187,204,221,1);
  box-shadow: 1px 1px 5px 0px rgba(125,125,125,0.4);

}
table.mw-collapsible.optional > tbody > tr > th { font-size: 110%; padding: 0 8px; text-align: left; }
table.mw-collapsible.optional > tbody > tr > td { padding: 8px 8px 4px; }
table.mw-collapsible.optional span.mw-collapsible-toggle:before { content: '\00a0 \00a0 '; font-weight: normal; }


/* Alignment
 */
.aleft { text-align: left; }
.acenter { text-align: center; }
.aright { text-align: right; }
.atop { vertical-align: top; }
.amiddle { vertical-align: middle; }
.abottom { vertical-align: bottom; }
.fright { float: right; }
.fleft { float: left; }
.fclear { clear: both; }


/* User Bar Icon
 */
li#pt-userpage, li#pt-anonuserpage, li#pt-login {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/user-silhouette.png') left center no-repeat;
}
li#pt-preferences {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/gear.png') left center no-repeat;
  padding-left: 20px;
}
li#pt-mytalk {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/sticky-note-text.png') left center no-repeat;
  padding-left: 20px;
}
li#pt-watchlist {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/book-open-bookmark.png') left center no-repeat;
  padding-left: 20px;
}
li#pt-mycontris {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/wooden-box-label.png') left center no-repeat;
  padding-left: 20px;
}
li#pt-logout {
  background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/door-open-out.png') left center no-repeat;
  padding-left: 20px;
}


/* Sidepanel
 */
#p-cactions ul li,#p-cactions ul li a {
  border-radius: 0.4em 0.4em 0 0;
}
#content {
  border-radius: 0.6em 0 0 0.6em;
}
div.pBody {
  border-radius: 0 0.4em 0.4em 0;
}
.portlet h3 { display: none; }
#p-search.portlet { position: relative; top: 16px; }
#p-tb.portlet { position: relative; top: 32px; }


/* Footer
 */
div#footer {
  height: 33px !important;
  margin-left: 13.6em;
  border-left: solid 1px rgb(250, 189, 35);
  border-radius: 1em 0 0 1em;
}
#footer #f-list { position: relative; top: 7px; }
#footer #f-poweredbyico { position: relative; top: 1px; }
#footer #f-copyrightico { position: relative; top: 1px; }
#footer #f-poweredbyico > a > img,
#footer #f-copyrightico > a > img { height: 30px !important; }


/* Advanced Toolbar
 */
.wikiEditor-ui-toolbar .sections .section,
.wikiEditor-ui-toolbar {
  background: rgb(238,238,238);
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2NjY2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%);
}


/* Main Page
 */
span.showbox {
  background-color: #f0f0f0;
  border: 1px solid #c0c0c0;
  padding: 0.2em 0.3em 0.2em 0.3em;
}


/* Categories
 */
body.page-Main_Page.action-view h1.firstHeading, body.page-Category_ThinkPad.action-submit h1.firstHeading { display: none; }


/* TOC
 */
div#tocalign {
  box-shadow: 1px 1px 5px 0px rgba(125,125,125,0.4);
  float: right;
  margin-left: 25px;
}
div#tocalign > #toc  { border-collapse: separate; }


/* References
 */
ol.references > li:target { background-color: #ddeeff; }
sup.reference:target { background-color: #ddeeff; }


/* YouTube
 */
.youtube { margin-bottom: 16px; font-size: 95%; text-align: center; }
.youtube > iframe {
  margin: 32px auto 0;
  display: block;
  box-shadow: 1px 1px 5px 0px rgba(9,12,25,1);
}

/* Template:Back
 */
.template-back {
  border: 1px solid #aaa;
  background-color: #f9f9f9;
  display: inline-block;
  font-size: 95%;
  margin: 8px 16px 12px 0;
  padding: 4px 8px;
  box-shadow: 1px 1px 5px 0px rgba(125,125,125,0.4);
}


/* Template:Code
 */
.template-code {
  background-color: #ffe0e0;
  border: 1px solid #cc6666;
  border-left: 10px solid #cc6666;
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 10pt;
  line-height: 100%;
  margin: 6px 4px;
  padding: 2px 6px;
  white-space: pre;
  display: table;
}


/* Template:BBS
 */
.template-bbs {
  background-color: #090c19;
  border: 1px solid #313b65;
  color: #aeaeae;
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 10pt;
  line-height: 100%;
  margin: 0 4px;
  padding: 4px 8px;
  white-space: pre;
}


/* Template:Console
 */
.template-console {
  background-color: #090c19;
  box-shadow: 1px 1px 5px 0px rgba(9,12,25,1);
  color: #e6e6e6;
  display: inline-block;
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 10pt;
  line-height: 100%;
  margin: 0;
  padding: 4px 8px;
  white-space: pre;
}
mark { background: none; }
mark.black { color: #222946; }
mark.black2 { color: #8c8b89; }
mark.red { color: #be1919; }
mark.red2 { color: #dc2f32; }
mark.green { color: #1aaa13; }
mark.green2 { color: #5dce33; }
mark.yellow { color: #ffaa3e; }
mark.yellow2 { color: #fadd2d; }
mark.blue { color: #3a57d7; }
mark.blue2 { color: #507cff; }
mark.magenta { color: #be007f; }
mark.magenta2 { color: #e671d3; }
mark.cyan { color: #258f8f; }
mark.cyan2 { color: #4dc5dc; }
mark.white { color: #aeaeae; }
mark.white2 { color: #dbdde4; }


/* Template:Output
 */
.template-output {
  background-color: #c1ffc1;
  border: 1px solid #00B000;
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 10pt;
  line-height: 100%;
  margin: 0 4px;
  padding: 4px 8px;
  white-space: pre;
}

/* Template:GitHub
 */
.template-github {
  border: 1px solid #aaa;
  background-color: #f9f9f9;
  box-shadow: 1px 1px 5px 0px rgba(125,125,125,0.4);
  margin: 4px 0;
}
.template-github > tbody > tr > td { padding: 0.25em 0.8em; }


/* Template:Note
 */
.template-note {
  background-color: rgba(248,249,250,1);
  border: 1px solid rgba(162,169,177,1);
  box-shadow: 1px 1px 5px 0px rgba(162,169,177,0.4);
  margin: 4px 0;
}
.template-note > tbody > tr > td { padding: 0.25em 0.8em; }


/* Template:Warning
 */
.template-warning {
  background-color: rgba(254,231,230,1);
  border: 1px solid rgba(179,36,36,1);
  box-shadow: 1px 1px 5px 0px rgba(179,36,36,0.3);
  margin: 4px 0;
}
.template-warning > tbody > tr > td { padding: 0.25em 0.8em; }


/* Template:UnderConstruction
 */
.template-construction {
  background-color: rgba(255,250,36,1);
  border: 1px solid rgba(228,173,30,1);
  box-shadow: 1px 1px 5px 0px rgba(228,173,30,0.3);
  margin: 4px 0;
}
.template-construction > tbody > tr > td:first-of-type { padding-right: 0; }
.template-construction > tbody > tr > td { padding: 0.25em 0.8em; }


/* Template:Mono
 */
.template-mono {
  background-color: #ebf1f5;
  color: #007a00;
  font-family: 'Hack','Lucida Console',Monaco,monospace;
  font-size: 9pt;
  line-height: 100%;
  padding: 0.3em;
}


/* Template:Icon(.*)
 */
.template-icon { position: relative; top: -1px; }
.template-iconfix { position: relative; top: -3px; }


/* Template:Infobox
 */
.template-infobox {
  background-color: #f1f1f1;
  border: 1px solid #666;
  float: right;
  padding: 4px;
  box-shadow: 1px 1px 5px 0px rgba(102,102,102,0.4);
  margin: 32px 16px;
}

/* Template:RSS
 */
.template-rss {
  padding: 7px;
  border: 1px solid #aaa;
  background-color: #f9f9f9;
  box-shadow: 1px 1px 5px 0px rgba(125,125,125,0.4);
  margin: 0 auto;
  margin-top: 32px;
  width: 300px;
}

/* Template:Hardware
 */
.template-hardware {
  clear: both;
  float: right;
  margin: 0 16px 32px;
  display: inline-block;
}
.template-hardware table {
  display: inline-table;
  background-color: #f9f9f9;
  border: 1px solid #ccc;
  border-spacing: 0;
  border-collapse: collapse;
  box-shadow: 1px 1px 5px 0px rgba(204,204,204,1);
  margin-top: 4px;
}
.template-hardware th { border: 1px solid #ccc; background-color: #ccc; }
.template-hardware td { border: 1px solid #ccc; padding: 2px 6px; white-space: nowrap; }



/* - Misc ------------------------------------------------------------------- */


/* Path of Exile
 */
.inventoryBG {
  background-image: url('//webcdn.pathofexile.com/image/gen/inventory/MainInventory.png');
  width: 600px;
  height: 781px;
}
.itemBG { background-image: url('//webcdn.pathofexile.com/image/game_ui/inventory_item_background.png'); }


/* DIY Images
 */
.diy {
  box-shadow: 0 0 6px rgba(0,0,0,1);
  margin: 4px 2px;
}

.thinkpadx220 {
  width: 300px;
  height: 300px;
  background-image: url('//kyau.net/w/images/5/58/ThinkPad_X220.png');
  background-position: center center;
  background-repeat: no-repeat;
}
.thinkpadx220:hover {
  background-image: url('//kyau.net/w/images/thumb/d/d7/ThinkPad_X220-2.png/300px-ThinkPad_X220-2.png');
}