Difference between revisions of "MediaWiki:Common.css"

From Wiki Confrontation
Jump to: navigation, search
Line 206: Line 206:
 
div#content a.external, div#content a.external[href ^="gopher://"] {
 
div#content a.external, div#content a.external[href ^="gopher://"] {
 
background:none;
 
background:none;
}
 
 
 
 
 
#slider {
 
    width: 640px;
 
    height: 320px;
 
    margin: 50px auto 0;
 
    position: relative;
 
    background: #fff;
 
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
 
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
 
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
 
}
 
 
#slider:before, #slider:after {
 
    content: '';
 
    position: absolute;
 
    width: 60%;
 
    height: 20px;
 
    -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
 
    -moz-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
 
    -ms-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
 
    -o-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
 
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
 
    -webkit-transform: rotate(-4deg) skew(-10deg);
 
    -moz-transform: rotate(-4deg) skew(-10deg);
 
    -o-transform: rotate(-4deg) skew(-10deg);
 
    -ms-transform: rotate(-4deg) skew(-10deg);
 
    transform: rotate(-4deg) skew(-10deg);
 
    left: 10px;
 
    bottom: 13px;
 
    z-index: -1;
 
}
 
 
#slider:after {
 
    left: auto;
 
    right: 10px;
 
    -webkit-transform: rotate(4deg) skew(10deg);
 
    -moz-transform: rotate(4deg) skew(10deg);
 
    -o-transform: rotate(4deg) skew(10deg);
 
    -ms-transform: rotate(4deg) skew(10deg);
 
    transform: rotate(4deg) skew(10deg);
 
}
 
 
#slider ul {
 
    width: 140px;
 
    height: 40px;
 
    padding: 0 0 0 0;
 
    position: absolute;
 
    z-index: 10;
 
    list-style: none;
 
    left: 50%;
 
    margin-left: -70px;
 
    bottom: -60px;
 
}
 
 
#slider ul li:first-child {
 
    margin-left: 16px;
 
}
 
 
#slider ul li {
 
    float: left;
 
    margin-right: 12px;
 
    margin-top: 14px;
 
}
 
 
#slider ul li:last-child {
 
    margin-right: 0;
 
}
 
 
#slider ul li a {
 
    width: 12px;
 
    height: 12px;
 
    display: block;
 
    outline: none;
 
    border: none;
 
    position: relative;
 
    z-index: 2;
 
    background: #aaa;
 
    box-shadow: inset 0 1px 1px 0px rgba(0, 0, 0, 0.6), 0px 1px 1px 0px white;
 
    -moz-box-shadow: inset 0 1px 1px 0px rgba(0, 0, 0, 0.6), 0px 1px 1px 0px white;
 
    -webkit-box-shadow: inset 0 1px 1px 0px rgba(0, 0, 0, 0.6), 0px 1px 1px 0px white;
 
    -webkit-border-radius: 50%;
 
    -moz-border-radius: 50%;
 
    border-radius: 50%;
 
}
 
 
#slider ul li a:hover {
 
    background: #888;
 
}
 
 
#slider img {
 
    position: absolute;
 
    left: 0;
 
    top: 0;
 
    opacity: 0;
 
    -webkit-transform: rotateZ(-10deg);
 
    -moz-transform: rotateZ(-10deg);
 
    -ms-transform: rotateZ(-10deg);
 
    -o-transform: rotateZ(-10deg);
 
    transform: rotateZ(-10deg);
 
    -webkit-transition: all .5s ease;
 
    -moz-transition: all .5s ease;
 
    -ms-transition: all .5s ease;
 
    -o-transition: all .5s ease;
 
    transition: all .5s ease;
 
}
 
 
#slider img:target {
 
    opacity: 1;
 
    -webkit-transform: rotateZ(0);
 
    -moz-transform: rotateZ(0);
 
    -ms-transform: rotateZ(0);
 
    -o-transform: rotateZ(0);
 
    transform: rotateZ(0);
 
}
 
 
#slider img#five {
 
    opacity: 1;
 
    -webkit-transform: rotateZ(0);
 
    -moz-transform: rotateZ(0);
 
    -ms-transform: rotateZ(0);
 
    -o-transform: rotateZ(0);
 
    transform: rotateZ(0);}
 
 
