Template:TemplateTop

From 2010.igem.org

(Difference between revisions)
Line 4: Line 4:
<!-- to są właściwe style, w sekcji head -->
<!-- to są właściwe style, w sekcji head -->
         <style type="text/css">
         <style type="text/css">
-
    html {
+
 
-
min-width: 600px;
+
html {
-
background: #EDEBE3;
+
    min-width: 600px;
-
padding: 0.5em 2em 3em 2em;
+
    background: #EDEBE3;
 +
    padding: 0.5em 2em 3em 2em;
}
}
body, div, th, td, h2, h3, h4 { /* redundant rules for bad browsers  */   
body, div, th, td, h2, h3, h4 { /* redundant rules for bad browsers  */   
     font-family: verdana,sans-serif;
     font-family: verdana,sans-serif;
-
font-size:    x-small;
+
    font-size:    x-small;
-
voice-family: "\"}\"";
+
    voice-family: "\"}\"";
-
voice-family: inherit;
+
    voice-family: inherit;
-
font-size: small;
+
    font-size: small;
-
color: #333;
+
    color: #333;
}   
}   
-
a { color: #777;  }
+
a {  
-
a:hover { color: #000; text-decoration: none; }
+
    color: #777;   
-
a:active { color: #000; }
+
}
-
p { line-height: 140%; }
+
a:hover {
 +
    color: #000; text-decoration: none;  
 +
}
-
h2 {
+
a:active {  
-
font-family: trebuchet ms,arial,verdana,sans-serif;
+
    color: #000;  
-
font-weight: bold;
+
-
font-size: 130%;
+
-
color: #333;
+
-
padding-bottom: 2px;
+
-
border-bottom: 1px dotted #CCC;
+
-
margin: 0;
+
}
}
 +
 +
 +
p {
 +
    line-height: 140%;
 +
}
 +
 +
h1 {
h1 {
display:none;
display:none;
}
}
-
.note {
 
-
background: #EEE;
 
-
background: #FFF3B3;
 
-
padding: 4px;
+
h2 {
-
font-family: tahoma,verdana,sans-serif;
+
    font-family: trebuchet ms,arial,verdana,sans-serif;
-
font-size: 85%;
+
    font-weight: bold;
-
line-height: 130%;
+
    font-size: 130%;
 +
    color: #333;
 +
    padding-bottom: 2px;
 +
    border-bottom: 1px dotted #CCC;
 +
    margin: 0;
}
}
-
#main {
 
-
text-align: left;
 
-
border: 1px solid #CCC181;
 
-
background: #FFFDF3;
 
-
clear: both;
 
-
width: 98%;
 
-
margin-top: -1px;
 
 +
.note {
 +
    background: #EEE;
 +
    background: #FFF3B3;
 +
    padding: 4px;
 +
    font-family: tahoma,verdana,sans-serif;
 +
    font-size: 85%;
 +
    line-height: 130%;
 +
}
 +
#main {
 +
    text-align: left;
 +
    border: 1px solid #CCC181;
 +
    background: #FFFDF3;
 +
    clear: both;
 +
    width: 98%;
 +
    margin-top: -1px;
}
}
 +
#bodyarea {
#bodyarea {
-
padding: 20px;
+
    padding: 20px;
-
min-height: 300px;
+
    min-height: 300px;
}
}
 +
#topbar {
#topbar {
-
padding-bottom: 0.5em;
+
    padding-bottom: 0.5em;
-
font-family: trebuchet ms,verdana,sans-serif;
+
    font-family: trebuchet ms,verdana,sans-serif;
-
font-weight: bold;
+
    font-weight: bold;
-
font-size: 200%;
+
    font-size: 200%;
 +
}
 +
 
 +
#topbar a {
 +
    text-decoration: none; color: #000;
 +
}
 +
 
 +
#topbar a:hover {
 +
    text-decoration: none;
}
}
-
#topbar a { text-decoration: none; color: #000; }
 
-
#topbar a:hover { text-decoration: none; }
 
/*///////////// Tabs Code ////////////*/
/*///////////// Tabs Code ////////////*/
#tabs {
#tabs {
-
font-family: tahoma,verdana,sans-serif;
+
    font-family: tahoma,verdana,sans-serif;
-
font-size: 85%;
+
    font-size: 85%;
-
clear: both;
+
    clear: both;
-
text-align: center;
+
    text-align: center;
-
text-decoration: none;
+
    text-decoration: none;
}
}
#tabs ul {
#tabs ul {
-
display: inline;
+
    display: inline;
-
list-style-type: none;
+
    list-style-type: none;
-
list-style: none;
+
    list-style: none;
 +
   
 +
    margin: 0;
 +
    padding: 0;
 +
    text-decoration: none;
 +
}
-
margin: 0;
+
#tabs li {
-
padding: 0;
+
    float: left;list-style: none;
-
text-decoration: none;
+
    list-style-type: none;  
}
}
-
#tabs li { float: left;list-style: none;
+
#tabs a,span {  
-
list-style-type: none; }
+
    width: 75px;  
-
 
+
}
-
#tabs a,span { width: 75px; }
+
#tabs span {
#tabs span {
-
position: relative;
+
    position: relative;
-
top: 0;
+
    top: 0;
