If you appreciate the work done within the wiki, please consider supporting The Cutting Room Floor on Patreon. Thanks for all your support!

MediaWiki:Common.css

From The Cutting Room Floor
Jump to navigation Jump to search

Note: After saving, 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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */

/* 
 * Any downscaled images are handled by MediaWiki's clean resampling.
 * For that reason, any image needing user-side resizing will usually be due to zoomed in images.
 * This will enable us to have nice and crisp graphics regardless of how large they're blown up:
 */
* { 
  image-rendering: -moz-crisp-edges; 
  image-rendering: -o-crisp-edges; 
  image-rendering: -webkit-optimize-contrast; 
  image-rendering: crisp-edges;
  image-rendering: pixelated;
  -ms-interpolation-mode:nearest-neighbor;
  }

/* Hide links leading to the Visual Editor */
#ca-ve-edit, .mw-editsection-visualeditor, .mw-editsection-divider {display: none !important;}

.navbox a {
 white-space: nowrap;
}

.nop p {padding:0; margin:0;}

.breakout {
  float: right;
  border: 1px solid #888;
  background: #fff;
  padding: 0.2em;
  }

.breakouttitle {
  text-align: center;
  background: #cfc;
  border-top: 1px solid #6a6;
  border-bottom: 1px solid #6a6;
  }


.contributionscores .header     { background-color: #eee; border-bottom: 1px solid #999999; font-weight: bold; }
.contributionscores .header td  { padding-left: .2em; padding-right: .2em; }
.contributionscores td { padding-left: .2em; padding-right: .2em; border-bottom: 1px solid #ccc;}


input, textarea {
  border: 1px solid #ccc;
  background: #f8f8f8; /* you can't fight f8 */
  color:      #000;
}



/* wikitable/prettytable class for skinning normal tables */
table.wikitable,
table.prettytable {
    margin: 1em 1em 1em 0;
    background: #f9f9f9;
    border: 1px #aaa solid;
    border-collapse: collapse;
}
.wikitable th, .wikitable td,
.prettytable th, .prettytable td {
    border: 1px #aaa solid;
    padding: 0.2em;
}
.wikitable th,
.prettytable th {
    background: #f2f2f2;
    text-align: center;
}
.wikitable caption,
.prettytable caption {
    font-weight: bold;
}



/* special table for Paper Mario: Thousand Year Door system messages */
table.papersystem {
    margin: 1px 0 1px 0;
    background-image: url(images/2/25/PMTTYDSystemAnimated.gif);
    background-repeat: repeat;
    text-shadow: 2px 2px 2px #000;
    color:  #FFF;
    line-height: 1.5;
    font-size: 120%;
    border: 2px #e0e0e0 solid;
    height: 96px;
    width: 288px;
}

/* special table for Shining Force II messages */
table.sf2 {
    background-image: url(images/e/ec/Shining2DialogueBox.png);
    color:  #FFF;
    font-size: 110%;
    line-height: 1.1;
    vertical-align: top;
    height: 56px;
    width: 232px;
    padding: 0px 8px;
    border: 0 !important;
}

/* special table for Shining Force II battle messages */
table.sf2B {
    background-image: url(images/e/ec/Shining2DialogueBox.png);
    color:  #FFF;
    font-size: 110%;
    line-height: 1.1;
    vertical-align: top;
    height: 40px;
    width: 232px;
    padding: 0px 8px;
    border: 0 !important;
}

/* special table for Shining Force II character pics */
table.sf2C {
    background-image: url(images/c/ce/Shining2CharBox.png);
    color:  #FFF;
    font-size: 110%;
    vertical-align: middle;
    height: 80px;
    width: 64px;
    padding: 0px 8px;
    border: 0 !important;
}

/* special table for Phantasy Star II messages */
table.psII {
    background-image: url(images/6/6b/PhantasyStarIIDialogueBox.png);
    color:  #FFF;
    font-size: 110%;
    line-height: 1.1;
    vertical-align: top;
    height: 42px;
    width: 200px;
    padding: 0px 8px;
    border: 0 !important;
}

/* special table for Phantasy Star IV messages */
table.psIV {
    background-image: url(images/6/60/PSIVDialogueBox.png);
    color:  #FFF;
    font-size: 15px;
    line-height: 1.3;
    vertical-align: top;
    height: 52px;
    width: 272px;
    padding: 4px 8px;
    border: 0 !important;
}

/* special table for Phantasy Star IV item descriptions */
table.psIVI {
    background-image: url(images/7/77/PSIVDialogueBoxI.png);
    color:  #FFF;
    font-size: 12px;
    line-height: 1.3;
    vertical-align: top;
    height: 44px;
    width: 208px;
    padding: 0px 12px;
    border: 0 !important;
}

/* Makes the background of a framed image white instead of gray. */
/* Only visible with transparent images. */
div.thumb img.thumbimage {
    background-color: #fff;
}
 
/* The backgrounds for galleries. */
#content .gallerybox div.thumb {
    background-color: #F9F9F9;   /* Light gray padding */
}
/* Put a chequered background behind images, only visible if they have transparency */
.gallerybox .thumb img,
#file img {
    background: white url("images/5/5d/Checker-16x16.png") repeat;
}
/* But not on articles, user pages, portals or with opt-out. */
.ns-0 .gallerybox .thumb img,
.ns-2 .gallerybox .thumb img,
.ns-100 .gallerybox .thumb img, 
.nochecker .gallerybox .thumb img {
    background: none;
}

