Difference between revisions of "MediaWiki:Common.css"

/* CSS placed here will be applied to all skins */
 
/* CSS placed here will affect users of the Vector skin */
/* If you don't master CSS, don't modify this */
 
/* THE FIRST BOX ON HOMEPAGE */
 
#homepageMainBox{
width: 50%; 
height:63px;
background-color:#62888b; 
background:url(http://kagwiki.com/images/7/7f/FondTitle.png) repeat-x;
margin: 1em auto; 
text-align: center; 
padding:0.5em;
padding-bottom:0.3em;
 
/*  put some css3 because it's awesome */
border-radius:5px;
box-shadow:
0px 2px 2px 0px rgba(0, 0, 0, 0.5),
0px 2px 2px 0px rgba(255, 255, 255, 0.5) inset;
 
}
/* Colored background to be able to read the text O_o */
#coloredBackground{
background-color: rgba(1, 1, 1, 0.15);
color:#f2f2f2;
text-shadow: 0px 1px 1px #4d4d4d;
 
/* Add shadow to the black background :O Create a nice inset effect, huuum I love it*/
-webkit-box-shadow: inset 0px 0px 6px 1px rgba(1, 1, 1, 0.3);
-moz-box-shadow: inset 0px 0px 6px 1px rgba(1, 1, 1, 0.3);
box-shadow: inset 0px 0px 6px 1px rgba(1, 1, 1, 0.3); 
 
}
 
/* 3d title was not a good idea ! :D */
#titleHomepage{
text-shadow: 0px 2px 3px #666;
}
 
#homepageMainBox a{
color:white;
}
 
/* No black text on dark background pl0x*/
 
/* THE MIDDLE ROW ON MAIN PAGE (with description and news) */
 
#homepageMiddleRow td{
background:#e3e3e3;
border-top:1px solid #a4a4a4;
border-right:1px solid #a4a4a4;
border-left:1px solid #a4a4a4;
border-bottom:1px solid #a4a4a4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; 
padding-right:10px;
padding-left:10px;
padding-top:10px;
padding-bottom:10px;
 
-webkit-box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4);
-moz-box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4);
box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4); 
 
}
 
#homepageMiddleRow td b{
color:#232323;
 
background-attachment: scroll;
background-clip: border-box;
background-color: transparent;
background-image: url("http://kagwiki.com/images/c/c4/Arrowdown.png");
background-origin: padding-box;
background-position: right center;
background-repeat: no-repeat;
background-size: auto auto;
padding-bottom: 0.4em;
padding-left: 0;
padding-right: 15px;
padding-top: 0.2em;
}
 
#homepageMiddleRow li{
text-align:left;
list-style-type:square;
}
 
#homepageMiddleRow li a{
color:#0c0c0c;
font-weight:bold;
}
 
#homepageMiddleRow li a:hover{
color:#222222;
text-decoration:none;
}
 
#homepageMiddleRow ul{
}
 
/* END OF MIDDLE ROW */
 
/* ALL THIS IS THE KAG-LIKE MENU */
/* It looks like the game menus, if you don't like it you should tell MM :O */
 
#homepageMenu td{
background:#687364;
border-top:1px solid #391a1a;
border-right:1px solid #391a1a;
border-left:1px solid #1f0b0b;
border-bottom:1px solid #1f0b0b;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; 
padding-top:10px;
padding-left:15px;
padding-bottom:10px;
 
-webkit-box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4);
-moz-box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4);
box-shadow: 0px 0px 3px 0px rgba(1, 1, 1, 0.4); 
 
}
 
#homepageMenu td b{
color:white;
text-shadow: 0 1px 1px black;
 
background-attachment: scroll;
background-clip: border-box;
background-color: transparent;
background-image: url("http://kagwiki.com/images/c/c4/Arrowdown.png");
background-origin: padding-box;
background-position: right center;
background-repeat: no-repeat;
background-size: auto auto;
padding-bottom: 0.4em;
padding-left: 0;
padding-right: 15px;
padding-top: 0.2em;
}
 
#homepageMenu li{
margin-top:3px;
text-align:center;
width:85%;
padding:3px;
background:#525d4f;
list-style-type:none;
color:#0c0c0c;
text-shadow: 0 1px 1px black;
 
