Team:Edinburgh/defaultcss
From 2009.igem.org
(Difference between revisions)
Line 2: | Line 2: | ||
<style type="text/css"> | <style type="text/css"> | ||
+ | |||
@charset "UTF-8"; | @charset "UTF-8"; | ||
@import "https://2009.igem.org/Team:Edinburgh/helpercss?action=raw"; | @import "https://2009.igem.org/Team:Edinburgh/helpercss?action=raw"; | ||
- | |||
/*------------------------------------------------------------------------------------------------------/ | /*------------------------------------------------------------------------------------------------------/ | ||
- | + | @section Style Framework */ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | */ | + | |
- | /* -- | + | /* First-level expected directory tag - li */ |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
ul.dropdown li { | ul.dropdown li { | ||
- | padding: | + | padding: 5px; |
- | + | ||
- | + | ||
} | } | ||
- | ul.dropdown | + | ul.dropdown *.dir { |
- | + | padding-right: 30px; | |
- | background- | + | background-image: none; |
+ | background-position: 100% 50%; | ||
+ | background-repeat: no-repeat; | ||
} | } | ||
- | + | /* Non-first level */ | |
- | + | ul.dropdown ul *.dir { | |
- | + | padding-right: 15px; | |
- | + | background-image: url(images/nav-arrow-right.png); | |
+ | background-position: 100% 50%; | ||
+ | background-repeat: no-repeat; | ||
+ | } | ||
+ | ul.dropdown ul ul *.dir { | ||
+ | background-image: url(images/nav-arrow-right2.png); | ||
+ | } | ||
- | |||
+ | /* Components override */ | ||
- | /* ----- | + | ul.dropdown-vertical *.dir { |
+ | background-image: url(images/nav-arrow-right.png); | ||
+ | } | ||
+ | |||
+ | ul.dropdown-vertical-rtl *.dir { | ||
+ | padding-right: 15px; | ||
+ | background-image: url(images/nav-arrow-left.png); | ||
+ | background-position: 0 50%; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*------------------------------------------------------------------------------------------------------/ | ||
+ | @section Base Drop-Down Styling */ | ||
+ | |||
+ | |||
+ | |||
+ | /* ALL LEVELS (incl. first) */ | ||
- | ul.dropdown | + | ul.dropdown { |
- | + | font: bold 17px/normal Arial, Helvetica, sans-serif; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | ul.dropdown | + | ul.dropdown li { |
- | background-color: | + | background-color: #333; |
- | color: # | + | color: #fff; |
} | } | ||
- | ul.dropdown | + | ul.dropdown li.hover, |
- | ul.dropdown | + | ul.dropdown li:hover { |
- | + | ||
} | } | ||
- | ul.dropdown ul | + | /* Links */ |
- | + | ||
- | + | ul.dropdown a:link, | |
+ | ul.dropdown a:visited { color: #fff; text-decoration: none;} | ||
+ | ul.dropdown a:hover { | ||
+ | border-top-color: #5db1e0 !important; | ||
+ | border-left-color: #5db1e0; | ||
+ | background-color: #4498c7; | ||
+ | color: #fff; | ||
} | } | ||
- | ul.dropdown ul a | + | ul.dropdown ul a.dir:hover { /* proposal */ |
- | + | background-color: #4698ca; | |
- | + | background-image: url(images/comnav-arrowon.png); | |
- | + | color: #fff; | |
+ | } | ||
- | + | ul.dropdown a:active { | |
- | + | background: #058acf url(images/nav-sub-press.png) 0 0 repeat-x !important; | |
- | + | color: #fff; | |
+ | } | ||
- | |||
- | /* - | + | /* NON-FIRST LEVEL */ |
+ | ul.dropdown ul { | ||
+ | left: auto; | ||
+ | right: 0; | ||
+ | width: 150px; | ||
+ | margin-top: -1px; | ||
+ | border-top: 1px solid #1a1a1a; | ||
+ | border-left: solid 1px #4c4c4c; | ||
+ | font: bold 11px/1em Tahoma, Geneva, Verdana, sans-serif; | ||
+ | } | ||
+ | ul.dropdown ul li { | ||
+ | background-color: #3a3a3a; | ||
+ | } | ||
+ | |||
+ | ul.dropdown ul ul { | ||
+ | top: 0; | ||
+ | right: auto; | ||
+ | left: 100%; | ||
+ | margin-top: 0; | ||
+ | border-top: none; | ||
+ | border-left: none; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | ul.dropdown ul ul li { | ||
+ | background-color: #4c4c4c; | ||
+ | } | ||
+ | |||
+ | ul.dropdown ul ul ul li { | ||
+ | background-color: #595959; | ||
+ | } | ||
- | |||
- | |||
- | |||
- | |||
- | /* | + | /* Mixed */ |
+ | ul.dropdown li a, | ||
ul.dropdown *.dir { | ul.dropdown *.dir { | ||
- | + | border-style: solid; | |
- | + | border-width: 1px; | |
- | + | border-color: #404040 #1a1a1a #1a1a1a #505050; | |
- | + | ||
} | } | ||
- | + | ul.dropdown ul li a, | |
- | + | ul.dropdown ul *.dir { border-color: #4a4a4a #242424 #242424; border-left: none; } | |
- | ul.dropdown | + | ul.dropdown ul ul li a, |
- | + | ul.dropdown ul ul *.dir { border-color: #595959 #333 #333; } | |
- | + | ||
- | + | ||
- | + | ||
- | } | + | |
- | ul.dropdown | + | ul.dropdown ul ul ul li a, |
- | + | ul.dropdown ul ul ul *.dir { border-color: #767676 #404040 #404040; } | |
- | } | + | |
+ | |||
+ | |||
+ | /* Custom elements */ | ||
+ | |||
+ | #n-movies { width: 250px; text-align: center; } | ||
+ | #n-movies ul { right: auto; left: 0; width: 249px; text-align: left; } | ||
+ | #n-movies ul ul { left: 249px; width: 150px; } | ||
+ | #n-movies ul a { width: 232px; } | ||
+ | #n-movies ul a.dir { width: 210px; } | ||
+ | #n-movies ul ul a { width: 133px; } | ||
+ | #n-movies ul ul a.dir { width: 111px; } | ||
+ | #n-movies ul ul ul { left: 100%; } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 13:53, 17 August 2009