/* Todo: Make Galleryboxes suck less */



/*
 * Message box template
 */
.msgbox {
  margin: 0em 2em 1em 3em;
  border: 1px solid #888;
  background: #ddd;
  color: #000;
  -moz-border-radius: 0 8px 0 8px;
  border-radius: 0 8px 0 8px;
  padding: 0;
  border-spacing: 0;
  }

.msgbox td {
  vertical-align: middle;
  padding: 0.5em 1em 0.5em 0em;
  width: 100%;
  }

.msgbox .msgboximg {
  vertical-align: middle;
  width: 0%;
  padding: 0.5em 1em 0.5em 1em;
  }



/* Bottom Navbox template */
table.navbox {
  border: 1px solid #0c0;
  padding: 1px;
  margin: 0.5em auto;
  width: 90%;
  clear: both;
  font-size: 95%;
  }
.navbox th {
  background: #cfc;
  color: #000;
  }
.navboxhead {
  background: #ada !important; /* bite me */
  }



div.topicon {
  position: absolute; 
  z-index: 10; 
  top: 6px;
  right: 10px;
  display: block !important;
  }

pre:not(.CodeMirror-line), code:not(.CodeMirror-line) {display:inline-block; }
pre, tt, code { font-size: 110%; }
textarea, pre, code, tt {font-family: Consolas,  DejaVu Sans Mono, Droid Sans Mono, Lucida Console, Courier New, monospace; }

/* Taken from Wikipedia:
   Allow limiting of which header levels are shown in a TOC;
   <div class="toclimit-3">, for instance, will limit to
   showing ==headings== and ===headings=== but no further
   (as long as there are no =headings= on the page, which
   there shouldn't be according to the MoS). */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
    display: none;
}

/* User Group-based Name Highlighting */
/* Bureaucrats */
.mw-userlink[href="https://tcrf.net/User:Bast"],
.mw-userlink[href="/User:Bast"],
.mw-userlink[href="https://tcrf.net/User:CounterDiving"],
.mw-userlink[href="/User:CounterDiving"],
.mw-userlink[href="https://tcrf.net/User:Raspberry"],
.mw-userlink[href="/User:Raspberry"] {
    color: hsl(48, 89%, 40%);
    font-weight: bold;
}

/* Administrators */
.mw-userlink[href="https://tcrf.net/User:GlitterBerri"],
.mw-userlink[href="/User:GlitterBerri"],
.mw-userlink[href="https://tcrf.net/User:GoldS"],
.mw-userlink[href="/User:GoldS"],
.mw-userlink[href="https://tcrf.net/User:HugetteHikari"],
.mw-userlink[href="/User:HugetteHikari"],
.mw-userlink[href="https://tcrf.net/User:Rick"],
.mw-userlink[href="/User:Rick"],
.mw-userlink[href="https://tcrf.net/User:Sanqui"],
.mw-userlink[href="/User:Sanqui"] {
    color: hsl(145, 63%, 49%);
    font-weight: bold;
}

