User:Gyz/vector.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| (46 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/*You must | /*eye candy*/ | ||
/*You must retain the following four lines of code for any kind of customization I do!*/ | |||
body | body | ||
{ | { | ||
| Line 11: | Line 12: | ||
top:0px; | top:0px; | ||
left:-9.5em; | left:-9.5em; | ||
padding-top:0; | |||
background-color:#F3F3F3; | background-color:#F3F3F3; | ||
border-right:1px solid #A7D7F9; | border-right:1px solid #A7D7F9; | ||
opacity:0.9; | opacity:0.9; | ||
filter:alpha(opacity=90); | filter:alpha(opacity=90); | ||
overflow-y: | overflow-y:scroll; | ||
overflow-x:hidden; | overflow-x:hidden; | ||
z-index:2; | z-index:2; | ||
height:100%; | height:100%; | ||
box-shadow:0 0 10px 0 #000000; | |||
transition:left 0.2s ease-out; | |||
-webkit-transition:left 0.2s ease-out; | |||
-moz-transition:left 0.2s ease-out; | |||
-o-transition:left 0.2s ease-out; | |||
} | } | ||
div#mw-panel div.portal | div#mw-panel div.portal | ||
| Line 27: | Line 33: | ||
div#mw-panel div#p-navigation | div#mw-panel div#p-navigation | ||
{ | { | ||
padding-top:0em; | |||
margin-top:160px; | margin-top:160px; | ||
} | } | ||
| Line 41: | Line 48: | ||
overflow:hidden; | overflow:hidden; | ||
background-color:#F3F3F3; | background-color:#F3F3F3; | ||
z-index:1 | |||
opacity:0.9 | |||
filter:alpha(opacity=90); | |||
box-shadow:-2.5px 0 5px 0 #000000; | |||
transition:left 0.2s ease-out; | |||
-webkit-transition:left 0.2s ease-out; | |||
-moz-transition:left 0.2s ease-out; | |||
-o-transition:left 0.2s ease-out; | |||
} | |||
div#p-logo a | |||
{ | |||
position:absolute; | |||
width:140px; | |||
} | } | ||
div#mw-panel:hover div#p-logo | div#mw-panel:hover div#p-logo | ||
| Line 49: | Line 67: | ||
} | } | ||
div#mw-head-base | div#mw-head-base | ||
{ | |||
margin-left:10px; | |||
} | |||
div#mw-head | |||
{ | { | ||
margin-left:10px; | margin-left:10px; | ||
| Line 66: | Line 88: | ||
margin-left:10px; | margin-left:10px; | ||
} | } | ||
/*section end*/ | |||
/*Page navigation*/ | /*Page navigation adjustment*/ | ||
table[style] tbody | div>table[style]:nth-last-child(4)>tbody,div>table[style]:nth-last-child(5)>tbody | ||
{ | { | ||
position:fixed; | position:fixed; | ||
margin:0; | margin:0 0 0 10em; | ||
padding:0 | padding:0; | ||
bottom:-15px; | bottom:-15px; | ||
left:2em; | |||
background-color:#CEE0F2; | |||
height: | height:40px; | ||
vertical-align:bottom; | vertical-align:bottom; | ||
overflow-y:hidden; | overflow-y:hidden; | ||
opacity:0. | opacity:0.3; | ||
filter:alpha(opacity= | filter:alpha(opacity=30); | ||
box-shadow:0 0 10px 0 #AAAAAA; | |||
z-index:4; | |||
} | } | ||
table[style] tbody:hover | div>table[style]:nth-last-child(4)>tbody:hover,div>table[style]:nth-last-child(5)>tbody:hover | ||
{ | { | ||
bottom:0; | |||
height:auto; | |||
background-color:transparent; | background-color:transparent; | ||
opacity:0.9; | opacity:0.9; | ||
filter:alpha(opacity=90); | filter:alpha(opacity=90); | ||
transition:opacity 0.1s linear; | |||
-webkit-transition:opacity 0.1s linear; | |||
-moz-transition:opacity 0.1s linear; | |||
-o-transition:opacity 0.1s linear; | |||
} | } | ||
table[style] td | div>table[style]:nth-last-child(4) td, div>table[style]:nth-last-child(4) th,div>table[style]:nth-last-child(5) td, div>table[style]:nth-last-child(5) th | ||
{ | { | ||
height:40px; | |||
} | } | ||
table[style] tbody:hover td | div>table[style]:nth-last-child(4)>tbody:hover td,div>table[style]:nth-last-child(4)>tbody:hover th,div>table[style]:nth-last-child(5)>tbody:hover td,div>table[style]:nth-last-child(5)>tbody:hover th | ||
{ | { | ||
height:auto; | |||
vertical-align:middle; | |||
background-color:#F8F8F8; | background-color:#F8F8F8; | ||
} | } | ||
/*section end*/ | |||
/*References adjustment*/ | |||
ol.references | |||
{ | |||
background-color:#000000; | |||
border:1px solid #000000; | |||
margin:0; | |||
padding:0 0.25em 0 2.25em; | |||
position:fixed; | |||
bottom:0; | |||
right:0; | |||
width:40em; | |||
height:25px; | |||
max-height:100%; | |||
min-height:25px; | |||
overflow-y:auto; | |||
opacity:0.07; | |||
filter:alpha(opacity=7); | |||
z-index:3; | |||
box-shadow:0 0 10px 0 #AAAAAA; | |||
} | |||
ol.references:hover | |||
{ | |||
background-color:#FFFFFF; | |||
width:40em; | |||
height:auto; | |||
opacity:1; | |||
filter:alpha(opacity=100); | |||
transition:opacity 0.1s linear; | |||
-webkit-transition:opacity 0.1s linear; | |||
-moz-transition:opacity 0.1s linear; | |||
-o-transition:opacity 0.1s linear; | |||
} | |||
/*section end*/ | |||
/*Top bar adjustment*/ | |||
div#mw-page-base | |||
{ | |||
height:3.5em; | |||
} | |||
div#mw-head | |||
{ | |||
position:fixed; | |||
background-color:white; | |||
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAIAAAArRUU2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADpJREFUeF5VjUkOAEAIwoD//7lzGJd4MJHGSoBImkFETP67CdLldUd7KC6f8fv3+psd8znbtU5x354HaWQjOx76v7MAAAAASUVORK5CYII=); | |||
background-position:bottom left; | |||
background-repeat:repeat-x; | |||
border-bottom:1px solid #A7D7F9; | |||
height:3.5em; | |||
top:-1px; | |||
left:0; | |||
opacity:0.25; | |||
filter:alpha(opacity=25); | |||
box-shadow:-5px -5px 10px -5px #AAAAAA inset; | |||
transition:opacity 0.15s ease-out; | |||
-webkit-transition:opacity 0.15s ease-out; | |||
-moz-transition:opacity 0.15s ease-out; | |||
-o-transition:opacity 0.15s ease-out; | |||
} | |||
div#mw-head:hover | |||
{ | |||
opacity:1; | |||
filter:alpha(opacity=100); | |||
transition:opacity 0.1s cubic-bezier(0.5,0,1,0); | |||
-webkit-transition:opacity 0.1s cubic-bezier(0.5,0,1,0); | |||
-moz-transition:opacity 0.1s cubic-bezier(0.5,0,1,0); | |||
-o-transition:opacity 0.1s cubic-bezier(0.5,0,1,0); | |||
} | |||
div#left-navigation | |||
{ | |||
position:fixed; | |||
top:1em; | |||
z-index:1; | |||
} | |||
div#right-navigation | |||
{ | |||
position:fixed; | |||
right:0; | |||
top:1em; | |||
margin-top:0; | |||
z-index:1; | |||
} | |||
div#p-personal | |||
{ | |||
position:fixed; | |||
right:0.75em; | |||
z-index:2; | |||
} | |||
/*section end*/ | |||
Latest revision as of 07:10, 3 April 2012
/*eye candy*/
/*You must retain the following four lines of code for any kind of customization I do!*/
body
{
height:100%;
}
/*Hides navbar*/
div#mw-panel
{
visibility:visible;
position:fixed;
top:0px;
left:-9.5em;
padding-top:0;
background-color:#F3F3F3;
border-right:1px solid #A7D7F9;
opacity:0.9;
filter:alpha(opacity=90);
overflow-y:scroll;
overflow-x:hidden;
z-index:2;
height:100%;
box-shadow:0 0 10px 0 #000000;
transition:left 0.2s ease-out;
-webkit-transition:left 0.2s ease-out;
-moz-transition:left 0.2s ease-out;
-o-transition:left 0.2s ease-out;
}
div#mw-panel div.portal
{
overflow:visible;
}
div#mw-panel div#p-navigation
{
padding-top:0em;
margin-top:160px;
}
div#mw-panel:hover
{
left:0;
}
div#p-logo
{
position:fixed;
left:-9.5em;
width:9em;
top:0px;
overflow:hidden;
background-color:#F3F3F3;
z-index:1
opacity:0.9
filter:alpha(opacity=90);
box-shadow:-2.5px 0 5px 0 #000000;
transition:left 0.2s ease-out;
-webkit-transition:left 0.2s ease-out;
-moz-transition:left 0.2s ease-out;
-o-transition:left 0.2s ease-out;
}
div#p-logo a
{
position:absolute;
width:140px;
}
div#mw-panel:hover div#p-logo
{
left:0em
}
div#mw-head-base
{
margin-left:10px;
}
div#mw-head
{
margin-left:10px;
}
div#content
{
position:relative;
left:0;
margin-left:10px;
}
div#left-navigation
{
left:10em;
}
div#footer
{
margin-left:10px;
}
/*section end*/
/*Page navigation adjustment*/
div>table[style]:nth-last-child(4)>tbody,div>table[style]:nth-last-child(5)>tbody
{
position:fixed;
margin:0 0 0 10em;
padding:0;
bottom:-15px;
left:2em;
background-color:#CEE0F2;
height:40px;
vertical-align:bottom;
overflow-y:hidden;
opacity:0.3;
filter:alpha(opacity=30);
box-shadow:0 0 10px 0 #AAAAAA;
z-index:4;
}
div>table[style]:nth-last-child(4)>tbody:hover,div>table[style]:nth-last-child(5)>tbody:hover
{
bottom:0;
height:auto;
background-color:transparent;
opacity:0.9;
filter:alpha(opacity=90);
transition:opacity 0.1s linear;
-webkit-transition:opacity 0.1s linear;
-moz-transition:opacity 0.1s linear;
-o-transition:opacity 0.1s linear;
}
div>table[style]:nth-last-child(4) td, div>table[style]:nth-last-child(4) th,div>table[style]:nth-last-child(5) td, div>table[style]:nth-last-child(5) th
{
height:40px;
}
div>table[style]:nth-last-child(4)>tbody:hover td,div>table[style]:nth-last-child(4)>tbody:hover th,div>table[style]:nth-last-child(5)>tbody:hover td,div>table[style]:nth-last-child(5)>tbody:hover th
{
height:auto;
vertical-align:middle;
background-color:#F8F8F8;
}
/*section end*/
/*References adjustment*/
ol.references
{
background-color:#000000;
border:1px solid #000000;
margin:0;
padding:0 0.25em 0 2.25em;
position:fixed;
bottom:0;
right:0;
width:40em;
height:25px;
max-height:100%;
min-height:25px;
overflow-y:auto;
opacity:0.07;
filter:alpha(opacity=7);
z-index:3;
box-shadow:0 0 10px 0 #AAAAAA;
}
ol.references:hover
{
background-color:#FFFFFF;
width:40em;
height:auto;
opacity:1;
filter:alpha(opacity=100);
transition:opacity 0.1s linear;
-webkit-transition:opacity 0.1s linear;
-moz-transition:opacity 0.1s linear;
-o-transition:opacity 0.1s linear;
}
/*section end*/
/*Top bar adjustment*/
div#mw-page-base
{
height:3.5em;
}
div#mw-head
{
position:fixed;
background-color:white;
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAIAAAArRUU2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADpJREFUeF5VjUkOAEAIwoD//7lzGJd4MJHGSoBImkFETP67CdLldUd7KC6f8fv3+psd8znbtU5x354HaWQjOx76v7MAAAAASUVORK5CYII=);
background-position:bottom left;
background-repeat:repeat-x;
border-bottom:1px solid #A7D7F9;
height:3.5em;
top:-1px;
left:0;
opacity:0.25;
filter:alpha(opacity=25);
box-shadow:-5px -5px 10px -5px #AAAAAA inset;
transition:opacity 0.15s ease-out;
-webkit-transition:opacity 0.15s ease-out;
-moz-transition:opacity 0.15s ease-out;
-o-transition:opacity 0.15s ease-out;
}
div#mw-head:hover
{
opacity:1;
filter:alpha(opacity=100);
transition:opacity 0.1s cubic-bezier(0.5,0,1,0);
-webkit-transition:opacity 0.1s cubic-bezier(0.5,0,1,0);
-moz-transition:opacity 0.1s cubic-bezier(0.5,0,1,0);
-o-transition:opacity 0.1s cubic-bezier(0.5,0,1,0);
}
div#left-navigation
{
position:fixed;
top:1em;
z-index:1;
}
div#right-navigation
{
position:fixed;
right:0;
top:1em;
margin-top:0;
z-index:1;
}
div#p-personal
{
position:fixed;
right:0.75em;
z-index:2;
}
/*section end*/