Difference between revisions of "Wiki User Style/Liquid Design.css"

From the Oblivion ConstructionSet Wiki
Jump to navigation Jump to search
imported>DragoonWraith
(rv - that messed it up even more. I'll try again in the morning, when I've slept, cuz I apparently can't do this correctly right now)
imported>Qazaaq
m (don't forget to pull the footer up 10px after making more room)
 
(20 intermediate revisions by 3 users not shown)
Line 1: Line 1:
/* A [[Wiki User Style|User Style]] for the TESCS Wiki */
/* A [[Wiki User Style|User Style]] for the TESCS Wiki */
body /* given the paper background */
  body /* given the paper background */
  {
  {
   background-image: url("images/4/48/LiquidBackground.jpg");
   background-image: url("images/4/48/LiquidBackground.jpg") !important;
   background-repeat: repeat;
   background-repeat: repeat !important;
  }
  }
   
   
  #globalWrapper /* contains everything - used for left border */
  #globalWrapper /* contains everything - used for left border */
  {
  {
   position: absolute; /* Thanks Qazaaq! */
   position: absolute !important; /* Thanks Qazaaq! */
  top: 0;
   margin: 0 !important;
   margin: 0;
   padding: 0 !important;
   padding: 0;
   top: 0 !important;
   top: 0;
   left: 0 !important;
   left: 0;
   width: 100% !important;
   width: 100%;
   min-height: 100% !important;
   height: 0;
  height:0; /* fixes the height for the content div, but limits the height to 100% - Qazaaq */
   background-image: url("images/8/89/LiquidBorderLeft.gif");
   background-image: url("images/8/89/LiquidBorderLeft.gif") !important;
   background-repeat: repeat-y;
   background-repeat: repeat-y !important;
   z-index: 0;
   z-index: 0 !important;
  }
  }
   
   
  #p-logo /* reduced-width fixed logo */
  #p-logo /* reduced-width fixed logo */
  {
  {
   position: fixed;
   position: fixed !important;
   float: left;
   float: left !important;
   top: 0;
   top: 0 !important;
   left: 0;
   left: 0 !important;
   width: auto;
   width: auto !important;
   height: auto;
   height: auto !important;
   padding: 0;
   padding: 0 !important;
   margin: 0;
   margin: 0 !important;
   z-index: 0;
   z-index: 2 !important;
  }
  }
   
   
  #p-logo a /* alt logo image */
  #p-logo a /* alt logo image */
  {
  {
   position: relative;
   position: relative !important;
   float: left;
   float: left !important;
   top: 0;
   top: 0 !important;
   left: 0;
   left: 0 !important;
   width: 152px;
   width: 152px !important;
   height: 124px;
   height: 124px !important;
   margin: 1em 0 0 50px;
   margin: 1em 0 0 50px !important;
   padding: 0;
   padding: 0 !important;
   background-image: url("images/a/a4/CSwiki_Icon.gif") !important;
   background-image: url("images/a/a4/CSwiki_Icon.gif") !important;
   z-index: 0;
   z-index: 2 !important;
  }
  }
   
   
  #column-one /* left nav-boxes */
  #column-one /* left nav-boxes */
  {
  {
   position: fixed;
   position: fixed !important;
   top: 0;
   top: 0 !important;
   left: 0;
   left: 0 !important;
   width: auto;
   width: auto !important;
   min-height: 100%;
   min-height: 100% !important;
   margin: 0;
   margin: 0 !important;
   padding: 145px 0 0 50px;
   padding: 145px 0 0 50px !important;
  background-image: url("images/8/89/LiquidBorderLeft.gif"); /* to make sure the background continues after 100% - Qazaaq */
  /* to make sure the background continues after 100% - Qazaaq */
  background-repeat: repeat-y;
  background-image: url("images/b/bb/LiquidBorderLeftMin.gif") !important;
   z-index: 1;
  background-repeat: repeat-y !important;
   z-index: 1 !important;
  }
  }
   
   
  #column-one>*
  #column-one>*
  {
  {
   width: 150px;
   width: 150px !important;
   z-index: 1;
   z-index: 1 !important;
  }
  }
   
   
  #column-content /* right column */
  #column-content /* right column */
  {
  {
   position: relative;
   position: relative !important;
   top: 0;
   top: 0 !important;
   left: 0;
   left: 0 !important;
   min-height: 100%;
   min-height: 100% !important;
   width: auto;
   width: auto !important;
   padding-top: 1px ;
   padding-top: 1px !important;
   padding-bottom: 1px;
   padding-bottom: 1px !important;
  margin-top: -2px; /* compensate padding somewhere - Qazaaq */
  margin-bottom: -60px !important; /* pull footer up into the room created above - Qazaaq */
  margin-bottom: -50px; /* pull footer up into the room created above - Qazaaq */
  margin-top: -2px !important; /* compensate padding somewhere - Qazaaq */
   background-image: url("images/7/71/LiquidBorderRight.gif");
   background-image: url("images/7/71/LiquidBorderRight.gif") !important;
   background-repeat: repeat-y;
   background-repeat: repeat-y !important;
   background-position: top right;
   background-position: top right !important;
   z-index: 2;
   z-index: 2 !important;
}
#content
{
  margin-bottom: 50px; /* create room for the footer */
  }
  }
   
   
  #content, #content2 /* above the box (with tabs) and the box itself */
  #content, #content2 /* above the box (with tabs) and the box itself */
  {
  {
   position: relative;
   position: relative !important;
   padding-top: 0;
   padding-top: 0 !important;
   padding-left: 1em;
   padding-left: 1em !important;
   margin-right: 50px;
   margin-right: 50px !important;
   padding-right: 1em;
   padding-right: 1em !important;
   width: auto;
   width: auto !important;
   z-index: 1;
   z-index: 1 !important;
  }
  }
 
  #content
  {
  margin-bottom: 60px !important; /* create room for the footer - Qazaaq */
  }
   
   
  #footer /* disclaimer, ESRB privacy icon, Zenimax icon, etc */
  #footer /* disclaimer, ESRB privacy icon, Zenimax icon, etc */
  {
  {
   position: relative;
   position: relative !important;
   bottom: 0;
   bottom: 0 !important;
   left: 0;
   left: 0 !important;
   margin: 0;
   margin: 0 !important;
  padding: 5px 50px 0 215px;
  padding: 5px 50px 0 215px !important;
  height: 45px;
  height: 55px !important;
   width: auto;
   width: auto !important;
   background-image: url("images/7/71/LiquidBorderRight.gif");
   background-image: url("images/7/71/LiquidBorderRight.gif") !important;
   background-repeat: repeat-y;
   background-repeat: repeat-y !important;
   background-position: top right;
   background-position: top right !important;
  z-index: 2; /* get the footer above the content div to make sure the links work - Qazaaq */
  z-index: 2 !important; /* get the footer above the content div to make sure the links work - Qazaaq */
  }
  }
   
   
  #footer div
  #footer div
  {
  {
   position: relative;
   position: relative !important;
   margin: 0 1em 0 1em;
   margin: 0 1em 0 1em !important;
  z-index: 1;
  }
  }
   
   
  ul#f-list
  ul#f-list
  {
  {
   vertical-align: middle;
   vertical-align: middle !important;
   margin: 0 75px 0 150px;
   margin: 0 75px 0 150px !important;
   z-index: 1;
   z-index: 1 !important;
  }
  }
   
   
Line 133: Line 133:
  #p-cactions
  #p-cactions
  {
  {
   margin: 0;
   margin: 0 !important;
   padding: 0 0 2px 0;
   padding: 0 0 2px 0 !important;
  }
  }
   
   
  #p-cactions .selected a
  #p-cactions .selected a
  {
  {
   color: #6e5229;
   color: #6e5229 !important;
   background-image: url("skins/esstyle/textbg.jpg");
   background-image: url("skins/esstyle/textbg.jpg") !important;
   border: 1px #6e5229 solid;
   border: 1px #6e5229 solid !important;
  }
  }
   
   
Line 147: Line 147:
  pre
  pre
  {
  {
   overflow: visible;
   overflow: visible !important;
   overflow-x: auto;
   overflow-x: auto !important;
}
/* Function Table */
table.functionTable {
  background: #FDF5E6;
  border-color: #808080;
  border-collapse: collapse;
}
table.functionTable th {
  background: #F5DEB3;
  border-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-color: #808080;
}
table.functionTable td {
  border-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #808080;
  }
  }

Latest revision as of 14:12, 23 August 2008

/* A User Style for the TESCS Wiki */

 body /* given the paper background */
{
  background-image: url("images/4/48/LiquidBackground.jpg") !important;
  background-repeat: repeat !important;
}

#globalWrapper /* contains everything - used for left border */
{
 position: absolute !important; /* Thanks Qazaaq! */
 margin: 0 !important;
 padding: 0 !important;
 top: 0 !important;
 left: 0 !important;
 width: 100% !important;
 min-height: 100% !important;
  height:0; /* fixes the height for the content div, but limits the height to 100% - Qazaaq */
 background-image: url("images/8/89/LiquidBorderLeft.gif") !important;
 background-repeat: repeat-y !important;
 z-index: 0 !important;
}

#p-logo /* reduced-width fixed logo */
{
 position: fixed !important;
 float: left !important;
 top: 0 !important;
 left: 0 !important;
 width: auto !important;
 height: auto !important;
 padding: 0 !important;
 margin: 0 !important;
 z-index: 2 !important;
}

#p-logo a /* alt logo image */
{
 position: relative !important;
 float: left !important;
 top: 0 !important;
 left: 0 !important;
 width: 152px !important;
 height: 124px !important;
 margin: 1em 0 0 50px !important;
 padding: 0 !important;
 background-image: url("images/a/a4/CSwiki_Icon.gif") !important;
 z-index: 2 !important;
}

#column-one /* left nav-boxes */
{
 position: fixed !important;
 top: 0 !important;
 left: 0 !important;
 width: auto !important;
 min-height: 100% !important;
 margin: 0 !important;
 padding: 145px 0 0 50px !important;
  /* to make sure the background continues after 100% - Qazaaq */
  background-image: url("images/b/bb/LiquidBorderLeftMin.gif") !important;
  background-repeat: repeat-y !important;
 z-index: 1 !important;
}

#column-one>*
{
 width: 150px !important;
 z-index: 1 !important;
}

#column-content /* right column */
{
 position: relative !important;
 top: 0 !important;
 left: 0 !important;
 min-height: 100% !important;
 width: auto !important;
 padding-top: 1px !important;
 padding-bottom: 1px !important;
  margin-bottom: -60px !important; /* pull footer up into the room created above - Qazaaq */
  margin-top: -2px !important; /* compensate padding somewhere - Qazaaq */
 background-image: url("images/7/71/LiquidBorderRight.gif") !important;
 background-repeat: repeat-y !important;
 background-position: top right !important;
 z-index: 2 !important;
}

#content, #content2 /* above the box (with tabs) and the box itself */
{
 position: relative !important;
 padding-top: 0 !important;
 padding-left: 1em !important;
 margin-right: 50px !important;
 padding-right: 1em !important;
 width: auto !important;
 z-index: 1 !important;
}
 
 #content
 {
  margin-bottom: 60px !important; /* create room for the footer - Qazaaq */
 }

#footer /* disclaimer, ESRB privacy icon, Zenimax icon, etc */
{
 position: relative !important;
 bottom: 0 !important;
 left: 0 !important;
 margin: 0 !important;
  padding: 5px 50px 0 215px !important;
  height: 55px !important;
 width: auto !important;
 background-image: url("images/7/71/LiquidBorderRight.gif") !important;
 background-repeat: repeat-y !important;
 background-position: top right !important;
  z-index: 2 !important; /* get the footer above the content div to make sure the links work - Qazaaq */
}

#footer div
{
 position: relative !important;
 margin: 0 1em 0 1em !important;
}

ul#f-list
{
 vertical-align: middle !important;
 margin: 0 75px 0 150px !important;
 z-index: 1 !important;
}

/* tab highlight */
#p-cactions
{
 margin: 0 !important;
 padding: 0 0 2px 0 !important;
}

#p-cactions .selected a
{
 color: #6e5229 !important;
 background-image: url("skins/esstyle/textbg.jpg") !important;
 border: 1px #6e5229 solid !important;
}

/* attempt to fix codebox stretching */
pre
{
 overflow: visible !important;
 overflow-x: auto !important;
}

/* Function Table */
table.functionTable { 
  background: #FDF5E6;
  border-color: #808080;
  border-collapse: collapse;
}

table.functionTable th {
  background: #F5DEB3;
  border-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-color: #808080;
}

table.functionTable td {
  border-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #808080;
}