Difference between revisions of "Template:Austin UTexas"

 
(109 intermediate revisions by 2 users not shown)
Line 10: Line 10:
  
 
/********************************* MENU ********************************/
 
/********************************* MENU ********************************/
−
/*****current menu******/
 
−
ul {
 
−
    list-style-type: none;
 
−
    margin: 0;
 
−
    padding: 0;
 
−
    overflow: hidden;
 
−
    background-color: #333;
 
−
}
 
  
−
li {
+
/*********************new menu formatting*******************/
−
    float: left;
+
−
}
+
−
 
+
−
li a, .dropbtn {
+
−
    display: inline-block;
+
−
    color: white;
+
−
    text-align: center;
+
−
    padding: 14px 16px;
+
−
    text-decoration: none;
+
−
}
+
−
 
+
−
li a:hover, .dropdown:hover .dropbtn {
+
−
    background-color: red;
+
−
}
+
−
 
+
−
li.dropdown {
+
−
    display: inline-block;
+
−
}
+
−
 
+
−
.dropdown-content {
+
−
    display: none;
+
−
    position: absolute;
+
−
    background-color: #f9f9f9;
+
−
    min-width: 160px;
+
−
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
−
}
+
−
 
+
−
.dropdown-content a {
+
−
    color: black;
+
−
    padding: 12px 16px;
+
−
    text-decoration: none;
+
−
    display: block;
+
−
    text-align: left;
+
−
}
+
−
 
