Difference between revisions of "MediaWiki:Common.css"

From Regiapædia
Jump to: navigation, search
(Emergency styling so meny is readable!)
 
(8 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
+
/*
  
body.page-Main_Page h1.firstHeading { display:none; }
+
Common CSS for all skins
  
.hidden {display:none}
+
See https://phabricator.wikimedia.org/M82 for standard colors
  
/* Hide page elements */
+
*/
/*#ca-history { display:none!important; } */
+
* {
/* #filehistory {display: none} */ /* Hides the "File history" header */
+
box-sizing: border-box;
/* .special {display: none} */ /* Hides the Edit history */
+
}
#metadata {display: none} /* Hides the "Metadata" header */
+
.clear{
#mw_metadata {display: none} /* Hides the Metadata graph */
+
clear:both;
#ca-talk { display:none!important; }
+
}
#footer-places-Privacy_policy { display:none;}
+
html, body {
#footer-places-disclaimer { display:none;}
+
  width: 100vw;
#footer-places-about { display:none;}
+
  min-height: 100vh;
 +
  margin: 0;
 +
  padding: 0;
 +
  min-width:320px;
 +
}
  
/* Hides Mobile only elements */
 
#mf-HideOnDesktop { display: none; }
 
  
/* Table of Contents Settings */
 
.tocnumber { display: none !important; }
 
.toc { width: 200px; }
 
#toc { float:right };
 
  
/* Allow limiting of which header levels are shown in a TOC;
+
table, th, td {
  <div class="toclimit-3">, for instance, will limit to
+
    border: 1px solid darkgray;
  showing ==headings== and ===headings=== but no further
+
    padding: 1px;
  (as long as there are no =headings= on the page, which
+
    margin: 6px 0;
  there shouldn't be according to the MoS).*/
+
    margin-left: auto;
.toclimit-2 .toclevel-2,
+
    margin-right: auto;
.toclimit-3 .toclevel-3,
+
}
.toclimit-4 .toclevel-4,
+
caption {
.toclimit-5 .toclevel-5,
+
font-weight:bold;
.toclimit-6 .toclevel-6,
+
text-align:left;
.toclimit-7 .toclevel-7 { display: none; }
+
}
 
+
body {
 
+
overflow-y: scroll;
/* Regia boxes*/
+
display: grid;
#RFrame {
+
background-color: #080808;
    margin-right: 0px;  
+
color:#fff;
 +
font-size:14px;
 +
font-family:tahoma,helvetica,sans-serif;
 
}
 
}
  
#PageFrame {
+
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
    margin-right: 245px;  
+
  /* IE-only styles here. Works for IE10 & IE11*/
 +
html, body {
 +
background-color: #FFFFD5;
 +
width:100%;
 +
}
 +
.quicklink {
 +
display:block!important;
 +
}
 
}
 
}
  
 
+
header {
 
+
grid-area: header;
/* Gallery Packed */
+
background:linear-gradient(#000 85%,#ffffd5 100%);
#Packed {
+
min-height: 100px;
    Padding-left: 30px;
+
padding-bottom:15px;
    text-align: left;
 
    display: inline-block;
 
 
}
 
}
 
+
.megamenu_container {
#Packed p {
+
background:#000!important;
    margin-right: 0px;
 
    text-align: left;
 
 
}
 
}
 
+
.megamenu {
/* Gallery Pin Tiles */
+
text-align:center;
 
 
#PinTile {
 
    display: inline-block;
 
    border-radius: 7px;
 
    background-color:#ffffff;
 
    border:1px solid #808080;
 
    overflow:Hidden;
 
    margin: 0px 3px 5px 3px;
 
    width: 180px;
 
 
}
 
}
 
+
.megamenu li {
/* CSS Pinterest Like Gallery for Mediawiki
+
display:inline;
*
+
text-align:center;
* @author: Unknown
 
* current version crafted together by [[User:Christharp]] from several CSS sites. For my website:[http://www.yellpedia.com/wiki/Main_Page Yellpedia]
 
*/
 
 
 
#container {
 
    width: 932px;
 
    margin: 0 auto;
 
   
 
 
}
 
}
+
.megamenu a {
#Pin-Tiles {
+
color:white;
    -moz-column-count: 5;
 
    -moz-column-gap: 3px;
 
    -webkit-column-count: 5;
 
    -webkit-column-gap: 3px;
 
    column-count: 5;
 
    column-gap: 3px;
 
    width: 932px;
 
<!-- border: 1px solid black; -->
 
 
}
 
}
 
