Welcome to the TWC Wiki! You are not logged in. Please log in to the Wiki to vote in polls, change skin preferences, or edit pages. See HERE for details of how to LOG IN.

Difference between revisions of "MediaWiki:Common.css"

From TWC Wiki
Jump to navigationJump to search
(try again)
Line 234: Line 234:
  
 
/*  =============================================================================================================== */
 
/*  =============================================================================================================== */
/*  Responsive column layout from http://www.responsivegridsystem.com/ */
+
/*  Responsive column layout from http://www.responsivegridsystem.com/ TWCR added to class names to avoid conflicts */
 
/*  Trying to add styling to the columns tends to break the layout - suggest styling the elements within them instead */
 
/*  Trying to add styling to the columns tends to break the layout - suggest styling the elements within them instead */
div.section, div.group {
+
div.TWCRsection, div.TWCRgroup {
 
         border: none;
 
         border: none;
 
         background: none;
 
         background: none;
Line 243: Line 243:
 
}
 
}
  
.section {
+
.TWCRsection {
 
clear: both;
 
clear: both;
 
padding: 0px;
 
padding: 0px;
Line 249: Line 249:
 
}
 
}
  
.group:before,
+
.TWCRgroup:before,
.group:after {
+
.TWCRgroup:after {
 
     content:"";
 
     content:"";
 
     display:table;
 
     display:table;
 
}
 
}
.group:after {
+
.TWCRgroup:after {
 
     clear:both;
 
     clear:both;
 
}
 
}
.group {
+
.TWCRgroup {
 
     zoom:1; /* For IE 6/7 (trigger hasLayout) */
 
     zoom:1; /* For IE 6/7 (trigger hasLayout) */
 
}
 
}
  
 
/*  GRID COLUMN SETUP */
 
/*  GRID COLUMN SETUP */
.col {
+
.TWCRcol {
 
display: block;
 
display: block;
 
float:left;
 
float:left;
Line 268: Line 268:
 
}
 
}
  
.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
+
.TWCRcol:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
  
 
/* ANY FULL WIDTH COLUMN IN SECION*/
 
/* ANY FULL WIDTH COLUMN IN SECION*/
Line 296: Line 296:
 
/*  GO FULL WIDTH AT LESS THAN 700 PIXELS & REDUCE MARGINS*/
 
/*  GO FULL WIDTH AT LESS THAN 700 PIXELS & REDUCE MARGINS*/
 
@media only screen and (max-width: 700px) {
 
@media only screen and (max-width: 700px) {
 +
.TWCRcol { margin: 1% 0 1% 0%; }
 
.col { margin: 1% 0 1% 0%;}
 
.col { margin: 1% 0 1% 0%;}
 
.span_3_of_3, .span_2_of_3, .span_1_of_3, .span_2_of_2, .span_1_of_2, .span_40pct_of_2, .span_60pct_of_2 { width: 100%; }
 
.span_3_of_3, .span_2_of_3, .span_1_of_3, .span_2_of_2, .span_1_of_2, .span_40pct_of_2, .span_60pct_of_2 { width: 100%; }

Revision as of 03:05, 17 May 2019

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

/* Random stuff */

div.section div.section {
    /* Indent, but not for the highest-level section */
    margin-left: 1.5em;
}

/* Hide numbers for TOCs wrapped in <div class="nonumbertoc"></div> */
div.nonumbertoc span.tocnumber { display: none; }

/* 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;
}

.notice { margin: 1em; font-style: italic; }

/* Front page */

body.page-Main_Page h1.firstHeading {
    display: none;
}

.frontpage-wikinews, .frontpage-generalmodding, .frontpage-m2tw {
    border: 2px solid grey;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
}

.frontpage-wikinews {
    width: 25%;
    background-color: #cff;
}

.frontpage-generalmodding {
    background-color: #ffc;
}

.frontpage-m2tw {
    width: 65%;
    background-color: #ffebcd;
}

/* Infobox template style stolen from Wikipedia */
 
.infobox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    color: black;
    margin-bottom: 0.5em;
    margin-left: 1em;
    padding: 0.2em;
    float: right;
    clear: right;
}
.infobox td,
.infobox th {
    vertical-align: top;
}
.infobox caption {
    font-size: larger;
    margin-left: inherit;
}
.infobox.bordered {
    border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
    border: 1px solid #aaa;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
    border: 0;
}
 
/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
    border: 0;
    border-top: 1px solid #aaa;
    border-right: 1px solid #aaa;
}
 
.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
    border: 0;
    border-right: 1px solid #aaa;
}

/*****
** Table formatting
*****/
   table.wikitable,
   table.collapsetable {
      margin:1em 1em 1em 0;
      background:#F9F9F9;
      border:1px #AAA solid;
      border-collapse:collapse;
      }
 
   table.wikitable th, table.wikitable td,
   table.collapsetable th, table.collapsetable td {
      border:1px #AAA solid;
      padding:0.2em;
      }
 
   table.wikitable th,
   table.collapsetable th {
      background:#F2F2F2;
      text-align:center;
      }
 
   table.wikitable caption,
   table.collapsetable caption {
      margin-left:inherit;
      margin-right:inherit;
      }