border-top:1px solid #7b8977;
border-right:1px solid #7b8977;
border-left:1px solid #33402e;
border-bottom:1px solid #33402e;
border-radius:1px;
}
 
#homepageMenu li:hover{
background:#677363;
}
 
#homepageMenu li a{
color:#0c0c0c;
text-shadow: 0 1px 1px #7b8977;
font-weight:bold;
}
 
#homepageMenu li a:hover{
color:#222222;
text-decoration:none;
}
 
#homepageMenu ul{
margin-top:15px;
list-style-image:none;
list-style-type:none;
}
 
/* Move the menu icons 2 px up */
.menuIcon{
position:relative;bottom:2px;
}
 
/* END OF THE KAG-LIKE MENU */
 
 
/* The first title, "Main Page" on the main page IT'S UGLY NOW must change it*/
 
#firstHeading{
color:black;
text-shadow: 0 1px 1px #535d4f;
border-bottom:1px solid #1f0b0b;
}
 
/* This will change the ugly links and links images inside a KAG-like menu(i hope)*/ 
 
#content #homepageMenu a.external, #content #homepageMenu a[href^="gopher://"] {
    background: none;
}
/* This change the color of the text */
 
#content #homepageMenu a.external {
    color: #0c0c0c;
}
#content #homepageMenu a.external:hover {
    color: #222222;
}
#homepageMenu a{
padding:0 !important;
}
 
/* THIS IS A SHINY TABLE OMG LIKE A POKEMON !*/
 
.wikitableShiny{
border:1px solid #5b5b5b;
background-color: #f3f3f3;
background-origin: padding-box;
background-position: 0 0;
background-repeat: repeat;
border-collapse: collapse;
margin-bottom: 1em;
margin-left: 0;
margin-right: 1em;
margin-top: 1em;
 
}
 
/* This is the first line, also called th (I think T_T) */
 
.wikitableShiny th{
 
color:#333333;
text-shadow:0px 1px 1px #c5c5c5;
 
/* I didn't write this by hand, lol */
 
background: rgb(179,179,179); /* Old browsers */
background: -moz-linear-gradient(top, rgba(179,179,179,1) 0%, rgba(153,153,153,1) 1%, rgba(169,169,169,1) 50%, rgba(160,160,160,1) 51%, rgba(148,148,148,1) 98%, rgba(142,142,142,1) 99%, rgba(125,125,125,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(179,179,179,1)), color-stop(1%,rgba(153,153,153,1)), color-stop(50%,rgba(169,169,169,1)), color-stop(51%,rgba(160,160,160,1)), color-stop(98%,rgba(148,148,148,1)), color-stop(99%,rgba(142,142,142,1)), color-stop(100%,rgba(125,125,125,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(179,179,179,1) 0%,rgba(153,153,153,1) 1%,rgba(169,169,169,1) 50%,rgba(160,160,160,1) 51%,rgba(148,148,148,1) 98%,rgba(142,142,142,1) 99%,rgba(125,125,125,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(179,179,179,1) 0%,rgba(153,153,153,1) 1%,rgba(169,169,169,1) 50%,rgba(160,160,160,1) 51%,rgba(148,148,148,1) 98%,rgba(142,142,142,1) 99%,rgba(125,125,125,1) 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, rgba(179,179,179,1) 0%,rgba(153,153,153,1) 1%,rgba(169,169,169,1) 50%,rgba(160,160,160,1) 51%,rgba(148,148,148,1) 98%,rgba(142,142,142,1) 99%,rgba(125,125,125,1) 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3b3b3', endColorstr='#7d7d7d',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(179,179,179,1) 0%,rgba(153,153,153,1) 1%,rgba(169,169,169,1) 50%,rgba(160,160,160,1) 51%,rgba(148,148,148,1) 98%,rgba(142,142,142,1) 99%,rgba(125,125,125,1) 100%); /* W3C */
 
 
/* Add some padding so it's not so small*/
padding-top:5px;
padding-bottom:5px;
}
 
.wikitableShiny tr{
color:#333333;
}