Difference between revisions of "MediaWiki:Common.css"

From The Coppermind
Jump to navigation Jump to search
(testing. fbstj if you know how to alter the colour of the top right links feel free to jump in. I'll get rid of this in a minute.)
m (Since we're also using the infobox class for non-infobox tables, where it's reasonable to want to be able to, say, center all text in a row)
 
(154 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 
/* CSS placed here will be applied to all skins */
 
/* CSS placed here will be applied to all skins */
table.infobox{ border: 1px solid black; border-spacing:0; }
 
   
  +
/* <quote> tag css - 2018-07-25 */
.infobox th { background-color:silver; }
 
  +
.quote-tag cite::before { content: "\2014 \0020"; }
.infobox th.title { color:white; background-color:black; }
 
  +
.right-quote { float: right; }
.infobox td, .infobox th { padding:4px; }
 
  +
.left-quote { float: left; }
   
.portlet h5 { color: white; font-weight:bold; }
 
   
  +
/* information boxes and navigation bars */
.mytalk { color: white; }
 
  +
table.infobox, table.navbar {
  +
border: 1px solid #aaa;
  +
border-spacing: 1;
  +
background-color: white;
  +
}
   
  +
.infobox td, .navbar td
  +
.infobox th, .navbar th {
  +
padding: 4px;
  +
}
  +
.infobox th, .navbar th {
  +
background-color: #ddddff;
  +
white-space: nowrap;
  +
}
  +
.infobox tr.title th, .navbar tr.title th,
  +
.infobox th.title, .navbar th.title {
  +
color: black;
  +
background-color: #ccccff;
  +
text-align: center;
  +
}
  +
.infobox .kv td, .navbar td {
  +
text-align: left;
  +
}
  +
  +
.infobox .kv th, .navbar .kv th {
  +
width: 15%;
  +
}
  +
  +
.infobox.side {
  +
width: 22em;
  +
float: right;
  +
margin-left: 0.5em;
  +
}
  +
.infobox.side td {
  +
font-size: 90%;
  +
}
  +
  +
/* putting the ToC in the infobox (2016-12-20) */
  +
.infobox #toc {
  +
width: 100%!important;
  +
padding: initial!important;
  +
}
  +
  +
/* make sure images fit mobile screens (2018-06-13) */
  +
.thumbinner { max-width: 80vw; }
  +
.thumbimage { max-width: 80vw; height: auto; }
  +
  +
/* Notice */
  +
div.notice {
  +
text-align: center;
  +
margin: auto;
  +
width: 60%;
  +
padding: 0.5em;
  +
}
  +
div.notice.quality {
  +
font-style: italic;
  +
}
  +
img.notice {
  +
width: 1em;
  +
}
  +
/* Coppermind: Objective styles*/
  +
.objective-complete:before { content: '\2714\FE0F'; }
  +
  +
/* curved */
 
.curved {
 
.curved {
border-radius: 10px;
+
border-radius: 10px;
-moz-border-radius: 10px;
 
-webkit-border-radius: 10px;
 
-khtml-border-radius: 10px;
 
-icab-border-radius: 10px;
 
-o-border-radius: 10px;
 
 
}
 
}
.tl { border-top-left-radius:10px; -moz-border-radius-topleft: 10px; }
 
.tr { border-top-right-radius:10px; -moz-border-radius-topright: 10px; }
 
.bl { border-bottom-left-radius:10px; -moz-border-radius-bottomleft: 10px; }
 
.br { border-bottom-right-radius:10px; -moz-border-radius-bottomright: 10px; }
 
   
  +
/* quotes */
.navaid{ display: block; margin: 1em 40px; font-style: italic; }
 
  +
blockquote.source {
  +
margin-right: 0;
  +
}
  +
  +
/* navigation */
  +
.navaid {
  +
display: block;
  +
margin: 1em 40px;
  +
font-style: italic;
  +
}
  +
.catlinks {
  +
padding-top: 0.5em;
  +
}
  +
#p-cactions li.selected a {
  +
color: #061626;
  +
}
  +
  +
/* slimmer footer*/
  +
#footer-info-lastmod { float: left; }
  +
#footer-info-viewcount { float: right; }
  +
#footer-places { clear: both; }
  +
  +
/* auto columns*/
  +