+
main {
/*
+
background-color: #ffffd5;
#Pin-Tiles img{
+
grid-area: main;
    display: inline-block;
+
color: #000;
    margin-bottom: 5px;
+
overflow:hidden;
    width: 100%;
 
} */
 
 
 
@media only screen and (max-width : 1420px){
 
    #Pin-Tiles {
 
        -moz-column-count: 4;
 
        -moz-column-gap: 3px;
 
        -webkit-column-count: 4;
 
        -webkit-column-gap: 3px;
 
        column-count: 4;
 
        column-gap: 3px;
 
        width: 745px;
 
    <!--  border: 1px solid red; -->
 
    }
 
   
 
    #container {
 
        width: 745px;
 
        border: 10px solid black;
 
    }
 
 
}
 
}
+
footer {
+
grid-area: footer;
@media only screen and (max-width : 1230px){
+
    background: linear-gradient(#ffffd5 0%,#000 15%);
    #Pin-Tiles {
+
    min-height: 100px;
        -moz-column-count: 3;
+
    display: grid;
        -moz-column-gap: 3px;
+
    padding: 50px 20px 10px;
        -webkit-column-count: 3;
+
    color: white;
        -webkit-column-gap: 3px;
+
text-align: center;
        column-count: 3;
 
        column-gap: 3px;
 
        width: 560px;
 
  <!--  border: 1px solid blue; -->
 
    }
 
   
 
    #container {
 
        width: 560px;
 
    }
 
 
}
 
}
+
footer a {
@media only screen and (max-width : 1044px){
+
display:block;
    #Pin-Tiles {
+
color:white;
        -moz-column-count: 2;
+
text-decoration:none;
        -moz-column-gap: 3px;
+
padding: 0 0 1.6em;
        -webkit-column-count: 2;
 
        -webkit-column-gap: 3px;
 
        column-count: 2;
 
        column-gap: 3px;
 
        width: 375px;
 
  <!--  border: 1px solid orange; -->
 
    }
 
   
 
    #container {
 
        width: 375px;
 
    }
 
 
}
 
}
+
footer a:hover {
@media only screen and (max-width : 820px){
+
color:yellowgreen;
    #Pin-Tiles {
 
        -moz-column-count: 1;
 
        -moz-column-gap: 3px;
 
        -webkit-column-count: 1;
 
        -webkit-column-gap: 3px;
 
        column-count: 1;
 
        column-gap: 3px;
 
        width: 190px;
 
<!--    border: 1px solid green; -->
 
    }
 
   
 
    #container {
 
        width: 190px;
 
    }
 
 
}
 
}
 
[[Category:Wiki]]
 

Latest revision as of 17:26, 17 October 2021

/*

Common CSS for all skins

See https://phabricator.wikimedia.org/M82 for standard colors

*/
* {
	box-sizing: border-box;
}
.clear{
	clear:both;
}
html, body {
  width: 100vw;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  min-width:320px;
}



table, th, td {
    border: 1px solid darkgray;
    padding: 1px;
    margin: 6px 0;
    margin-left: auto;
    margin-right: auto;
}
caption {
	font-weight:bold;
	text-align:left;
}
body {
	overflow-y: scroll;
	display: grid;
	background-color: #080808;
	color:#fff;
	font-size:14px;
	font-family:tahoma,helvetica,sans-serif;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE-only styles here. Works for IE10 & IE11*/
	html, body {
		background-color: #FFFFD5;
		width:100%;
	}
	.quicklink {
		display:block!important;
	}
}

header {
	grid-area: header;
	background:linear-gradient(#000 85%,#ffffd5 100%);
	min-height: 100px;
	padding-bottom:15px;
}
.megamenu_container {
	background:#000!important;
}
.megamenu {
	text-align:center;
}
.megamenu li {
	display:inline;
	text-align:center;
}
.megamenu a {
	color:white;
}
main {
	background-color: #ffffd5;
	grid-area: main;
	color: #000;
	overflow:hidden;
}
footer {
	grid-area: footer;
    background: linear-gradient(#ffffd5 0%,#000 15%);
    min-height: 100px;
    display: grid;
    padding: 50px 20px 10px;
    color: white;
	text-align: center;
}
footer a {
	display:block;
	color:white;
	text-decoration:none;
	padding: 0 0 1.6em;
}
footer a:hover {
	color:yellowgreen;
}