/* Bots */
.mw-userlink[href="https://tcrf.net/User:FuzzyBot"],
.mw-userlink[href="/User:FuzzyBot"],
.mw-userlink[href="https://tcrf.net/User:XkeeperBot"],
.mw-userlink[href="/User:XkeeperBot"] {
    color: hsl(0, 0%, 50%);
    font-weight: bold;
}

/* Special */
.mw-userlink[href="https://tcrf.net/User:Revenant"],
.mw-userlink[href="/User:Revenant"] {
    color: hsl(283, 39%, 53%);
    font-weight: bold;
}
.mw-userlink[href="https://tcrf.net/User:Xkeeper"],
.mw-userlink[href="/User:Xkeeper"] {
    color: hsl(303, 100%, 82%);
    font-weight: bold;
}
.mw-userlink[href="https://tcrf.net/User:Rachel_Mae"],
.mw-userlink[href="/User:Rachel_Mae"] {
    color: hsl(260, 100%, 62%);
    font-weight: bold;
}
.mw-userlink[href="https://tcrf.net/User:Hawk"],
.mw-userlink[href="/User:Hawk"] {
    color: hsl(100, 60%, 40%);
    font-weight: bold;
}

/* Makes easier to make whole columns follow a certain custom text alignment, independently to all the others.
 * 16 entries should be sufficient for all the tables found on the wiki.
 * 
 * Source: https://stackoverflow.com/questions/24494604/mediawiki-table-efficiently-applying-different-alignment-for-different-column#answer-31634914
 */

/* Column #1 */
table.col-1-center td:nth-child(1) { text-align: center; }
table.col-1-right td:nth-child(1) { text-align: right; }

/* Column #2 */
table.col-2-center td:nth-child(2) { text-align: center; }
table.col-2-right td:nth-child(2) { text-align: right; }

/* Column #3 */
table.col-3-center td:nth-child(3) { text-align: center; }
table.col-3-right td:nth-child(3) { text-align: right; }

/* Column #4 */
table.col-4-center td:nth-child(4) { text-align: center; }
table.col-4-right td:nth-child(4) { text-align: right; }

/* Column #5 */
table.col-5-center td:nth-child(5) { text-align: center; }
table.col-5-right td:nth-child(5) { text-align: right; }

/* Column #6 */
table.col-6-center td:nth-child(6) { text-align: center; }
table.col-6-right td:nth-child(6) { text-align: right; }

/* Column #7 */
table.col-7-center td:nth-child(7) { text-align: center; }
table.col-7-right td:nth-child(7) { text-align: right; }

/* Column #8 */
table.col-8-center td:nth-child(8) { text-align: center; }
table.col-8-right td:nth-child(8) { text-align: right; }

/* Column #9 */
table.col-9-center td:nth-child(9) { text-align: center; }
table.col-9-right td:nth-child(9) { text-align: right; }

/* Column #10 */
table.col-10-center td:nth-child(10) { text-align: center; }
table.col-10-right td:nth-child(10) { text-align: right; }

/* Column #11 */
table.col-11-center td:nth-child(11) { text-align: center; }
table.col-11-right td:nth-child(11) { text-align: right; }

/* Column #12 */
table.col-12-center td:nth-child(12) { text-align: center; }
table.col-12-right td:nth-child(12) { text-align: right; }

/* Column #13 */
table.col-13-center td:nth-child(13) { text-align: center; }
table.col-13-right td:nth-child(13) { text-align: right; }

/* Column #14 */
table.col-14-center td:nth-child(14) { text-align: center; }
table.col-14-right td:nth-child(14) { text-align: right; }

/* Column #15 */
table.col-15-center td:nth-child(15) { text-align: center; }
table.col-15-right td:nth-child(15) { text-align: right; }

/* Column #16 */
table.col-16-center td:nth-child(16) { text-align: center; }
table.col-16-right td:nth-child(16) { text-align: right; }