Team:Calgary/static/basicpagedesktop.css

From 2012.igem.org

(Difference between revisions)
(Created page with "/*** Minimal header: removes the search bar and header image and readjusts font colours in the menus. Thanks a lot to the 2011 Brown-Stanford and 2012 Lethbridge iGEM teams for ...")
Line 23: Line 23:
}
}
.left-menu a {
.left-menu a {
-
     color: #fff;
+
     color: #000;
}
}
Line 68: Line 68:
.left-menu li, .right-menu li a {
.left-menu li, .right-menu li a {
-
color: #FFF !important;
+
color: #000 !important;
}
}
Line 74: Line 74:
.left-menu ul li, .right-menu ul li a{
.left-menu ul li, .right-menu ul li a{
background: none;
background: none;
-
color: white;
+
color: #000;
}
}
.right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active {
.right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active {
-
     color: white !important;
+
     color: 000 !important;
 +
}
 +
 
 +
#catlinks{
 +
display:none;
 +
}
 +
 
 +
/*important for background colours*/
 +
.mediawiki{
 +
background: #eeeeee;
}
}
/***End minimal header***/
/***End minimal header***/
 +
 +
/*Base styles*/
 +
#content{
 +
border: none;
 +
margin-top: 10px;
 +
}
 +
h1, h2, #css-full, #css-mobi{
 +
font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif;
 +
border: 0;
 +
font-weight: 400;
 +
}
 +
p{
 +
font-family: Georgia, Serif;
 +
font-size: 1em;
 +
font-weight: normal;
 +
color: black;
 +
margin-bottom: 10px;
 +
}
 +
 +
#css-full, #css-mobi{
 +
position: absolute;
 +
float: right;
 +
color: black;
 +
font-size: 1.3em;
 +
top: 0px;
 +
right: 15px;
 +
display: block;
 +
padding: 10px;
 +
}
 +
 +
/***Nav styling***/
 +
#nav{
 +
list-style: none;
 +
width: 180px;
 +
margin: 0px 10px 0px 10px;
 +
padding: 20px 0px 20px 10px;
 +
text-indent: 0;
 +
float: left;
 +
 +
/*Background colours*/
 +
background: #202020; /*backup colour in case gradients fail*/
 +
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#202020', endColorstr='#333333'); /* for IE 6+7*/
 +
-ms-filter:
 +
"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#202020', endColorstr='#333333')"; /* for IE 8*/
 +
background: -webkit-gradient(linear, left top, right top, from(#202020), to(#333333)); /* for webkit browsers */
 +
background: -moz-linear-gradient(left,  #202020,  #333); /* for firefox 3.6+ */
 +
background: linear-gradient(left, #202020 0%, #333333 100%); /*standard*/
 +
}
 +
/*To be moved to JQ block*/
 +
#menu-icon{
 +
display: none;
 +
}
 +
#nav li{
 +
height: auto;
 +
padding: 0;
 +
}
 +
/*submenu styling*/
 +
#nav li a{
 +
display: block;
 +
font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif;
 +
color: white;
 +
font-size: 1.5em;
 +
line-height: 1.2em; /*line spacing between submenu rows*/
 +
text-indent: 0.8em;
 +
letter-spacing: 0.08em;
 +
}
 +
#nav li a.dropheader{
 +
text-indent: 0;
 +
margin-top: 1.3em;
 +
}
 +
/*primary menu styling*/
 +
#nav li > a{
 +
display: block;
 +
font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif;
 +
font-size: 1.8em;
 +
color: white;
 +
line-height: 40px; /*centers the text vertically*/
 +
}
 +
/*arrows to signify dropout menus; to be moved to JQ block*/
 +
#nav li a.drop:after{
 +
content: '>';
 +
padding-right: 20px;
 +
color: #BBB;
 +
display: inline;
 +
float: right;
 +
}
 +
#nav li a:hover, #nav li a:hover::after{
 +
display: block;
 +
text-decoration: none;
 +
color: #43bbff;
 +
}
 +