.references {
  +
-moz-column-width: 300px;
  +
-webkit-column-width: 300px;
  +
column-width: 300px;
  +
list-style-position: inside;
  +
}
  +
  +
/* keep long references in blocks */
  +
.references li {
  +
-moz-column-break-inside: avoid;
  +
-webkit-column-break-inside: avoid;
  +
column-break-inside: avoid;
  +
}
  +
  +
/* bibliography styles */
  +
.bib td { text-align: center; }
  +
.bib .other td { background-color: #F2F2CE; }
  +
.bib .cosmere td { background-color: #CEF2CE; }
  +
.bib .unreleased td:first-of-type { background-color: #F2CED4; }
  +
  +
/* page indicators */
  +
.mw-indicators {
  +
width: 50%;
  +
text-align: right;
  +
}
  +
#mw-indicator-series, #mw-indicator-cosmere {
  +
float: left;
  +
}
  +
  +
/* awards css */
  +
.award {
  +
border: 1px solid #999;
  +
margin: 1px;
  +
width: 20em;
  +
}
  +
.award table {
  +
border-collapse: collapse;
  +
width: 100%;
  +
margin-bottom: 0;
  +
background: #eee;
  +
}
  +
.award td {
  +
height: 45px;
  +
vertical-align: middle;
  +
}
  +
.award-l, .award-r {
  +
width: 45px;
  +
background: #ddd;
  +
text-align: center;
  +
font-size: 14pt;
  +
color: black;
  +
line-height: 1.25em;
  +
}
  +
.award-1 {
  +
padding: 0 4px 0 4px;
  +
}
  +
  +
/* hide things */
  +
.hidden { display: none; }
  +
  +
.cm-tracking {
  +
vertical-align: sub;
  +
font-size: xx-small;
  +
}
  +
/* hide the cite tracking {{t|tracking-link}} */
  +
.references .cm-tracking { display: none; }
  +
/* REMOVE: hide the cite tracking <sub>#</sub> */
  +
.reference-text sub { display: none; }
  +
/* hide the date ? error */
  +
.rosharan-date .error { display: none; }
  +
  +
/* some helper classes for table column styling 2018-11-08 */
  +
.center-col-1 td:nth-child(1) { text-align: center; }
  +
.center-col-2 td:nth-child(2) { text-align: center; }
  +
.center-col-3 td:nth-child(3) { text-align: center; }
  +
.center-col-4 td:nth-child(4) { text-align: center; }
  +
.center-col-5 td:nth-child(5) { text-align: center; }
  +
.center-col-6 td:nth-child(6) { text-align: center; }
  +
.center-col-7 td:nth-child(7) { text-align: center; }
  +
  +
  +
/* thumbnail attribution style */
  +
.attribution { font-size: smaller; text-align: center; }
  +
  +
  +
/* Main page overviews */
  +
.cosmere-overview {
  +
column-count: 3;
  +
font-size: 110%;
  +
width: 80%;
  +
margin: auto;
  +
}
  +
  +
.series-overview p {
  +
width: 100%;
  +
display: grid;
  +
grid-template-columns: repeat(5, 1fr);
  +
font-size: 130%;
  +
padding: 1px;
  +
grid-gap: 2px;
  +
text-align: center;
  +
font-weight: bold;
  +
}
  +
  +
@media (max-width: 640px) {
  +
.coppermind-spoiler-warning {
  +
font-size: 1em !important;
  +
}
  +
}
  +
  +
@font-face {
  +
font-family: "Trajan Pro";
  +
src: url('https://coppermind.net/TrajanProBold.ttf') format("truetype");
  +
}

Latest revision as of 01:43, 25 January 2023

/* CSS placed here will be applied to all skins */

/* <quote> tag css - 2018-07-25 */
.quote-tag cite::before { content: "\2014 \0020"; }
.right-quote { float: right; }
.left-quote  { float: left;  }


/* information boxes and navigation bars */
table.infobox, table.navbar {
  border: 1px solid #aaa;
  border-spacing: 1;
  background-color: white;
}

.infobox td, .navbar td
.infobox th, .navbar th {
  padding: 4px;
}
.infobox th, .navbar th {
  background-color: #ddddff;
  white-space: nowrap;
}
.infobox tr.title th, .navbar tr.title th,
.infobox th.title, .navbar th.title {
  color: black;
  background-color: #ccccff;
  text-align: center;
}
.infobox .kv td, .navbar td {
  text-align: left;
}

.infobox .kv th, .navbar .kv th {
  width: 15%;
}

.infobox.side {
  width: 22em;
  float: right;
  margin-left: 0.5em;
}
.infobox.side td {
  font-size: 90%;
}

/* putting the ToC in the infobox (2016-12-20) */
.infobox #toc {
  width: 100%!important;
  padding: initial!important;
}

/* make sure images fit mobile screens (2018-06-13) */
.thumbinner { max-width: 80vw; }
.thumbimage { max-width: 80vw; height: auto; }

/* Notice */
div.notice {
  text-align: center;
  margin: auto;
  width: 60%;
  padding: 0.5em;
}
div.notice.quality {
  font-style: italic;
}
img.notice {
  width: 1em;
}
/* Coppermind: Objective styles*/
.objective-complete:before { content: '\2714\FE0F'; }

/* curved */
.curved {
  border-radius: 10px;
}

/* quotes */
blockquote.source {
  margin-right: 0;
}

/* navigation */
.navaid {
  display: block;
  margin: 1em 40px;
  font-style: italic;
}
.catlinks {
  padding-top: 0.5em;
}
#p-cactions li.selected a {
  color: #061626;
}

