Difference between revisions of "Team:Oxford/Assets/Style.css"

Line 1: Line 1:
−
<html>
+
#main-container {
−
    <link href="//2015.igem.org/Team:Oxford/Assets/Bootstrap.css?action=raw&ctype=text/css" rel="stylesheet">
+
                height: auto;
−
    <link href="//2015.igem.org/Team:Oxford/Assets/Style.css?action=raw&ctype=text/css" rel="stylesheet">
+
                top:0;
−
    <script type="text/javascript" src="//2015.igem.org/Team:Oxford/Assets/Bootstrap.js?action=raw&ctype=text/javascript"></script>
+
                bottom: 0;
 +
                left:0;
 +
                right:0;
 +
overflow:scroll;
 +
margin: 20 0 0 0;
 +
                position:fixed;
 +
background-color: #fff;
 +
}
  
−
    <div id="main-container">
+
.top-spacer {
−
        <nav class="navbar navbar-default navbar-fixed-top">
+
    width: 100%;
−
            <div class="container-fluid">
+
−
                <div class="navbar-header">
+
−
                    <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#ox-navbar">
+
−
                        <span class="icon-bar"></span>
+
−
                        <span class="icon-bar"></span>
+
−
                        <span class="icon-bar"></span>
+
−
                    </button>
+
−
                    <a class="navbar-brand" href="https://2015.igem.org/Team:Oxford"><img alt="brand" src="https://static.igem.org/mediawiki/2015/7/7f/Ox-navbar-brand.png"></a>
+
−
                </div>
+
−
                <nav class="navbar-collapse collapse" id="ox-navbar">
+
−
                    <ul class="nav navbar-nav navbar-right">
+
−
                        <li class="active"><a href="https://2015.igem.org/Team:Oxford/Description">PROJECT</a></li>
+
−
                        <li><a href="#">MODELING</a></li>
+
−
                        <li><a href="#">PARTS</a></li>
+
−
                        <li><a href="#">PRACTICES</a></li>
+
−
                        <li><a href="#">NOTEBOOK</a></li>
+
−
                        <li><a href="#">TEAM</a></li>
+
−
                        <li><a href="#">BLOG</a></li>
+
−
                    </ul>
+
−
                </nav>
+
−
            </div>
+
−
        </nav>
+
  
−
        <div class="page-title-section">
+
}
−
            <!--<div class="title-container">-->
+
−
                <img src="https://static.igem.org/mediawiki/2015/f/f8/Ox-utilyse_banner.png"/>
+
  
−
            <!--</div>-->
+
.navbar  {
−
        </div>
+
    margin-top: 16px;
−
        <div class="title-spacer container-fluid"></div>
+
    position: fixed;
−
        <div  class="container-fluid content-container">
+
    font-size: 13px;
−
            <div class="row">
+
    background-color: #fff;
−
                <div class="col-md-9" role="main">
+
}
−
                    <h1 id="about" class="page-header">Here is a section header</h1>
+
 
−
                    <p class="lead">This is the lead paragraph describing the section</p>
+
.navbar-right li {
−
                    <h2 id="The Problem">The problem</h2>
+
    font-family: "Avenir",sans-serif;
−
                    <p>Outline the problem we are looking to solve</p>
+
    color: #2d2c35;
−
                    <h1 id="about" class="page-header">Here is a section header</h1>
+
    font-weight: bolder;
−
                    <p class="lead">This is the lead paragraph describing the section</p>
+
    padding-right: 0;
−
                    <h2 id="The Problem">The problem</h2>
+
}
−
                    <p>Outline the problem we are looking to solve</p>
+
 
−
                    <h1 id="about" class="page-header">Here is a section header</h1>
+
.navbar-brand>img {
−
                    <p class="lead">This is the lead paragraph describing the section</p>
+
    max-height: 30px;
−
                    <h2 id="The Problem">The problem</h2>
+
    padding-top:10%;
−
                    <p>Outline the problem we are looking to solve</p>
+
    padding-bottom:10%;
−
                </div>
+
}
−
                <div class="col-md-3" role="main">
+
 
−
                    <p>over here I will make a navigator that has all the sections and subheders in so you can easily navigate</p>
+
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav> .active > a:hover {
−
                </div>
+
    background-color: #fff;
−
            </div>
+
    border-bottom: 1px solid #fa2963;
−
        </div>
+
}
−
     </div>
+
 
−
</html>
+
.navbar-default .navbar-nav a{
 +
    padding-left: 0;
 +
    padding-right: 10px;
 +
    margin-right: 15px;
 +
    padding-bottom: 3px;
 +
    border-bottom: 1px solid #cccccc;
 +
}
 +
 
 +
.navbar-default .navbar-nav > .active {
 +
    background-color: #fff;
 +
 
 +
}
 +
 
 +
.page-title-section {
 +
    margin-top: 66px;
 +
    width: 100%;
 +
    background-image: url(https://static.igem.org/mediawiki/2015/8/89/Ox_bluedots.jpg);
 +
    background-size: 8px 56px;
 +
    background-repeat: repeat;
 +
    position: fixed;
 +
    float: left;
 +
    z-index:-1000;
 +
    -webkit-transform: translateZ(0);
 +
}
 +
 
 +
.page-title-section img {
 +
    width: 80%;
 +
    margin-left:10%;
 +
    margin-right:10%;
 +
    padding: 12% 0;
 +
}
 +
 
 +
.title-spacer {
 +
    margin-top: 66px;
 +
    width:100%;
 +
    padding-bottom: 38%;
 +
    position: relative;
 +
    float:left;
 +
}
 +
 
 +
.row {
 +
     background-color: #fff;
 +
}

Revision as of 14:16, 20 July 2015

  1. main-container {
               height: auto;
               top:0;
               bottom: 0;
               left:0;
               right:0;

overflow:scroll; margin: 20 0 0 0; 

               position:fixed;

background-color: #fff; }

.top-spacer { 

   width: 100%;

}

.navbar { 

   margin-top: 16px;
   position: fixed;
   font-size: 13px;
   background-color: #fff;

}

.navbar-right li { 

   font-family: "Avenir",sans-serif;
   color: #2d2c35;
   font-weight: bolder;
   padding-right: 0;

}

.navbar-brand>img { 

   max-height: 30px;
   padding-top:10%;
   padding-bottom:10%;

}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav> .active > a:hover { 

   background-color: #fff;
   border-bottom: 1px solid #fa2963;

}

.navbar-default .navbar-nav a{ 

   padding-left: 0;
   padding-right: 10px;
   margin-right: 15px;
   padding-bottom: 3px;
   border-bottom: 1px solid #cccccc;

}

.navbar-default .navbar-nav > .active { 

   background-color: #fff;

}

.page-title-section { 

   margin-top: 66px;
   width: 100%;
   background-image: url(Ox_bluedots.jpg);
   background-size: 8px 56px;
   background-repeat: repeat;
   position: fixed;
   float: left;
   z-index:-1000;
   -webkit-transform: translateZ(0);

}

.page-title-section img { 

   width: 80%;
   margin-left:10%;
   margin-right:10%;
   padding: 12% 0;

}

.title-spacer { 

   margin-top: 66px;
   width:100%;
   padding-bottom: 38%;
   position: relative;
   float:left;

}

.row { 

   background-color: #fff;

}