/*mega dropdown styling*/
 +
#nav li div{
 +
position: absolute;
 +
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/
 +
-ms-filter:
 +
"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242')"; /* for IE 8*/
 +
background: -webkit-gradient(linear, left top, right top, from(#333333), to(#424242)); /* for webkit browsers */
 +
background: -moz-linear-gradient(left,  #333333,  #424242); /* for firefox 3.6+ */
 +
background: linear-gradient(left, #333333 0%, #424242 100%); /*standard*/
 +
}
 +
/*1-column styles*/
 +
#nav li div.col_1{
 +
left: -999px;
 +
width: auto;
 +
padding-bottom: 1.5em;
 +
}
 +
#nav li div.col_1 a{
 +
display: block;
 +
padding: 0 1.5em;
 +
}
 +
#nav li:hover div.col_1{
 +
left: 205px;
 +
margin-top: -55px;
 +
}
 +
/*2-column styles*/
 +
#nav li div.col_2{
 +
width: auto;
 +
left: -999em;
 +
padding-bottom: 1.5em;
 +
height: auto;
 +
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/
 +
-ms-filter:
 +
"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242')"; /* for IE 8*/
 +
background: -webkit-gradient(linear, left top, right top, from(#333333), to(#424242)); /* for webkit browsers */
 +
background: -moz-linear-gradient(left,  #202020,  #333); /* for firefox 3.6+ */
 +
}
 +
#nav li div.col_l, #nav li div.col_r{
 +
position: relative;
 +
width: auto;
 +
float: left;
 +
background: transparent;
 +
padding-left: 20px;
 +
padding-right: 20px;
 +
}
 +
#nav li div.col_l a, #nav li div.col_r a{
 +
display: block;
 +
}
 +
#nav li:hover div.col_2{
 +
left: 205px;
 +
margin-top: -55px;
 +
}
 +
 +
/***End nav styling***/
 +
 +
/***Headerimage***/
 +
#headerimage{
 +
width: 947px;
 +
position: relative;
 +
left: 10px;
 +
margin-bottom: 10px;
 +
margin-top: -20px;
 +
}
 +
#css-full{
 +
display: none;
 +
}
 +
#css-mobi{
 +
display: block;
 +
top: 0px;
 +
}
 +
 +
/***Logo styling***/
 +
#logo{
 +
position: absolute;
 +
top: 40px;
 +
left: 650px;
 +
}
 +
 +
#logo img{
 +
width: 300px;
 +
}
 +
 +
/***Body styling***/
 +
h1{
 +
font-size: 2.5em;
 +
}
 +
h2{
 +
font-size: 1.8em;
 +
}

Revision as of 20:12, 27 June 2012

/*** Minimal header: removes the search bar and header image and readjusts font colours in the menus.

Thanks a lot to the 2011 Brown-Stanford and 2012 Lethbridge iGEM teams for snippets of their code! Check out their wikis at: https://2011.igem.org/Team:Brown-Stanford https://2012.igem.org/Team:Lethbridge

      • /
  1. content h1.firstHeading {

visibility:hidden; }

  1. p-logo {

display: none; }

  1. searchform { 
   display: none;

}

.left-menu { background-color: #555;

} .left-menu a { 

   color: #000;

}

div#top-section{ /*the div containing the entire top bar*/ height: 20px; margin-bottom: 0px !important; border: none; }


  1. content{

margin-top: 0px; }

  1. search-controls {

overflow:hidden; display:none; background: none; position: absolute; top: 170px; right: 40px; }


div#header { width: 975px; text-align: left; margin-left: auto; margin-right: auto; margin-bottom: 0px !important; }

  1. menubar {

position: absolute; background: none; color: black; }

.left-menu, .right-menu{ position: absolute; background: none; color: white; }

