Template:Tsinghua:Common-Style

From 2014.igem.org

(Difference between revisions)
Line 122: Line 122:
.content ul, .content ol {
.content ul, .content ol {
padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
-
}
 
-
 
-
/* ~~ Drop right nav bar menu ~~ */
 
-
nav {
 
-
padding: 0;
 
-
margin: 0;
 
-
border: 0;
 
-
line-height: 1;
 
-
}
 
-
nav ul li a:link {
 
-
color: #ffffff;
 
-
text-decoration: none; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
 
-
}
 
-
nav ul li a:visited {
 
-
color: #ffffff;
 
-
text-decoration: none;
 
-
}
 
-
 
-
nav ul,
 
-
nav ul li,
 
-
nav ul ul {
 
-
list-style: none;
 
-
margin: 0;
 
-
padding: 0;
 
-
}
 
-
nav ul {
 
-
position: relative;
 
-
z-index: 597;
 
-
float: left;
 
-
}
 
-
nav ul li {
 
-
float: left;
 
-
min-height: 1px;
 
-
line-height: 1em;
 
-
vertical-align: middle;
 
-
position: relative;
 
-
}
 
-
nav ul li.hover,
 
-
nav ul li:hover {
 
-
position: relative;
 
-
z-index: 599;
 
-
cursor: default;
 
-
}
 
-
nav ul ul {
 
-
visibility: hidden;
 
-
position: absolute;
 
-
top: 100%;
 
-
left: 0px;
 
-
z-index: 598;
 
-
width: 100%;
 
-
}
 
-
nav ul ul li {
 
-
float: none;
 
-
}
 
-
nav ul ul ul {
 
-
top: -2px;
 
-
right: 0;
 
-
}
 
-
nav ul li:hover > ul {
 
-
visibility: visible;
 
-
}
 
-
nav ul ul {
 
-
top: 1px;
 
-
left: 99%;
 
-
}
 
-
nav ul li {
 
-
float: none;
 
-
}
 
-
nav ul ul {
 
-
margin-top: 1px;
 
-
}
 
-
nav ul ul li {
 
-
font-weight: normal;
 
-
}
 
-
/* Custom CSS Styles */
 
-
nav {
 
-
width: 180px;
 
-
background: #333333;
 
-
font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif;
 
-
zoom: 1;
 
-
font-size: 12px;
 
-
}
 
-
nav:before {
 
-
content: '';
 
-
display: block;
 
-
}
 
-
nav:after {
 
-
content: '';
 
-
display: table;
 
-
clear: both;
 
-
}
 
-
nav a {
 
-
display: block;
 
-
padding: 15px 20px;
 
-
color: #ffffff;
 
-
text-decoration: none;
 
-
text-transform: uppercase;
 
-
}
 
-
nav > ul {
 
-
width: 184px;
 
-
}
 
-
nav ul ul {
 
-
width: 180px;
 
-
}
 
-
nav > ul > li > a {
 
-
border-right: 8px solid #1b9bff;
 
-
color: #ffffff;
 
-
}
 
-
nav > ul > li > a:hover {
 
-
color: #ffffff;
 
-
}
 
-
nav > ul > li.active a {
 
-
background: #1b9bff;
 
-
}
 
-
nav > ul > li a:hover,
 
-
nav > ul > li:hover a {
 
-
background: #1b9bff;
 
-
}
 
-
nav li {
 
-
position: relative;
 
-
}
 
-
nav ul li.has-sub > a:after {
 
-
content: '+';
 
-
position: absolute;
 
-
top: 50%;
 
-
right: 15px;
 
-
margin-top: -6px;
 
-
}
 
-
nav ul ul li.first {
 
-
-webkit-border-radius: 0 3px 0 0;
 
-
-moz-border-radius: 0 3px 0 0;
 
-
border-radius: 0 3px 0 0;
 
-
}
 
-
nav ul ul li.last {
 
-
-webkit-border-radius: 0 0 3px 0;
 
-
-moz-border-radius: 0 0 3px 0;
 
-
border-radius: 0 0 3px 0;
 
-
border-bottom: 0;
 
-
}
 
-
nav ul ul {
 
-
-webkit-border-radius: 0 3px 3px 0;
 
-
-moz-border-radius: 0 3px 3px 0;
 
-
border-radius: 0 3px 3px 0;
 
-
}
 
-
nav ul ul {
 
-
border: 1px solid #0082e7;
 
-
}
 
-
nav ul ul a {
 
-
font-size: 12px;
 
-
color: #ffffff;
 
-
}
 
-
nav ul ul a:hover {
 
-
color: #ffffff;
 
-
}
 
-
nav ul ul li {
 
-
border-bottom: 1px solid #0082e7;
 
-
}
 
-
nav ul ul li:hover > a {
 
-
background: #4eb1ff;
 
-
color: #ffffff;
 
-
}
 
-
nav.align-right > ul > li > a {
 
-
border-left: 4px solid #1b9bff;
 
-
border-right: none;
 
-
}
 
-
nav.align-right {
 
-
float: right;
 
-
}
 
-
nav.align-right li {
 
-
text-align: right;
 
-
}
 
-
nav.align-right ul li.has-sub > a:before {
 
-
content: '+';
 
-
position: absolute;
 
-
top: 50%;
 
-
left: 15px;
 
-
margin-top: -6px;
 
-
}
 
-
nav.align-right ul li.has-sub > a:after {
 
-
content: none;
 
-
}
 
-
nav.align-right ul ul {
 
-
visibility: hidden;
 
-
position: absolute;
 
-
top: 0;
 
-
left: -100%;
 
-
z-index: 598;
 
-
width: 100%;
 
-
}
 
-
nav.align-right ul ul li.first {
 
-
-webkit-border-radius: 3px 0 0 0;
 
-
-moz-border-radius: 3px 0 0 0;
 
-
border-radius: 3px 0 0 0;
 
-
}
 
-
nav.align-right ul ul li.last {
 
-
-webkit-border-radius: 0 0 0 3px;
 
-
-moz-border-radius: 0 0 0 3px;
 
-
border-radius: 0 0 0 3px;
 
-
}
 
-
nav.align-right ul ul {
 
-
-webkit-border-radius: 3px 0 0 3px;
 
-
-moz-border-radius: 3px 0 0 3px;
 
-
border-radius: 3px 0 0 3px;
 
}
}
Line 335: Line 132:
clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
}
}
 +
/* ~~ Miscellaneous float/clear classes ~~ */
/* ~~ Miscellaneous float/clear classes ~~ */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */

Revision as of 07:38, 14 October 2014