|
|
| Line 1: |
Line 1: |
| /*
| |
| ASCIIStick theme
| |
| Made for videogameinterface.wiki
| |
| Modifies the Timeless skin
| |
| Based on the ASCII Stick, AS-2088-FC
| |
|
| |
| NB: Currently a big mess as I play with things.
| |
| */
| |
|
| |
|
| /* Variables */
| |
|
| |
| :root {
| |
| /* Vars from GMT theme */
| |
| --colour_bg:#ffffff;
| |
| --colour_bg_secondary:#f8f9fa;
| |
| --colour_bg_tertiary:#dbdbdb;
| |
| --colour_secondary:black;
| |
| --colour_tertiary:lightyellow;
| |
| --colour_quaternary:#fff200;
| |
| /* Vars from VIW theme */
| |
| /* Colours */
| |
| --silver:#c0c0c0;
| |
| --black:#000000;
| |
| --red:red;
| |
| --yellow:yellow;
| |
| --link:#3366cc;
| |
| /*
| |
| --link-visited:purple;
| |
| --link-hover:;
| |
| --link-new:red;
| |
| */
| |
| /* Other */
| |
| --rule-height:7px;
| |
| --gridgap:22px;
| |
| }
| |
|
| |
| body {
| |
| font-family:none;
| |
| font-size:1em;
| |
|
| |
| }
| |
|
| |
| /* Basic layout, colours */
| |
| div#mw-content,
| |
| div#mw-related-navigation div.sidebar-chunk,
| |
| div#mw-site-navigation div.sidebar-chunk {
| |
| background-color:var(--silver);
| |
| border:var(--black) 1px solid;
| |
| border-top:var(--black) var(--rule-height) solid;
| |
| margin-top:var(--gridgap);
| |
| padding:0;
| |
| }
| |
|
| |
| /* Restore padding where needed */
| |
| div#mw-content {
| |
| padding-bottom:1em;
| |
| }
| |
| p,
| |
| pre,
| |
| #mw-page-header-links,
| |
| .content-table, /* tables */
| |
| .mw-content-ltr ul,
| |
| .sidebar-inner {
| |
| margin:var(--gridgap);
| |
| }
| |
| li {
| |
| list-style-position:inside;
| |
| }
| |
| .mw-content-ltr ul { /* fix gap in nested lists */
| |
| margin-top:0.3em;
| |
| }
| |
|
| |
| div#mw-content-container {
| |
| background:unset;
| |
| background-color:var(--silver);
| |
| background-image: url(images/d/d6/timeless_asciistick_bg_grid.png);
| |
| border-bottom:var(--black) var(--rule-height) solid;
| |
| }
| |
|
| |
| div#mw-content ul > li {
| |
| list-style-type:square;
| |
| }
| |
|
| |
| /* Nested list margin */
| |
| li > ul {
| |
| margin:0 0 0 var(--gridgap)!important;
| |
| }
| |
|
| |
| div#mw-content div#toc ul > li::marker,
| |
| div#mw-content div.search-types ul > li::marker {
| |
| content:none;
| |
| }
| |
|
| |
| hr {
| |
| border:none;
| |
| border-bottom:var(--colour_secondary) 6px solid;
| |
| }
| |
|
| |
| /* Sidebars */
| |
|
| |
| #p-logo {
| |
| display:none;
| |
| }
| |
|
| |
| #mw-site-navigation .sidebar-chunk h3,
| |
| #mw-related-navigation .sidebar-chunk h3 {
| |
| border:none;
| |
| }
| |
|
| |
| #mw-site-navigation .sidebar-chunk,
| |
| #mw-related-navigation .sidebar-chunk {
| |
| font-size:1em;
| |
| }
| |
|
| |
| /* Infoboxes */
| |
|
| |
| div#infobox {
| |
| display:grid;
| |
| grid-gap:0;
| |
| grid-template-columns:repeat(4,1fr)
| |
| }
| |
| div#infobox.infobox-3column {
| |
| grid-template-columns:repeat(3,1fr)
| |
| }
| |
|
| |
| div#infobox .infobox-section .infobox-image {
| |
| border:1px solid black;
| |
| padding-top:1px
| |
| }
| |
|
| |
| div#infobox .infobox-section p {
| |
| margin:0
| |
| }
| |
|
| |
| div#infobox img {
| |
| width:100%;
| |
| height:auto;
| |
| border: 1px solid var(--silver);
| |
| }
| |
|
| |
| div#infobox div.content-table {
| |
| height:100%;
| |
| /* remove margin previously set for mulatiple elements */
| |
| margin:0;
| |
| }
| |
|
| |
| div#infobox table {
| |
| background-color:var(--colour_bg_tertiary);
| |
| border-collapse:collapse;
| |
| height:100%;
| |
| width:100%;
| |
| }
| |
|
| |
| div#infobox table th,
| |
| div#infobox table td {
| |
| border:1px solid var(--silver);
| |
| padding:0.5em;
| |
| vertical-align:top
| |
| }
| |
|
| |
| div#infobox table th {
| |
| text-align:right
| |
| }
| |
|
| |
| /* Fix align of 'Connects' header in adaptor infobox */
| |
| div#infobox table th[colspan] {
| |
| text-align:left;
| |
| }
| |
| /* Other Templates */
| |
|
| |
| blockquote {
| |
| font-style:italic;
| |
| }
| |
|
| |
| blockquote span.credit {
| |
| font-style:normal;
| |
| }
| |
|
| |
| em.jargon > a {
| |
| color:green;
| |
| cursor:help;
| |
| }
| |
|
| |
| p.nb {
| |
| background:var(--colour_bg_secondary);
| |
| border:solid 1px var(--colour_quaternary);
| |
| display:inline-block;
| |
| margin:1em 0;
| |
| padding:1em;
| |
| }
| |
|
| |
| /* Header */
| |
|
| |
| #mw-header-container {
| |
| background-color:var(--colour_secondary);
| |
| box-shadow: 0 1px 4px rgba(0,0,0,0.3);
| |
| }
| |
|
| |
| #mw-header-hack {
| |
| display:none;
| |
| }
| |
|
| |
| #mw-content-container {
| |
| margin-top:3em;
| |
| }
| |
|
| |
| /* Headings */
| |
|
| |
| .mw-body h1.firstHeading {
| |
| margin-top:0;
| |
| border:none;
| |
| }
| |
|
| |
| h1,h2,h3,h4,h5,h6 {
| |
| font-weight:bold;
| |
| }
| |
|
| |
| .mw-body h1,
| |
| .mw-body h2,
| |
| .mw-body h3,
| |
| .mw-body h4,
| |
| .mw-body h5,
| |
| .mw-body h6 {
| |
| background-color:var(--black);
| |
| color:var(--silver);
| |
| font-family:sans-serif;
| |
| padding:0.4em var(--gridgap);
| |
| }
| |
|
| |
| h2,h3,h4,h5,h6 {
| |
| margin:2em 0 var(--gridgap) 0;
| |
| }
| |
|
| |
| .mw-body h3 {
| |
| background-color:unset;
| |
| color:black;
| |
| border-bottom:1px solid black;
| |
| border-top:1px solid black;
| |
| }
| |
| .mw-body h4 {
| |
| background-color:unset;
| |
| color:black;
| |
| border:none;
| |
| }
| |
|
| |
| /* Tables */
| |
|
| |
| .wikitable {
| |
| background-color:unset;
| |
| color:unset;
| |
| margin:1em 0;
| |
| border-collapse:collapse;
| |
| border:none; /* this might break things... */
| |
| }
| |
|
| |
| .wikitable > tr > th,
| |
| .wikitable > * > tr > th {
| |
| background-color:var(--colour_bg_tertiary);
| |
| }
| |
|
| |
| .wikitable > tr > th,
| |
| .wikitable > tr > td,
| |
| .wikitable > * > tr > th,
| |
| .wikitable > * > tr > td {
| |
| border:1px solid black;
| |
| }
| |
|
| |
| td.positive {
| |
| /*background-color:#D4FFD4;*/
| |
| background-color:#08CE08;
| |
| text-align:center
| |
| }
| |
|
| |
| td.negative {
| |
| /*background-color:#FFD9D4;*/
| |
| background-color:#DF796C;
| |
| text-align:center
| |
| }
| |
|
| |
| td.mixed {
| |
| /*background-color:var(--colour_bg_tertiary);*/
| |
| background-color:#B8CA90;
| |
| text-align:center
| |
| }
| |
|
| |
| td.unknown {
| |
| text-align:center
| |
| }
| |
|
| |
| /* Front page TOC table */
| |
| table.contents {
| |
| margin:auto;
| |
| width:100%;
| |
| font-weight:bold;
| |
| }
| |
| table.contents td {
| |
| text-align:center;
| |
| width:25%;
| |
| }
| |
|
| |
| thead {
| |
| border-top:4px solid black;
| |
| }
| |
|
| |
| /* Special comments */
| |
|
| |
| .mw-message-box {
| |
| border:none;
| |
| }
| |
| .mw-message-box-warning {
| |
| background-color:var(--yellow);
| |
| }
| |
|
| |
| p.comment {
| |
| border:1px dashed var(--silver);
| |
| background-color:darkgrey;
| |
| margin:var(--gridgap) var(--gridgap) var(--gridgap) 11em;
| |
| padding:var(--gridgap)!important;
| |
| font-style:italic;
| |
| }
| |
| p.comment > span.user {
| |
| display:block;
| |
| font-style:normal;
| |
| font-weight:bold;
| |
| }
| |
| p.nb {
| |
| border:1px solid var(--black);
| |
| background-color:darkgrey;
| |
| margin:var(--gridgap);
| |
| padding:var(--gridgap)!important;
| |
| }
| |
| p.nb::before {
| |
| content:"●";
| |
| color:var(--yellow);
| |
| display:inline; /* Needed for vertical-align */
| |
| text-shadow:-1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
| |
| /* -webkit-text-stroke: 1px black; looks worse */
| |
| padding-right:1em;
| |
| vertical-align:text-bottom;
| |
| }
| |
|
| |
| /* Links */
| |
|
| |
| /* Keep blue colour of links in sidebars infobox headers */
| |
| div#mw-related-navigation div.sidebar-chunk a,
| |
| div#mw-site-navigation div.sidebar-chunk a,
| |
| div#infobox th a {
| |
| color:var(--link);
| |
| }
| |
|
| |
| /* Make links regular colour when hovered */
| |
| a:hover,
| |
| li a:hover span, /* Links in lists need extra work~ */
| |
| a.external:visited:hover /* So do _visited_ external ones */ {
| |
| color:var(--link)!important;
| |
| }
| |
|
| |
| /* Categories page */
| |
| div.mw-category-group {
| |
| /* Don't break sections onver columns */
| |
| break-inside:avoid-column;
| |
| margin-bottom:1em;
| |
| }
| |
|
| |
| div.mw-category-group h3 {
| |
| background-color:unset;
| |
| border-bottom:none;
| |
| color:var(--black);
| |
| margin-top:0;
| |
| }
| |
|
| |
| /* Logo image */
| |
| #p-logo-text a {
| |
| content:url("images/f/f4/timeless_asciistick_logo.png")/* / "Videogame Interface Wiki" alt text not workign for some reason */;
| |
| height:38px;
| |
| margin:auto;
| |
| }
| |
|
| |
| #mw-indicator-mw-helplink a {
| |
| padding-right:var(--gridgap);
| |
| }
| |
|
| |
| /* Fix colour of user link in header */
| |
| #user-tools {
| |
| filter:invert(100%);
| |
| }
| |
|
| |
| .toc {
| |
| background-color:var(--colour_bg_tertiary);
| |
| border:solid 1px black;
| |
| border-top-width:var(--rule-height);
| |
| margin:var(--gridgap);
| |
| padding:var(--gridgap);
| |
| }
| |
|
| |
| .toc .toctitle {
| |
| border-bottom:none;
| |
| margin-bottom:var(--gridgap);
| |
| }
| |
|
| |
| .toc .toctitle h2 {
| |
| background-color:unset;
| |
| color:black;
| |
| padding-left:0;
| |
| }
| |
|
| |
| .toc ul {
| |
| margin:0;
| |
| }
| |
|
| |
| .subpages {
| |
| margin-left: 22px;
| |
| }
| |
|
| |
| /* Fix image size in tables */
| |
| .mw-body-content table a > img {
| |
| max-width:100%!important;
| |
| }
| |
|
| |
| .mw-search-form-wrapper,
| |
| .mw-search-results-container,
| |
| .mw-search-results {
| |
| margin-left:var(--gridgap);
| |
| }
| |
|
| |
| .mw-search-profile-tabs {
| |
| background-color:var(--colour_bg_tertiary)!important;
| |
| border:none!important;
| |
| box-shadow:none;
| |
| }
| |