.left-menu li, .right-menu li a { color: #000 !important; }


.left-menu ul li, .right-menu ul li a{ background: none; color: #000; }

.right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active { 

   color: 000 !important;

}

  1. catlinks{

display:none; }

/*important for background colours*/ .mediawiki{ background: #eeeeee; }

/***End minimal header***/

/*Base styles*/

  1. content{

border: none; margin-top: 10px; } h1, h2, #css-full, #css-mobi{ font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; border: 0; font-weight: 400; } p{ font-family: Georgia, Serif; font-size: 1em; font-weight: normal; color: black; margin-bottom: 10px; }

  1. css-full, #css-mobi{

position: absolute; float: right; color: black; font-size: 1.3em; top: 0px; right: 15px; display: block; padding: 10px; }

/***Nav styling***/

  1. nav{

list-style: none; width: 180px; margin: 0px 10px 0px 10px; padding: 20px 0px 20px 10px; text-indent: 0; float: left;

/*Background colours*/ background: #202020; /*backup colour in case gradients fail*/ filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#202020', endColorstr='#333333'); /* for IE 6+7*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#202020', endColorstr='#333333')"; /* for IE 8*/ background: -webkit-gradient(linear, left top, right top, from(#202020), to(#333333)); /* for webkit browsers */ background: -moz-linear-gradient(left, #202020, #333); /* for firefox 3.6+ */ background: linear-gradient(left, #202020 0%, #333333 100%); /*standard*/ } /*To be moved to JQ block*/

  1. menu-icon{

display: none; }

  1. nav li{

height: auto; padding: 0; } /*submenu styling*/ #nav li a{ display: block; font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; color: white; font-size: 1.5em; line-height: 1.2em; /*line spacing between submenu rows*/ text-indent: 0.8em; letter-spacing: 0.08em; } #nav li a.dropheader{ text-indent: 0; margin-top: 1.3em; } /*primary menu styling*/ #nav li > a{ display: block; font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif; font-size: 1.8em; color: white; line-height: 40px; /*centers the text vertically*/ } /*arrows to signify dropout menus; to be moved to JQ block*/ #nav li a.drop:after{ content: '>'; padding-right: 20px; color: #BBB; display: inline; float: right; } #nav li a:hover, #nav li a:hover::after{ display: block; text-decoration: none; color: #43bbff; } /*mega dropdown styling*/

  1. nav li div{

position: absolute; filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242')"; /* for IE 8*/ background: -webkit-gradient(linear, left top, right top, from(#333333), to(#424242)); /* for webkit browsers */ background: -moz-linear-gradient(left, #333333, #424242); /* for firefox 3.6+ */ background: linear-gradient(left, #333333 0%, #424242 100%); /*standard*/ } /*1-column styles*/ #nav li div.col_1{ left: -999px; width: auto; padding-bottom: 1.5em; } #nav li div.col_1 a{ display: block; padding: 0 1.5em; } #nav li:hover div.col_1{ left: 205px; margin-top: -55px; } /*2-column styles*/ #nav li div.col_2{ width: auto; left: -999em; padding-bottom: 1.5em; height: auto; filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242')"; /* for IE 8*/ background: -webkit-gradient(linear, left top, right top, from(#333333), to(#424242)); /* for webkit browsers */ background: -moz-linear-gradient(left, #202020, #333); /* for firefox 3.6+ */ } #nav li div.col_l, #nav li div.col_r{ position: relative; width: auto; float: left; background: transparent; padding-left: 20px; padding-right: 20px; } #nav li div.col_l a, #nav li div.col_r a{ display: block; } #nav li:hover div.col_2{ left: 205px; margin-top: -55px; }

/***End nav styling***/

/***Headerimage***/

  1. headerimage{

width: 947px; position: relative; left: 10px; margin-bottom: 10px; margin-top: -20px; }

  1. css-full{

display: none; }

  1. css-mobi{

display: block; top: 0px; }

/***Logo styling***/

  1. logo{

position: absolute; top: 40px; left: 650px; }

#logo img{ width: 300px; }

/***Body styling***/ h1{ font-size: 2.5em; } h2{ font-size: 1.8em; }

Retrieved from "http://2012.igem.org/Team:Calgary/static/basicpagedesktop.css"