/******* portal standardisation attempt*****/
.TWCportal {
    border: 2px solid grey;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background-color: #e3e3e3;
} 

.TWCportal h3 {
    padding:5px; 
    background-color:#7d1515; 
    color:white;
}

.portallink a:link {
    color:#DCE6FF;
}

.portallink a:visited {
    color:#DCE6FF;
}

.portallink a:hover {
    color:#B7C4ED;
}

/******* new front page boxes*****/

.portal_TW {
    border: 2px solid grey;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background-color: #E5E1DB;
} 

.portal_TW h3 {
    padding:5px; 
    background-color:#7d1515; 
    color:white;
}
/******* modding box standardisation attempt*****/

.modding {
    border: 2px solid grey;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background-color: #cdc7c7;
} 

.modding h3 {
    padding:5px; 
    background-color:#7d1515; 
    color:white;
}

/* End infobox styles */




/**
 * Styling for links generated by [[MediaWiki:Edittools]]
 * @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
 * @updated 2012-02-29
 */
.mw-charinsert-buttons {
	margin-top: 10px;
	border: 1px solid #aaaaaa;
	padding: 1px;
	text-align: center;
	font-size: 110%;
}
.mw-charinsert-buttons a {
	color: black;
	background-color: #cde !important;
	font-weight: bold;
	font-size: .9em;
	text-decoration: none;
	border: thin #069 outset;
	padding: 0 .1em .1em;
}
.mw-charinsert-buttons a:hover,
.mw-charinsert-buttons a:active {
	background-color: #bcd;
	border-style: inset;
}
.client-js .mw-edittools-section {
	display: inline;
}
.client-js .mw-edittools-section input[type="button"] {
	font-size: 0.9em;
	padding-left: 1px;
	padding-right: 1px;
	margin-left: 1px;
}

/*common changes for ajaxpoll*/
.ajaxpoll {
    width: auto;
}

/*  =============================================================================================================== */
/*  Responsive column layout from http://www.responsivegridsystem.com/ TWCR added to class names to avoid conflicts */
/*  Trying to add styling to the columns tends to break the layout - suggest styling the elements within them instead */
div.TWCRsection, div.TWCRgroup {
        border: none;
        background: none;
	padding: none;
	margin: none;
}

.TWCRsection {
	clear: both;
	padding: 0px;
	margin: 0px;
}

.TWCRgroup:before,
.TWCRgroup:after {
    content:"";
    display:table;
}
.TWCRgroup:after {
    clear:both;
}
.TWCRgroup {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP */
.TWCRcol {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.TWCRcol:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

/* ANY FULL WIDTH COLUMN IN SECION*/
.span_full {
	width: 100%;
}
/* SPANNING 2 COLUMNS OUT OF 3*/
.span_2_of_3 {
	width: 66.1%;
}
/* SINGLE WIDTH COLUMN OF 3*/
.span_1_of_3 {
	width: 32.2%;
}
/* SINGLE COLUMN OF 2*/
.span_1_of_2 {
	width: 49.2%;
}
/* PAIR OF COLUMNS  40/60 percent splits */
.span_40pct_of_2 {
	width: 39.36%;
}
.span_60pct_of_2 {
	width: 59.04%;
}

/*  GO FULL WIDTH AT LESS THAN 700 PIXELS & REDUCE MARGINS*/
@media only screen and (max-width: 700px) {
	.TWCRcol { margin: 1% 0 1% 0%; }
	.col { margin: 1% 0 1% 0%;}
	.span_3_of_3, .span_2_of_3, .span_1_of_3, .span_2_of_2, .span_1_of_2, .span_40pct_of_2, .span_60pct_of_2 { width: 100%; }
}

/*  =============================================================================================================== */
/* NEW CLASSES FOR FRONT PAGE AND PORTALS (old ones should be deleted when confirmed not in use) */
.TWCportal_1, .TWCportal_2, .TWCportal_3 {    border: none;
    padding: .4em .9em .1em;
    color: black;
    vertical-align: top;
}
.TWCportal_1 {
    background: rgb(227,227,227);
    background: linear-gradient(180deg, rgba(165,165,180,0.5) 0%, rgba(165,165,180,0) 100%);
}
.TWCportal_2 {
    background: rgb(205,199,199);
    background: linear-gradient(180deg, rgba(168,160,162,0.5) 0%, rgba(168,160,162,0) 100%);
}
.TWCportal_3 {
    background: rgb(229,225,219);
    background: linear-gradient(180deg, rgba(168,168,162,0.5) 0%, rgba(168,168,162,0) 100%);
}
.TWCportal_head {
    padding:5px; 
    background:#7d1515; 
    color:white;
    margin-bottom: 0em;
}
h2.TWCportal_head{
    font-size: 128%;
    border-bottom: 0;
    font-weight: bolder;
}
h1.TWCportal_head{
    padding:10px;
    border-bottom: 0;
    text-align: center;
}