MediaWiki:Timeless.css: Difference between revisions

From Videogame Interface Wiki
m (BG image)
m (Trying proper theme shit one more time)
Tags: Blanking Manual revert
 
(10 intermediate revisions by the same user not shown)
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_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
}
div#infobox div.content-table {
height:100%;
/* remove margin previously set for mulatiple elements */
margin:0;
}
div#infobox table {
background-color:#DBDBDB;
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;
}
h4,h5,h6 {
background-color:var(--silver);
color:black;
}
h4 {
font-size: 1.2em!important;
border-top:1px solid black;
border-bottom:1px solid black;
}
h5 {
border-top:1px dashed black;
border-bottom:1px dashed black;
}
h6 {
border-top:1px dotted black;
border-bottom:1px dotted black;
}
/*  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:#DBDBDB;
}
.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:#DBDBDB;*/
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;
color:var(--black);
margin-top:0;
}

Latest revision as of 05:41, 20 May 2024