Difference between revisions of "Wiki User Style"

626 bytes added ,  18:51, 17 February 2008
update
imported>DragoonWraith
(added fixed position nav-boxes)
imported>DragoonWraith
(update)
Line 1: Line 1:
[[Image:CSwiki_User_Style_Example.jpg|thumb|right|Example of Alternate Icon]]
[[Image:CSwiki_User_Style_Example.jpg|thumb|right|Example of Alternate Icon]]
Using this code as a User Style Sheet within your web browser will remove the full-width banner image from the Wiki, giving far more screen-space to the actual content of the site.
This code is designed to be a "User Style Sheet" for the CS Wiki. This means that these style changes are affixed by the browser, overriding the code used on the site. How to set this up depends on your browser.


Also causes the left-hand navigation boxes to scroll with the page, so you don't have to scroll back to the top to access the links there or the search box.
Current features:
*Reduced-width banner, allowing the main content of the page to have the entire height of the screen
*Fixed-position left-hand nav-boxes. This way the boxes will scroll with you as you read the page.
**''This code is specifically coded for a screen-width of 1268.'' If you use another width, or do not have the window maximized, this will cause problems. Please do not use the noted portions of the code if you have a different resolution. A fix for this is being worked on.
*Highlights for the current Tab you are using (i.e. Article/Discussion/Edit/History).


<pre>@namespace url(http://www.w3.org/1999/xhtml);
<pre>@namespace url(http://www.w3.org/1999/xhtml);
Line 8: Line 12:
@-moz-document url-prefix(http://cs.elderscrolls.com/constwiki/)
@-moz-document url-prefix(http://cs.elderscrolls.com/constwiki/)
{
{
  #content2 { position: relative; }
   div#p-logo
   div#p-logo
   {
   {
    position: fixed !important;
     float: left !important;
     float: left !important;
     top: 10px !important;
     top: 10px !important;
Line 23: Line 28:
   }
   }


   div#p-navigation
   .portlet
  {
    top: 140px !important;
    position: fixed !important;
  }
 
  div#p-tb
   {
   {
     top: 250px !important;
     margin: 5px 0px 1px 0px !important;
    position: fixed !important;
   }
   }


   div#p-search
   #p-cactions .selected a
   {
   {
     top: 360px !important;
     color: #6e5229 !important;
     position: fixed !important;
     background-image: url("http://cs.elderscrolls.com/constwiki/skins/esstyle/textbg.jpg") !important;
    border: 1px #6e5229 solid !important;
   }
   }


   div#p-personal
/* DO NOT USE THIS CODE UNLESS YOU HAVE A SCREEN WIDTH OF 1268 AND KEEP THE WINDOW MAXIMIZED */
   div#p-logo { position: fixed !important; }
  #column-one
   {
   {
    top: 430px !important;
     position: fixed !important;
     position: fixed !important;
    margin-left: 131px !important;
   }
   }
}</pre>
}</pre>