Team:CityU HK/Template/CSS
From 2014.igem.org
(Difference between revisions)
(246 intermediate revisions not shown) | |||
Line 8: | Line 8: | ||
<!-- Bootstrap --> | <!-- Bootstrap --> | ||
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> | <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> | ||
+ | <link href='http://fonts.googleapis.com/css?family=Quattrocento+Sans' rel='stylesheet' type='text/css'> | ||
<!-- font --> | <!-- font --> | ||
- | <link href='http://fonts.googleapis.com/css?family= | + | <link href='http://fonts.googleapis.com/css?family=Raleway:100,300,400,500,600,700,900,100' rel='stylesheet' type='text/css'> |
- | + | <link href='http://fonts.googleapis.com/css?family=Dosis:200,400,700' rel='stylesheet' type='text/css'> | |
- | <link href='http://fonts.googleapis.com/css?family= | + | <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'> |
- | + | <link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'> | |
- | + | ||
- | <link href='http://fonts.googleapis.com/css?family= | + | |
- | <link href='http://fonts.googleapis.com/css?family= | + | |
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> | <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> | ||
Line 77: | Line 76: | ||
background-color: transparent; | background-color: transparent; | ||
} | } | ||
+ | |||
#globalWrapper, #content { /*-- changes default wiki settings --*/ | #globalWrapper, #content { /*-- changes default wiki settings --*/ | ||
Line 97: | Line 97: | ||
h3 {border-bottom: none;} | h3 {border-bottom: none;} | ||
a:link {color: none;} | a:link {color: none;} | ||
+ | |||
+ | h1, h2, h3, p { | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | } | ||
.navbar-default { | .navbar-default { | ||
border-bottom: solid 3px #e0e0e0; | border-bottom: solid 3px #e0e0e0; | ||
- | margin | + | margin:0; |
- | + | ||
- | + | ||
height: 8%; | height: 8%; | ||
} | } | ||
.navbar-brand { | .navbar-brand { | ||
- | + | font-family: 'Indie Flower', cursive; | |
- | font-size: | + | font-weight: bold; |
- | + | font-size: 1.8em; | |
- | padding-left: | + | padding-top: 40px; |
+ | padding-left: 2px; | ||
padding-bottom: 70px; | padding-bottom: 70px; | ||
} | } | ||
+ | |||
+ | #igem { | ||
+ | position: relative; | ||
+ | top: -22px; | ||
+ | } | ||
- | + | .nav .navbar-brand a:link { /*overwrite igem default style*/ | |
- | color: # | + | color: #bebebe; |
} | } | ||
Line 125: | Line 133: | ||
.navbar .container-fluid #bs-example-navbar-collapse-1 .nav.navbar-nav.navbar-right { | .navbar .container-fluid #bs-example-navbar-collapse-1 .nav.navbar-nav.navbar-right { | ||
margin-top: 20px; | margin-top: 20px; | ||
- | font-size: | + | font-size: 14px; |
- | font-family:' | + | font-family:'Raleway', sans-serif; |
} | } | ||
.nav.navbar-nav.navbar-right a:link { /*overwrite igem default style*/ | .nav.navbar-nav.navbar-right a:link { /*overwrite igem default style*/ | ||
color:#357385; | color:#357385; | ||
+ | } | ||
+ | |||
+ | .nav.navbar-nav.navbar-right a:hover { | ||
+ | color:#3cc; | ||
+ | background: none; | ||
} | } | ||
.nav.navbar-nav.navbar-right .active a { | .nav.navbar-nav.navbar-right .active a { | ||
+ | background: none; | ||
border-bottom-width: 3px; | border-bottom-width: 3px; | ||
border-bottom-style: solid; | border-bottom-style: solid; | ||
- | border-bottom-color: # | + | border-bottom-color: #4eecba; |
} | } | ||
- | nav | + | |
- | + | nav li a:hover { | |
- | color: #3cc; | + | color: #3cc; |
- | + | background-color: transparent; | |
- | + | ||
- | + | ||
} | } | ||
+ | |||
+ | .dropdown li a: hover { | ||
+ | background-color: transparent; | ||
+ | |||
+ | } | ||
+ | |||
.dropdown-menu li a:hover { | .dropdown-menu li a:hover { | ||
border: none; | border: none; | ||
color: #3cc; | color: #3cc; | ||
- | font-weight: bold; | + | /*font-weight:bold;*/ |
+ | background: none; | ||
} | } | ||
+ | |||
+ | |||
#footer { | #footer { | ||
background: rgba(0,0,0,0.8); | background: rgba(0,0,0,0.8); | ||
background-size:cover; | background-size:cover; | ||
- | |||
width: 100%; | width: 100%; | ||
clear: both; | clear: both; | ||
- | + | /*top: 0;*/ | |
margin: 0; | margin: 0; | ||
- | padding: | + | padding: 10px 20px 0px 20px; |
border-top: solid 1px #e0e0e0; | border-top: solid 1px #e0e0e0; | ||
- | + | /* position: relative;*/ | |
} | } | ||
- | #footer | + | #footer h3 { |
- | color: # | + | color: #dde0e4; |
+ | font-family: 'Raleway', sans-serif; | ||
+ | font-size: 18px; | ||
+ | font-weight: bold; | ||
+ | padding-bottom: 20px; | ||
} | } | ||
#footer p { | #footer p { | ||
- | color: # | + | color: #777777; |
text-align: center; | text-align: center; | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | |||
+ | #footer #email { | ||
+ | font-size: 18px; | ||
} | } | ||
#footer a { | #footer a { | ||
- | color: # | + | color: #777777; |
text-decoration: none; | text-decoration: none; | ||
} | } | ||
Line 187: | Line 216: | ||
} | } | ||
- | + | #copyright { | |
- | + | width:100%; | |
- | + | padding-top:10px; | |
- | + | padding-bottom: 10px; | |
- | + | background: rgba(0,0,0,0.8); | |
- | + | color: #777777; | |
- | + | font-family: 'Raleway', sans-serif; | |
- | + | font-size: 14px; | |
- | + | text-align: center; | |
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
@media screen and (max-width: 480px) { | @media screen and (max-width: 480px) { | ||
Line 273: | Line 239: | ||
#abstract h2 { | #abstract h2 { | ||
+ | font-size: 2em; | ||
+ | padding-top: 10px; | ||
+ | padding-bottom: 10px; | ||
margin-left: 30px; | margin-left: 30px; | ||
margin-right: 30px;} | margin-right: 30px;} | ||
Line 279: | Line 248: | ||
padding-left: 10px; | padding-left: 10px; | ||
padding-right: 10px; | padding-right: 10px; | ||
+ | font-weight: 300; | ||
font-size: 14px;} | font-size: 14px;} | ||
+ | |||
+ | #footer { | ||
+ | height: 500px;} | ||
#footer img { | #footer img { | ||
Line 289: | Line 262: | ||
#navbar-brand { | #navbar-brand { | ||
Font-size:25px;} | Font-size:25px;} | ||
+ | |||
+ | #abstract p { | ||
+ | padding-left: 10px; | ||
+ | padding-right: 10px; | ||
+ | |||
+ | #footer { | ||
+ | height: 500px;} | ||
+ | |||
} | } | ||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 00:33, 18 October 2014