-
margin: 0 2px -2px 0;
+
    margin: 0 2px -2px 0;
-
float: left;
+
    float: left;
-
background: #FFF3B3;
+
    background: #FFF3B3;
-
border-right: 1px solid #CCC181;
+
    border-right: 1px solid #CCC181;
-
        border-top: 1px solid #CCC181;
+
    border-top: 1px solid #CCC181;
-
border-left: 1px solid #CCC181;
+
    border-left: 1px solid #CCC181;
-
padding: 6px 4px 1px 10px;
+
    padding: 6px 4px 1px 10px;
-
text-decoration: none;
+
    text-decoration: none;
-
color: #333;
+
    color: #333;
}
}
#tabs a {
#tabs a {
-
position: relative;
+
    position: relative;
-
top: 0;
+
    top: 0;
-
margin: 2px 2px -2px 0;
+
    margin: 2px 2px -2px 0;
-
float: left;
+
    float: left;
-
background: #99FF66;
+
    background: #99FF66;
-
background: #CCFF99;
+
    background: #CCFF99;
-
border-right: 1px dotted #CCC181;
+
    border-right: 1px dotted #CCC181;
-
border-top: 1px dotted #CCC181;
+
    border-top: 1px dotted #CCC181;
-
border-left: 1px dotted #CCC181;
+
    border-left: 1px dotted #CCC181;
-
padding: 3px 4px 1px 10px;
+
    padding: 3px 4px 1px 10px;
-
text-decoration: none;
+
    text-decoration: none;
-
color: #666;
+
    color: #666;
}
}
#tabs a:hover {
#tabs a:hover {
-
background: #FFF7CD;
+
    background: #FFF7CD;
-
background: #99FF66;
+
    background: #99FF66;
-
background: #CCFF99;
+
    background: #CCFF99;
-
position: relative;
+
    position: relative;
-
top: 0;
+
    top: 0;
-
padding: 5px 4px 1px 10px;
+
    padding: 5px 4px 1px 10px;
-
margin:  0px 2px -2px 0;
+
    margin:  0px 2px -2px 0;
-
color:#000000;
+
    color:#000000;
-
 
+
-
 
+
}
}
 +
#tabs a.active {
#tabs a.active {
-
position: relative;
+
    position: relative;
-
top: 0;
+
    top: 0;
-
margin: 0 2px -2px 0;
+
    margin: 0 2px -2px 0;
-
float: left;
+
    float: left;
-
background: #FFF3B3;
+
    background: #FFF3B3;
-
border-right: 1px solid #666;
+
    border-right: 1px solid #666;
-
border-top: 1px solid #666;
+
    border-top: 1px solid #666;
-
border-left: 1px solid #666;
+
    border-left: 1px solid #666;
-
padding: 6px 4px 1px 10px;
+
    padding: 6px 4px 1px 10px;
-
text-decoration: none;
+
    text-decoration: none;
-
color: #333;
+
    color: #333;
}
}
#tabs a.active:hover {
#tabs a.active:hover {
-
position: relative;
+
    position: relative;
-
top: 0;
+
    top: 0;
-
margin: 0 2px -2 0;
+
    margin: 0 2px -2 0;
-
float: left;
+
    float: left;
-
background: #FFF3B3;
+
    background: #FFF3B3;
-
border-right: 1px solid #666;
+
    border-right: 1px solid #666;
-
border-top: 1px solid #666;
+
    border-top: 1px solid #666;
-
border-left: 1px solid #666;
+
    border-left: 1px solid #666;
-
padding: 6px 4px 6px 10px;
+
    padding: 6px 4px 6px 10px;
-
text-decoration: none;
+
    text-decoration: none;
-
color: #333;
+
    color: #333;
}
}
#subtabs ul {
#subtabs ul {
-
list-style: none;
+
    list-style: none;
-
 
+
    list-style-type: none;
-
list-style-type: none;
+
    margin: 0;
-
margin: 0;
+
    padding: 0;
-
padding: 0;
+
}
}
#subtabs li {
#subtabs li {
-
list-style: none;
+
    list-style: none;
 +
    list-style-type: none;
 +
    float: left;
 +
    padding: 0 60px 20px 8px;
 +
    border-left: 1px dashed #CCC;
 +
    font-size: 120%;
 +
    white-space: nowrap;
 +
}
-
list-style-type: none;
+
#subtabs li:first-child {
-
float: left;
+
    border-left: none;
-
padding: 0 60px 20px 8px;
+
-
border-left: 1px dashed #CCC;
+
-
font-size: 120%;
+
-
white-space: nowrap;
+
}
}
-
 
-
#subtabs li:first-child { border-left: none; }
 
#subtabs {
#subtabs {
-
font-family: tahoma,verdana,sans-serif;
+
    font-family: tahoma,verdana,sans-serif;
-
font-size: 85%;
+
    font-size: 85%;
-
background: #FFF3B3;
+
    background: #FFF3B3;
-
color: #666;
+
    color: #666;
-
padding: 8px 7px 21px 7px; /* for All other Browsers */
+
    padding: 8px 7px 21px 7px; /* for All other Browsers */
}
}

Revision as of 11:26, 25 October 2010

Example Tabs

Retrieved from "http://2010.igem.org/Template:TemplateTop"