#slider img:not(:target), #slider img:target ~ img#five  {
 
  opacity: 0;
 
    -webkit-transform: rotateZ(-10deg);
 
    -moz-transform: rotateZ(-10deg);
 
    -ms-transform: rotateZ(-10deg);
 
    -o-transform: rotateZ(-10deg);
 
    transform: rotateZ(-10deg);
 
}
 
 
#slider ul li a[href="#five"] {
 
background: #777;
 
}
 
 
#one:target ~ ul li a[href="#one"],
 
#two:target ~ ul li a[href="#two"],
 
#three:target ~ ul li a[href="#three"],
 
#four:target ~ ul li a[href="#four"],
 
#five:target ~ ul li a[href="#five"] {
 
  background: #777;
 
}
 
 
#two:target ~ ul li a[href="#five"],
 
#three:target ~ ul li a[href="#five"],
 
#four:target ~ ul li a[href="#five"],
 
#one:target ~ ul li a[href="#five"] {
 
background: #aaa;
 
 
}
 
}

Revision as of 09:17, 19 June 2013

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

body{background-color: rgb(0, 0, 0);background-image:none;position: relative;
min-width: 1280px;}

#mw-page-base {
height:165px;
background-color: white;
background-image: url(http://i.imgur.com/uEuHKpt.jpg);
background-position: -125px 0px;
background-repeat: repeat-x;
}

#p-logo a {

width: 14em;
}

#p-personal{

background-image: url(http://i.imgur.com/Uqk8VnI.png);
background-position: bottom right;
background-repeat: no-repeat;
background-size:145px;
height: 109px;
}


#image {
margin: auto;
width: 1100px;}

#p-search{

height: 40px;
}

#banner{
color: rgb(255,255,255);
font-size: 125%;
text-align: center;
border-style: none;
margin: auto;
padding-top: 23px;
width: 448px;
text-shadow: 2px 2px 2px rgb(44,40,40);
background-image: url(http://i.imgur.com/SA6OmH1.png);
background-repeat: no-repeat;
background-position: 6px -16px;
text-indent: -9999px;

}

div#content,.mw-body
{
background-color: rgb(236, 236, 236);
background-position: top center;
background-repeat: no-repeat;

}






div#footer {

background-color: rgb(255, 255, 255);
background-image:none;
border-top: 1px solid rgb(182, 174, 174);

}

#left-navigation {
top: 7.8em;
}

#right-navigation {
margin-top: 7.8em;
}

#right-navigation {

background-color: white;
}

div#mw-panel div.portal {

margin-left: -11px;
}

div#mw-panel div.portal h5 {

color: rgb(255, 255, 255);

}

#test{

background-image: url(http://i.imgur.com/iNfZjjy.jpg);
background-position: -19px -708px;
border: solid 3px rgb(160,122,26);
box-shadow: 2px 2px 2px rgb(99,94,94);
height: 47px;
}


div#mw-panel div.portal div.body ul li a:visited {
color: rgb(165, 165, 165);
}

div#mw-panel div.portal div.body ul li a {
color: rgb(139, 161, 197);
}




#boule{
margin: auto;
width: 600px;
}

#boulebis{
margin: auto;
width: 650px;
}

#bouleter{
margin: auto;
width: 1192px;


}

#boulequa{
margin: auto;
width: 1012px;

}

#boulequabis{

margin: auto;
width: 674px;
}

#p-personal ul {
list-style: none;
margin: 0;
padding-left: 0em;
width: 104%;
padding-bottom: 4px;
height: 20px;
border-radius: 16px;
background-color: rgba(224,224,224,0.6);
font-weight: bold;
box-shadow: 0px 0px 2px rgba(27, 27, 27,0.6)
}


a.new, #p-personal a.new {
color: rgb(92, 48, 1);
}

#right-navigation {
background-color: rgba(255, 255, 255,0.4);
}

div.vectorTabs ul li {
background-color: rgba(255, 255, 255,0.1);
background-image:none;

}



div.vectorTabs li a {

color: rgb(255, 255, 255);
font-weight: bold;
}


div.vectorTabs li.selected {
background-color: rgb(236, 236, 236);
background-image: none;
}

div.vectorTabs li.new a, div.vectorTabs li.new a:visited {
color: rgb(236, 184, 154);
}

#firstHeading {
color: rgb(92,48,1);
font-weight: 500;
}

div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited {
color: rgb(92,48,1);
text-decoration: none;
}


div#content a.external, div#content a.external[href ^="gopher://"] {
background:none;
}
Personal tools
Namespaces

Variants
Actions
Navigation
Index
Toolbox
Other Language