MediaWiki:Common.css

/*
 * Imports
 */
@import "//api.kyaulabs.com/css/proxima-nova.css";
@font-face {
	font-family: 'agave';
	src: url('//api.kyaulabs.com/fonts/Agave-Bold.ttf') format('truetype');
	font-style: normal;
	font-weight: 700;
}
@font-face {
	font-family: 'agave';
	src: url('//api.kyaulabs.com/fonts/Agave-Regular.ttf') format('truetype');
	font-style: normal;
	font-weight: 400;
}
* {
  border-collapse: collapse;
}


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


/*
 * Fonts
 */
body {
  font-family: 'Proxima Nova','Linux Libertine','Times New Roman','Liberation Serif','Nimbus Roman','Noto Serif','Times',serif;
}
#p-logo-text a, #personal h2,
#content.mw-body h1, #content.mw-body h2, #content.mw-body h3,
#content.mw-body h4, #content.mw-body h5, #content.mw-body h6, #content.mw-body dt {
  font-family: 'Proxima Nova','Linux Libertine','Times New Roman','Liberation Serif','Nimbus Roman','Noto Serif','Times',serif;
}
input {
  font-family: 'Proxima Nova','Linux Libertine','Times New Roman','Liberation Serif','Nimbus Roman','Noto Serif','Times',serif;
  line-height: 100%;
}
pre,textarea {
  font-family: 'agave','Lucida Console',Monaco,monospace;
  line-height: 100%;
}


/*
 * Logo
 */
/* remove top-page padding */
div#mw-header-container.ts-container { padding-top: 0; }
/* add top-page padding back to usermenu and searchbar (not logo) */
div#user-tools, div#p-search.mw-portlet { margin-top: 0.5em; }
/* replace top-left text logo with graphical logo */
a#p-banner.mw-wiki-title {
  background-image: url(//kyau.net/w/img/wiki3.png);
  background-repeat: no-repeat;
  background-position-x: left -24px;
  background-position-y: top 0.25em;
  height: 40px;
  color: transparent;
  content: '';
}
/* remove default logo */
div#p-logo.mw-portlet { display: none; }


/*
 * Mobile Web Changes
 */
@media (max-width: 850px) {
  div#mw-header.ts-inner { position: relative; }
  /* fix graphical logo */
  div#p-logo-text.mw-portlet {
    width: 125px;
    max-width: auto;
    position: relative;
    left: 3em;
    top: -0.25em;
  }
  /* fix searchbar */
  input#searchInput { width: auto; }
  /* fix usermenu */
  div#user-tools > div#personal > h2 {
    top: 0.5em;
  }
}


/*
 * Headers / Sections
 */
h1, h2, h6 { font-weight: 800; }
h3, h4, h5 { font-weight: 700; }
#content.mw-body h1 { 
  padding-bottom: 2px !important;
  font-size: 150%;
}
#content.mw-body h1.firstHeading { border-bottom: none !important; }
#content.mw-body h1 > span.mw-headline { position: relative; top: 2px; }
#content.mw-body h1 > span.mw-headline > img { top: -3px !important; }
#content.mw-body h2 {
  font-size: 125%;
  margin-bottom: 0;
  padding-bottom: 2px !important;
  width: 20em;
}
#content.mw-body h2 > span.mw-headline { position: relative; top: 1px; }
#content.mw-body h2 > span.mw-headline > img { position: relative; top: -2px !important; }
#content.mw-body h3 { display: table; font-size: 125%; border-bottom: 1px solid #ccc !important; padding-right: 2em; padding-bottom: 2px !important; }
#content.mw-body h3::after { content: "\00000a"; }
#content.mw-body h4 { font-size: 125%; }


/*
 * Misc
 */
#mw-read-only-warning { color: #a00; }
#mw-read-only-warning > p > strong { display: block; }
#mw-content-text > pre { display: table; }
div#siteSub, div#contentSub, div#jump-to-nav { margin: 0; }
/*
div.mw-body > div.mw-indicators, span.mw-editsection > span.mw-editsection-bracket { display: none; margin: 0; }
*/
span.mw-editsection > a { 
  /*background: url('//api.kyau.net/images/fugue-icons/icons-shadowless/pencil-small.png') left 3px no-repeat;*/
  padding-left: 14px;
}


/*
 * Tables
 */
table {
  border-spacing: 0;
  border-collapse: collapse;
}
td { padding: 0; }
table.sortable { 
  border-collapse: collapse;
  border-spacing: 0;
  border-top: solid 1px #96aac8;
  border-bottom: solid 1px #96aac8;
  margin: 0 auto;
  box-shadow: 1px 1px 5px 0px rgba(150,170,200,0.4);
}
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; }


/*
 * Usermenu Icons
 */
li#pt-userpage, li#pt-anonuserpage, li#pt-login {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/user-silhouette.png') !important;
}
li#pt-preferences {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/gear.png') !important;
}
li#pt-mytalk {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/sticky-note-text.png') !important;
}
li#pt-watchlist {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/book-open-bookmark.png') !important;
}
li#pt-mycontris {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/wooden-box-label.png') !important;
}
li#pt-logout {
  margin-left: 20px !important;
  list-style-image: url('//api.kyau.net/images/fugue-icons/icons-shadowless/door-open-out.png') !important;
}

