Difference between revisions of "Team:CityU HK/Template/CSS"

Line 104: Line 104:
  
 
.navbar-default {
 
.navbar-default {
background-color: #f40000;
+
background-color: #f9fccb ;
border-bottom: solid 3px #f40000;
+
/*border-bottom: solid 3px #f40000;*/
margin:0;
+
                height: 8%;
+
}
+
+
.navbar-brand {
+
font-family: 'Roboto Condensed', sans-serif;
+
                font-weight: bold;
+
font-size: 2.0em;
+
padding-top: 45px;
+
padding-left: 20px;
+
padding-bottom: 70px;
+
}
+
 
+
        #igem {
+
                position: relative;
+
                top: -22px;
+
        }
+
       
+
        .nav .navbar-brand a:link {          /*overwrite igem default style*/
+
                color: #bebebe;
+
        }
+
 
+
.navbar-brand:hover {
+
color:#3cc;
+
}
+
+
    .navbar .container-fluid #bs-example-navbar-collapse-1 .nav.navbar-nav.navbar-right {
+
margin-top: 20px;
+
font-size: 14px;
+
font-family:'Raleway', sans-serif;
+
}
+
    .nav.navbar-nav.navbar-right a:link {    /*overwrite igem default style*/
+
        color:#357385;
+
    }
+
 
+
    .nav.navbar-nav.navbar-right a:hover {   
+
        color:#3cc;
+
        background: none;
+
    }
+
 
+
    .nav.navbar-nav.navbar-right .active a {
+
        background: none;
+
border-bottom-width: 3px;
+
border-bottom-style: solid;
+
border-bottom-color: #4eecba;
+
}
+
 
+
nav li a:hover {
+
color: #3cc;
+
        background-color: transparent;
+
}
+
 
+
.dropdown li a: hover {
+
        background-color: transparent;
+
 
+
}
+
 
+
.dropdown-menu li a:hover {
+
border: none;
+
color: #3cc;
+
/*font-weight:bold;*/
+
        background: none;
+
}
+
 
+
 
+
 
+
#footer {
+
background: rgba(0,0,0,0.8);
+
background-size:cover;
+
        width: 100%;
+
clear: both;
+
/*top: 0;*/
+
        margin: 0;
+
        padding: 10px 20px 0px 20px;
+
        border-top: solid 1px #e0e0e0;
+
      /* position: relative;*/
+
}
+
 
+
#footer h3 {
+
color: #dde0e4;
+
        font-family: 'Raleway', sans-serif;
+
        font-size: 18px;
+
        font-weight: bold;
+
        padding-bottom: 20px;
+
}
+
 
+
#footer p {
+
color: #777777;
+
text-align: center;
+
        font-size: 14px;
+
}
+
 
+
#footer #email {
+
      font-size: 18px;
+
}
+
 
+
#footer a {
+
color: #777777;
+
text-decoration: none;
+
}
+
 
+
#footer a:hover {
+
color: #3cc;
+
}
+
 
+
#footer img {
+
margin-left: 40px;
+
margin-top: 30px;
+
margin-bottom: 10px;
+
}
+
 
+
#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) {
+
        .navbar-default {
+
        height: auto;}
+
 
+
        /*.navbar-brand span{
+
        display: none;}*/
+
+
        .carousel-inner {
+
        height:auto;}
+
 
+
        #abstract h2 {
+
        font-size: 2em;
+
        padding-top: 10px;
+
        padding-bottom: 10px;
+
        margin-left: 30px;
+
        margin-right: 30px;}
+
+
        #abstract p {
+
        padding-left: 10px;
+
        padding-right: 10px;
+
        font-weight: 300;
+
        font-size: 14px;}
+
+
      #footer {
+
      height: 500px;}
+
 
+
        #footer img {
+
        width: 30px;
+
        height: 30px;}
+
}
+
 
+
@media screen and (max-width: 800px){
+
        #navbar-brand {
+
        Font-size:25px;}
+
 
+
        #abstract p {
+
        padding-left: 10px;
+
        padding-right: 10px;
+
 
+
      #footer {
+
      height: 500px;}
+
 
+
+
</style>
+
</html>
+
<html>
+
 
+
    <meta charset="utf-8">
+
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
    <title>Bootstrap 101 Template</title>
+
 
+
    <!-- Bootstrap -->
+
    <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 -->
+
    <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=Lobster' rel='stylesheet' type='text/css'>
+
    <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:700' rel='stylesheet' type='text/css'>
+
 
+
 
+
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+
    <!--[if lt IE 9]>
+
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+
    <![endif]-->
+
 
+
 
+
<style type="text/css">
+
 
+
/* Removing wiki-like stuff */
+
/****************************/
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;}
+
/****************************/
+
 
+
#top-section {    /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
background-color: #383838;
+
border: 0 none;
+
        height: 0px;
+
        color: transparent;
+
z-index: 100;
+
top: 0;
+
position: fixed;
+
width: 975px;
+
left: 50%;
+
margin-left: -487px;
+
}
+
 
+
#top-section:hover {
+
background-color: #383838;
+
border: 0 none;
+
        height: 14px;
+
z-index: 100;
+
top: 0;
+
width: 975px;
+
left: 50%;
+
margin-left: -487px;
+
        -webkit-transition: all 0s linear .1s;
+
-moz-transition: all 0s linear .1s;
+
-ms-transition: all 0s linear .1s;
+
-o-transition: all 0s linear .1s;
+
transition: all 0s linear .1s;
+
}
+
 
+
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
+
background-color: #383838;
+
height: 14px;
+
display: block;
+
z-index: 10;
+
position: fixed;
+
width: 100%;
+
top: 0;
+
}
+
 
+
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
+
color: #727272;
+
text-decoration: none;
+
background-color: transparent;
+
}
+
 
+
 
+
#globalWrapper, #content { /*-- changes default wiki settings --*/
+
width: 100%;
+
height: 100%;
+
border: 0px;
+
background-color: transparent;
+
margin: 0px;
+
padding: 0px;
+
}
+
 
+
html, body, .wrapper { /*-- changes default wiki settings --*/
+
width: 100%;
+
height: 100%;
+
background-color: transparent;
+
}
+
 
+
h2 {border-bottom: none;}
+
h1 {border-bottom: none;}
+
h3 {border-bottom: none;}
+
a:link {color: none;}
+
 
+
        h1, h2, h3, p {
+
                font-family: 'Raleway', sans-serif;
+
        }
+
 
+
 
+
.navbar-default {
+
background-color: #f40000;
+
border-bottom: solid 3px #f40000;
+
 
margin:0;
 
margin:0;
 
                 height: 8%;
 
                 height: 8%;

Revision as of 07:37, 12 July 2015

Bootstrap 101 Template