+
−
.dropdown-content a:hover {background-color: #f1f1f1}
+
−
 
+
−
.show {display:block;}
+
−
 
+
−
 
+
−
 
+
−
/*********************test menu formatting*******************/
+
−
.clearfix:after {
+
−
    content: “”;
+
−
    display:block;
+
−
    clear:both;
+
−
}
+
  
 
.menu-wrap {
 
.menu-wrap {
 
     width:100%;
 
     width:100%;
−
    box-shadow:0px 1px 3px rgba(0,0,0,0.2);
+
     background:#FFF;
−
     background:#3e3436;
+
 
     position:relative;
 
     position:relative;
 
}
 
}
 
   
 
   
 
.menu {
 
.menu {
 +
    margin-top:-6px;
 +
    padding:0;
 +
    position: fixed;
 +
    z-index:1;
 +
    left: 0px;
 
     width:100%;
 
     width:100%;
−
    margin:0px auto;
+
     background:#FFF;
−
     background:#3e3436;
+
 
}
 
}
 
   
 
   
Line 88: Line 36:
 
.menu a {
 
.menu a {
 
     transition:all linear 0.15s;
 
     transition:all linear 0.15s;
−
     color:#919191;
+
    padding:10px;
 +
     color:#BDBDBD;
 
}
 
}
 
   
 
   
−
.menu li:click > a, .menu .current-item > a {
+
.menu li:hover > a, .menu .current-item > a {
 
     text-decoration:none;
 
     text-decoration:none;
−
     color:#be5b70;
+
     color:#000000;
 
}
 
}
 
   
 
   
Line 102: Line 51:
 
   
 
   
 
/*----- Top Level -----*/
 
/*----- Top Level -----*/
 +
menu > ul {
 +
    white-space: nowrap;
 +
}
 +
 +
 
.menu > ul > li {
 
.menu > ul > li {
 +
    margin-top:-5px;
 
     float:left;
 
     float:left;
 
     display:inline-block;
 
     display:inline-block;
Line 110: Line 65:
 
   
 
   
 
.menu > ul > li > a {
 
.menu > ul > li > a {
−
    padding:10px 40px;
+
      display: inline-block;
−
    display:inline-block;
+
      float: none;
−
    text-shadow:0px 1px 0px rgba(0,0,0,0.4);
+
 
}
 
}
 
   
 
   
 
.menu > ul > li:hover > a, .menu > ul > .current-item > a {
 
.menu > ul > li:hover > a, .menu > ul > .current-item > a {
−
    background:#2e2728;
+
    background:#DF7F3E;
 
}
 
}
 
   
 
   
 
/*----- Bottom Level -----*/
 
/*----- Bottom Level -----*/
−
.menu li:click .sub-menu {
+
.menu li:hover ul {
−
    z-index:1;
+
    display:block;
−
    opacity:1;
+
 
}
 
}
 
   
 
   
 
.sub-menu {
 
.sub-menu {
−
     width:120%;
+
     width:200%;
 
     padding:0px 0px;
 
     padding:0px 0px;
 
     position:absolute;
 
     position:absolute;
−
     top:100%;
+
     top:90%;
 
     left:0px;
 
     left:0px;
−
    z-index:-1;
 
−
    opacity:0;
 
 
     transition:opacity linear 0.15s;
 
     transition:opacity linear 0.15s;
 
     box-shadow:0px 2px 3px rgba(0,0,0,0.2);
 
     box-shadow:0px 2px 3px rgba(0,0,0,0.2);
 
     background:#2e2728;
 
     background:#2e2728;
 +
    display:none;
 +
    z-index:1;
 
}
 
}
 
   
 
   
 
.sub-menu li {
 
.sub-menu li {
 
     display:block;
 
     display:block;
−
     font-size:16px;
+
     font-size:13px;
 
}
 
}
 
   
 
   
 
.sub-menu li a {
 
.sub-menu li a {
−
     padding:10px 30px;
+
     padding:10px 10px;
 
     display:block;
 
     display:block;
 
}
 
}
 
   
 
   
 
.sub-menu li a:hover, .sub-menu .current-item a {
 
.sub-menu li a:hover, .sub-menu .current-item a {
−
     background:#3e3436;
+
    text-color:#000000;
 +
     background:#DF7F3E;
 
}
 
}
  
Line 322: Line 276:
 
margin-left: 0px;
 
margin-left: 0px;
 
                 margin-right: 0px;
 
                 margin-right: 0px;
−
                 margin-top: 40px;
+
                 margin-top: 25px;
 
padding: 0px 0px;  
 
padding: 0px 0px;  
 
float: left;  
 
float: left;  
Line 330: Line 284:
 
.column  {  
 
.column  {  
 
width: 100%;
 
width: 100%;
−
float:left;  
+
  margin-left: auto ;
−
                 margin-top: 40px;
+
                margin-right: auto ;
 +
                 margin-top: 20px;
 
}
 
}
  
−
.full_size {
+
        .full_size{
 
width:80%;  
 
width:80%;  
−
               margin-left:150px;
+
}
 +
 
 +
.full_size_outer{
 +
width:80%;
 +
               background: rgba(255, 255, 255, .70);
 +
}
 +
 
 +
      /* only use inside .full_size_outer */
 +
        .full_size_inner{
 +
width:100%;  
 
}
 
}
  
Line 343: Line 307:
 
                 width: 100%;
 
                 width: 100%;
 
}
 
}
 +
       
 +
        .seventh_size {
 +
                width: 14.28%;
 +
                text-align: center;
 +
                float:left;
 +
        }
  
 
         .sixth_size{
 
         .sixth_size{
−
                 width: 13%;
+
                 width: 16.66%;
 
                 text-align: center;
 
                 text-align: center;
−
                 float:center;
+
                 float:left;
 
         }
 
         }
  
 +
        .fifth_size {
 +
                width: 20%;
 +
                text-align:center;
 +
                float:left;
 +
        }
 
.half_size {
 
.half_size {
 
width: 50%;  
 
width: 50%;  
 +
                float:left;
 
}
 
}
 
.half_size img {  
 
.half_size img {  
Line 378: Line 354:
 
}
 
}
  
 +
  
 
/*STYLING */
 
/*STYLING */
Line 415: Line 392:
 
/* font and text */
 
/* font and text */
 
.content_wrapper p {  
 
.content_wrapper p {  
−
padding:0px 15px;  
+
padding:1px 15px;  
−
font-size: 13px;
+
font-size: 17px;
 
font-family:'Calisto MT', serif;  
 
font-family:'Calisto MT', serif;  
 
}
 
}
Line 442: Line 419:
 
/* non numbered lists */
 
/* non numbered lists */
 
.content_wrapper ul {
 
.content_wrapper ul {
−
padding: 0px 20px;
+
padding:1px 15px;  
−
font-size: 13px;
+
font-size: 17px;
 
font-family:'Calisto MT', serif;  
 
font-family:'Calisto MT', serif;  
 
}
 
}
Line 449: Line 426:
 
/* numbered lists */
 
/* numbered lists */
 
.content_wrapper ol {
 
.content_wrapper ol {
−
padding:0px;  
+
padding:1px 15px;  
−
font-size: 13px;
+
font-size: 17px;
 
font-family:'Calisto MT', serif;   
 
font-family:'Calisto MT', serif;   
 
}
 
}
Line 501: Line 478:
 
}
 
}
  
−
      /* footer */
 
