Difference between revisions of "User:Gyz/vector.css"

From Baka-Tsuki
Jump to navigation Jump to search
 
(64 intermediate revisions by the same user not shown)
Line 1: Line 1:
  +
/*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
 
div#mw-panel
 
{
 
{
 
visibility:visible;
 
visibility:visible;
 
position:fixed;
 
position:fixed;
  +
top:0px;
resize:vertical;
 
top:240px;
 
 
left:-9.5em;
 
left:-9.5em;
  +
padding-top:0;
background-color:#E8E8E8;
 
  +
background-color:#F3F3F3;
overflow-y:auto;
 
  +
border-right:1px solid #A7D7F9;
  +
opacity:0.9;
  +
filter:alpha(opacity=90);
  +
overflow-y:scroll;
 
overflow-x:hidden;
 
overflow-x:hidden;
 
z-index:2;
 
z-index:2;
  +
height:100%;
height:22em; /*this number sets the height of your navigation bar. The higher the number, the higher the navigation bar. Make sure you have "em" to the right of the number. The the original value I set it was 22em.*/
 
  +
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
+
div#mw-panel div.portal
 
{
 
{
 
overflow:visible;
 
overflow:visible;
  +
}
resize:none;
 
  +
div#mw-panel div#p-navigation
  +
{
  +
padding-top:0em;
  +
margin-top:160px;
 
}
 
}
 
div#mw-panel:hover
 
div#mw-panel:hover
Line 25: Line 44:
 
position:fixed;
 
position:fixed;
 
left:-9.5em;
 
left:-9.5em;
top:80px;
+
width:9em;
  +
top:0px;
background-color:#E8E8E8;
 
  +
overflow:hidden;
  +
background-color:#F3F3F3;
 
z-index:1
 
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 34: Line 67:
 
}
 
}
 
div#mw-head-base
 
div#mw-head-base
  +
{
  +
margin-left:10px;
  +
}
  +
div#mw-head
 
{
 
{
 
margin-left:10px;
 
margin-left:10px;
Line 40: Line 77:
 
{
 
{
 
position:relative;
 
position:relative;
left:10px;
+
left:0;
margin-left:0;
+
margin-left:10px;
 
}
 
}
 
div#left-navigation
 
div#left-navigation
 
{
 
{
left:50px;
+
left:10em;
 
}
 
}
 
div#footer
 
div#footer
Line 51: Line 88:
 
margin-left:10px;
 
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*/

Latest revision as of 09: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*/