/* slimmer footer*/
#footer-info-lastmod { float: left; }
#footer-info-viewcount { float: right; }
#footer-places { clear: both; }

/* auto columns*/
.references {
  -moz-column-width: 300px;
  -webkit-column-width: 300px;
  column-width: 300px;
  list-style-position: inside;
}

/* keep long references in blocks */
.references li {
  -moz-column-break-inside: avoid;
  -webkit-column-break-inside: avoid;
  column-break-inside: avoid;
}

/* bibliography styles */
.bib td { text-align: center; }
.bib .other td { background-color: #F2F2CE; }
.bib .cosmere td { background-color: #CEF2CE; }
.bib .unreleased td:first-of-type { background-color: #F2CED4; }

/* page indicators */
.mw-indicators {
    width: 50%;
    text-align: right;
}
#mw-indicator-series, #mw-indicator-cosmere {
    float: left;
}

/* awards css */
.award {
  border: 1px solid #999;
  margin: 1px;
  width: 20em;
}
.award table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 0;
  background: #eee; 
}
.award td {
  height: 45px;
  vertical-align: middle;
}
.award-l, .award-r {
  width: 45px;
  background: #ddd;
  text-align: center;
  font-size: 14pt;
  color: black;
  line-height: 1.25em;
}
.award-1 {
  padding: 0 4px 0 4px;
}

/* hide things */
.hidden { display: none; }

.cm-tracking {
  vertical-align: sub;
  font-size: xx-small;
}
/* hide the cite tracking {{t|tracking-link}} */
.references .cm-tracking { display: none; }
/* REMOVE: hide the cite tracking <sub>#</sub> */
.reference-text sub { display: none; }
/* hide the date ? error */
.rosharan-date .error { display: none; }

/* some helper classes for table column styling 2018-11-08 */
.center-col-1 td:nth-child(1) { text-align: center; }
.center-col-2 td:nth-child(2) { text-align: center; }
.center-col-3 td:nth-child(3) { text-align: center; }
.center-col-4 td:nth-child(4) { text-align: center; }
.center-col-5 td:nth-child(5) { text-align: center; }
.center-col-6 td:nth-child(6) { text-align: center; }
.center-col-7 td:nth-child(7) { text-align: center; }


/* thumbnail attribution style */
.attribution { font-size: smaller; text-align: center; }


/* Main page overviews */
.cosmere-overview {
    column-count: 3;
    font-size: 110%;
    width: 80%;
    margin: auto;
}

.series-overview p {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    font-size: 130%;
    padding: 1px;
    grid-gap: 2px;
    text-align: center;
    font-weight: bold;
}

@media (max-width: 640px) {
    .coppermind-spoiler-warning {
        font-size: 1em !important;
    }
}

@font-face {
    font-family: "Trajan Pro";
    src: url('https://coppermind.net/TrajanProBold.ttf') format("truetype");
}