−
      .footer {
 
−
            position: relative;
 
−
            right: 0;
 
−
            bottom: 0;
 
−
            left: 0;
 
−
            background-color: #FFF;
 
−
            text-align: left;
 
−
}
 
  
 
/********************************* RESPONSIVE STYLING ********************************/
 
/********************************* RESPONSIVE STYLING ********************************/
Line 548: Line 516:
  
 
<!-- This tells the browser that your page is responsive -->
 
<!-- This tells the browser that your page is responsive -->
−
<!--
+
 
 
<div class="menu_wrap" >
 
<div class="menu_wrap" >
 
         <nav class="menu">
 
         <nav class="menu">
Line 567: Line 535:
 
<ul class="sub-menu">
 
<ul class="sub-menu">
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Description"> ★  Description </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Description"> ★  Description </a></li>
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Design"> ★ Design </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Experiments"> Experiments </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Proof"> ★ Proof of Concept </a></li>
 
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Demonstrate"> ★ Demonstrate </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Demonstrate"> ★ Demonstrate </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Results"> Results </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Results"> Results </a></li>
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Notebook"> Notebook </a></li>
 
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Protocols"> Protocols </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Protocols"> Protocols </a></li>
 
                     </ul>
 
                     </ul>
 
                 </li>
 
                 </li>
  
−
<li class > <a href="">PARTS  <span class="arrow">&#9660;</span></a>
+
<li > <a href="https://2016.igem.org/Team:Austin_UTexas/Parts">PARTS </a></li>
−
<ul class="sub-menu">
+
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Parts">Parts </a></li>
+
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Basic_Part"> ★ Basic Parts </a></li>
+
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Composite_Part"> ★ Composite Parts </a></li>
+
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Part_Collection"> ★ Part Collection </a></li>
+
−
                    </ul>
+
−
                </li>
+
  
  
Line 595: Line 552:
 
<li> <a href=""> HUMAN PRACTICES<span class="arrow">&#9660;</span></a>
 
<li> <a href=""> HUMAN PRACTICES<span class="arrow">&#9660;</span></a>
 
<ul class="sub-menu">
 
<ul class="sub-menu">
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Human_Practices"> Human Practices </a></li>
+
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Human_Practices"> Human Practices         </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/HP/Silver">★ Silver </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/HP/Silver">★ Silver </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/HP/Gold">★ Gold </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/HP/Gold">★ Gold </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Integrated_Practices"> ★ Integrated Practices </a></li>
 
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Integrated_Practices"> ★ Integrated Practices </a></li>
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Engagement">★ Engagement </a></li>
 
 
                     </ul>
 
                     </ul>
−
                </li>
 
−
 
−
<li> <a href="">AWARDS<span class="arrow">&#9660;</span><a>
 
−
<ul class="sub-menu">
 
−
<li><a href="https://2016.igem.org/Team:Austin_UTexas/Entrepreneurship"> ★ Entrepreneurship </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Hardware"> ★ Hardware </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Software">★ Software </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Measurement">★  Measurement </a></li>
 
−
<li> <a href="https://2016.igem.org/Team:Austin_UTexas/Model">★ Model </a></li>
 
−
 
−
 
−
                    </ul>
 
−
 
 
                 </li>
 
                 </li>
  
Line 621: Line 564:
 
   </nav>
 
   </nav>
 
</div>
 
</div>
 +
<div class="content_wrapper">
  
−
<div class="menu-wrap">
 
−
    <nav class="menu">
 
−
        <ul class="clearfix">
 
−
            <li><a href="#">Home</a></li>
 
−
            <li>
 
−
                <a href="#">Movies <span class="arrow">&#9660;</span></a>
 
−
 
−
                <ul class="sub-menu">
 
−
                    <li><a href="#">In Cinemas Now</a></li>
 
−
                    <li><a href="#">Coming Soon</a></li>
 
−
                    <li><a href="#">On DVD/Blu-ray</a></li>
 
−
                    <li><a href="#">Showtimes &amp; Tickets</a></li>
 
−
                </ul>
 
−
            </li>
 
−
            <li><a href="#">T.V. Shows</a></li>
 
−
            <li class="current-item"><a href="#">Photos</a></li>
 
−
            <li><a href="#">Site Help</a></li>
 
−
        </ul>
 
−
    </nav>
 
−
</div>
 
−
--!>
 
−
 
−
<div class="content_wrapper">
 
  
 
<script>
 
<script>
Line 709: Line 630:
  
 
</script>
 
</script>
−
 
−
 
 
</html>
 
</html>

Latest revision as of 21:46, 19 October 2016