/*
 * Footer
 */
div#footer {
  height: 96px !important;
  margin-left: .4em;
  border-left: solid 1px rgb(250, 189, 35);
  border-radius: 1em 0 0 1em;
}

/*
 * 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.rootpage-Wiki³ h1.firstHeading { display: none; }
body.page-Category_Arch_Linux.action-view h1.firstHeading, body.page-Category_Arch_Linux.action-submit h1.firstHeading { display: none; }
body.page-Category_Arch_Linux.action-view div#tocalign { margin-top: 16px; }
body.page-Category_ThinkPad.action-view h1.firstHeading, body.page-Category_ThinkPad.action-submit h1.firstHeading { display: none; }
body.page-Category_ThinkPad.action-view div#tocalign { margin-top: 16px; }
.firstHeading { border: none; }


/*
 * TOC
 */
div#tocalign {
  float: right;
  margin-left: 25px;
}
div#tocalign > #toc  { border-collapse: separate; }
div#toc > div#toctitle > h2 { border: none; font-size: 115%; width: auto; }
ul#filetoc, .toc { margin: 0 !important; }
.tocnumber::after { content: " — "; }


/*
 * 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 2px;
  display: block;
  box-shadow: 1px 1px 5px 0px rgba(9,12,25,1);
}

/* Template:Back
 */
.template-back {
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  display: inline-block;
  font-size: 95%;
  margin: 8px 16px 12px 0;
  padding: 4px 8px;
}
/* Template:Code
 */
.template-code {
  background-color: #ffe0e0;
  border: 1px solid #cc6666;
  border-left: 10px solid #cc6666;
  font-family: 'agave','Lucida Console',Monaco,monospace;
  font-size: 100%;
  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: 'agave','Lucida Console',Monaco,monospace;
  font-size: 100%;
  line-height: 100%;
  margin: 0 4px;
  padding: 4px 8px;
  white-space: pre;
}


/* Template:Console
 */
.template-console {
  background-color: rgba(9,12,25,1);
  box-shadow: 1px 1px 5px 0px rgba(9,12,25,1);
  color: rgba(230,230,230,1);
/*  display: inline-block;*/
  font-family: 'agave','Lucida Console',Monaco,monospace;
  font-size: 100%;
  line-height: 100%;
  margin: 0;
  padding: 4px 8px;
  white-space: pre;
}
.template-console-title {
  background-color: rgba(54,57,68,1);
  border-radius: 0.5em 0.5em 0 0;
  box-shadow: 1px 1px 5px 0px rgba(9,12,25,1);
  color: rgba(230,230,230,1);
  display: inline-block;
  font-size: 100%;
  text-align: left;
  padding: 0 7px 1px 7px;
  position: relative;
  top: 1px;
  white-space: nowrap;
  z-index: -1;
}
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: 'agave','Lucida Console',Monaco,monospace;
  font-size: 100%;
  line-height: 100%;
  margin: 0 4px;
  padding: 4px 8px;
  white-space: pre;
}

/* Template:GitHub/GitLab
 */
.template-git {
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  margin: 4px 0;
}
.template-git > tbody > tr > td { padding: 0.25em 0.8em; }


/* Template:Note
 */
.template-note {
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  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: solid rgba(179,36,36,0.25);
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(179,36,36,0.15);
  margin: 4px 0;
}
.template-warning > tbody > tr > td { padding: 0.25em 0.8em; }
.template-note img, .template-warning img { position: relative; top: 0; }

@media screen and (min-width: 1400px) {
  .template-note, .template-warning { font-size: 90%; }
  .template-note img, .template-warning img { position: relative; top: -2px; }
}

/* Template:UnderConstruction
 */
.template-construction {
  background-color: rgba(255,250,36,1);
  border: solid rgba(228,173,30,0.25);
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(228,173,30,0.15);
  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: 'agave','Lucida Console',Monaco,monospace;
  font-size: 100%;
  line-height: 100%;
  padding: 0.15em 0.3em;
}


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


/* Template:Infobox
 */
.template-infobox {
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  padding: 1.25em 1.75em;
  float: right;
  margin: 32px 16px;
}

/* Template:RSS
 */
.template-rss {
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  padding: 1.25em 1.75em;
  font-size: 90%;
  margin: 0 auto;
  margin-top: 32px;
  width: 300px;
}

/* Template:Hardware
 */
.template-hardware {
  font-size: 90%;
  margin: 0 0.2em 32px 16px;
  display: inline-block;
}
.template-hardware table {
  display: inline-table;
  background: #fcfcfc;
  border: solid #eeeeee;
  border-width: 1px 1px 0.2em;
  box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
  border-spacing: 0;
  border-collapse: collapse;
  margin-top: 4px;
  padding: 0;
  text-align: left;
}
.template-hardware th { border: 1px solid #ccc; background-color: #ccc; text-align: center; }
.template-hardware td { border: 1px solid #ccc; padding: 0 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');
}