Team:TU Eindhoven/Style:NavPanel

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
html, body { height: 100%; }
+
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video
-
html, body, div, span, applet, object, iframe,
+
  {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;}
-
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+
 
-
a, abbr, acronym, address, big, cite, code,
+
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section
-
del, dfn, em, img, ins, kbd, q, s, samp,
+
  {display: block;}
-
small, strike, strong, sub, sup, tt, var,
+
 
-
b, u, i, center,
+
ol,ul
-
dl, dt, dd, ol, ul, li,
+
  {list-style:none;margin:0;padding:0;}
-
fieldset, form, label, legend,
+
 
-
table, caption, tbody, tfoot, thead, tr, th, td,
+
blockquote,q
-
article, aside, canvas, details, embed,
+
  {quotes:none;}
-
figure, figcaption, footer, header, hgroup,
+
 
-
menu, nav, output, ruby, section, summary,
+
blockquote:before,blockquote:after,q:before,q:after
-
time, mark, audio, video {
+
  {content:'';content:none;}
-
margin: 0;
+
table
-
padding: 0;
+
  {border-collapse:collapse;border-spacing:0;}
-
border: 0;
+
 
-
font-size: 100%;
+
/* Removing iGEM style */
-
vertical-align: baseline;
+
 
 +
#searchInput, #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 +
  display: none;
}
}
-
+
 
-
article, aside, details, figcaption, figure,
+
#content {
-
footer, header, hgroup, menu, nav, section {
+
 
-
display: block;
+
  width: auto;
 +
  padding:0px;
 +
  border: none;
 +
  background:none;
}
}
-
body {
+
 
-
line-height: 1;
+
#globalWrapper {
 +
  padding:0px;
}
}
-
ol, ul {
+
 
-
list-style: none;
+
 
 +
/* Customizing standard iGEM navigation panel */
 +
 
 +
#top-section{
 +
  height:auto;
 +
  width: 100%;
 +
  border: none;
 +
 
 +
  border-top: none;
}
}
-
blockquote, q {
+
 
-
quotes: none;
+
#menubar {
 +
  display: table-cell;
 +
  width:100px;
 +
  height: 19px;
 +
  opacity:0;
 +
  padding-top:5px;
 +
  background:none;
 +
 
}
}
-
blockquote:before, blockquote:after,
+
 
-
q:before, q:after {
+
 
-
content: '';
+
#menubar:hover{
-
content: none;
+
  display: table-cell;
 +
  width:100px;
 +
  height: auto;
 +
  opacity:1;
 +
  font-size: 14px;
 +
  padding-top:5px;
 +
  background:none;
}
}
-
table {
+
 
-
border-collapse: collapse;
+
#menubar.left-menu {
-
border-spacing: 0;
+
  padding-left:2%
}
}
-
 
-
body { background:#eee; margin:0; }
+
#menubar.right-menu {
-
+
  text-align: right;
-
a:link, a:visited, a:active { color: #3c9632; text-decoration: none; outline:none; }
+
  padding-right:8%;
-
a:hover { text-decoration: none; color: #34742d; }
+
  padding-top:5px;
 +
}
 +
#menubar.left-menu a {
 +
  border: none;
 +
  color: #454545;
 +
}
-
body { font-family:Arial, Helvetica, sans-serif; font-size: 14px; color: #555; }
+
#menubar.right-menu a {
 +
  border: none;
 +
  color: #454545;
 +
}
-
h1, h2, h3, h4, p { margin:0 0 15px 0; padding:0; }
+
#menubar * {
-
h1 { font-size:36px; font-weight:normal; font-family:arial, sans-serif; letter-spacing:-1px; color:#333; }
+
  background: transparent;
-
h2 { font-size:28px; font-weight:normal; font-family:arial, sans-serif; letter-spacing:-1px; color:#333; padding:15px 0 0 0; }
+
-
h3 { font-size:22px; font-weight:normal; font-family:arial, sans-serif; letter-spacing:-1px; color:#333; padding:15px 0 0 0; }
+
-
h4 { font-size:16px; font-weight:normal; font-family:arial, sans-serif; color:#333; padding:15px 0 0 0; }
+
-
p { line-height:1.5em }
+
-
.clr {clear:both; font-size:1px; height:1px; }
+
}
-
/* float clearing for IE6 */
+
#menubar * a:hover{
-
* html .clearfix{ height: 1%; overflow: visible;}
+
  color: #00BAC6;
-
/* float clearing for IE7 */
+
  text-decoration: none;
-
*+html .clearfix{ min-height: 1%;}
+
}
-
/* float clearing for everyone else */
+
-
.clearfix:after{ clear: both; content: "."; display: block; height: 0; visibility: hidden; font-size: 0;}
+
-
#main { width:970px; margin:0 auto;  }
+
#menubar > ul > li:last-child {
-
#content { padding:30px; background:#fff; min-height:500px; }
+
  display: none;
 +
}
-
footer { padding:15px 0; font-size:11px; text-align:center; color:#777 }
+
a
 +
  {text-decoration:none;}
 +
.txt-rt{text-align:right;}/* text align right */
 +
.txt-lt{text-align:left;}/* text align left */
 +
.txt-center{text-align:center;}/* text align center */
 +
.float-rt{float:right;}/* float right */
 +
.float-lt{float:left;}/* float left */
 +
.clear{clear:both;}/* clear float */
 +
.pos-relative{position:relative;}/* Position Relative */
 +
.pos-absolute{position:absolute;}/* Position Absolute */
 +
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
 +
.vertical-top{ vertical-align:top;}/* vertical align top */
 +
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
 +
nav.vertical ul li{ display:block;}/* vertical menu */
 +
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
 +
img{max-width:100%;}
 +
/*end reset*/
 +
body {
 +
  background:  white;
 +
  font-family: 'Open Sans', sans-serif;
 +
  font-size: 100%;}
 +
 
 +
.header_btm{
 +
 
 +
background: url('https://static.igem.org/mediawiki/2014/b/b9/Footer_bg_TU_Eindhoven.png');
 +
height: auto;
 +
}
 +
.header_sub{
 +
padding: 0 8%;
 +
}
 +
 
 +
 
 +
/* start menu */
 +
 
 +
.h_menu{
 +
float:left;
 +
 
 +
 
 +
 
 +
}
 +
.h_menu ul li{
 +
margin-right:20px;
 +
float: left;
 +
 
 +
}
 +
.h_menu ul li.active a{
 +
color: #00BAC6;
 +
 
 +
}
 +
.h_menu ul li a{
 +
display:block;
 +
padding: 25px 10px;
 +
text-transform: uppercase;
 +
font-size: 0.925em;
 +
color:#c9c9c9;
 +
font-weight: 600;
 +
-webkit-transition: all 0.3s ease-in-out;
 +
-moz-transition: all 0.3s ease-in-out;
 +
-o-transition: all 0.3s ease-in-out;
 +
transition: all 0.3s ease-in-out;
 +
 
 +
}
 +
.h_menu ul li a:hover{
 +
color: #00BAC6;
 +
        text-decoration: none;
 +
 
 +
}

Revision as of 08:55, 16 July 2014

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video 

  {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;}

article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section 

  {display: block;}

ol,ul 

  {list-style:none;margin:0;padding:0;}

blockquote,q 

  {quotes:none;}

blockquote:before,blockquote:after,q:before,q:after 

  {content:;content:none;}

table 

  {border-collapse:collapse;border-spacing:0;}

/* Removing iGEM style */

  1. searchInput, #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { 
  display: none;

}

  1. content { 
  width: auto;
  padding:0px;
  border: none;
  background:none;

}

  1. globalWrapper { 
  padding:0px;

}


/* Customizing standard iGEM navigation panel */

  1. top-section{ 
  height:auto;
  width: 100%;
  border: none;

  border-top: none;

}

  1. menubar { 
  display: table-cell;
  width:100px;
  height: 19px;
  opacity:0;
  padding-top:5px;
  background:none;

}


  1. menubar:hover{ 
  display: table-cell;
  width:100px;
  height: auto;
  opacity:1;
  font-size: 14px;
  padding-top:5px;
  background:none;

}

  1. menubar.left-menu { 
  padding-left:2%

}

  1. menubar.right-menu { 
  text-align: right;
  padding-right:8%;
  padding-top:5px;

}

  1. menubar.left-menu a { 
  border: none;
  color: #454545;

}

  1. menubar.right-menu a { 
  border: none;
  color: #454545;

}

  1. menubar * { 
  background: transparent;

}

  1. menubar * a:hover{ 
  color: #00BAC6;
  text-decoration: none;

}

  1. menubar > ul > li:last-child { 
  display: none;

}

a 

  {text-decoration:none;}

.txt-rt{text-align:right;}/* text align right */ .txt-lt{text-align:left;}/* text align left */ .txt-center{text-align:center;}/* text align center */ .float-rt{float:right;}/* float right */ .float-lt{float:left;}/* float left */ .clear{clear:both;}/* clear float */ .pos-relative{position:relative;}/* Position Relative */ .pos-absolute{position:absolute;}/* Position Absolute */ .vertical-base{ vertical-align:baseline;}/* vertical align baseline */ .vertical-top{ vertical-align:top;}/* vertical align top */ .underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */ nav.vertical ul li{ display:block;}/* vertical menu */ nav.horizontal ul li{ display: inline-block;}/* horizontal menu */ img{max-width:100%;} /*end reset*/ body { 

  background:  white;
  font-family: 'Open Sans', sans-serif;
  font-size: 100%;}

.header_btm{

background: url('https://static.igem.org/mediawiki/2014/b/b9/Footer_bg_TU_Eindhoven.png'); height: auto; } .header_sub{ padding: 0 8%; }


/* start menu */

.h_menu{ float:left;


} .h_menu ul li{ margin-right:20px; float: left;

} .h_menu ul li.active a{ color: #00BAC6;

} .h_menu ul li a{ display:block; padding: 25px 10px; text-transform: uppercase; font-size: 0.925em; color:#c9c9c9; font-weight: 600; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;

} .h_menu ul li a:hover{ color: #00BAC6; 

       text-decoration: none;

}

Retrieved from "http://2014.igem.org/Team:TU_Eindhoven/Style:NavPanel"