Team:Aalto-Helsinki/sidebar

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
p {
+
<html>
-
/* font-size:50px; */
+
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
-
}
+
<div id= "sidebar-wrapper">
 +
<nav>
 +
<ul class="sidebar-nav">
 +
<li>
 +
<a class="home" href="https://2014.igem.org/Team:Aalto-Helsinki">
 +
Home
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Team">
 +
Team
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Team-About">About us</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Team-Members">Members</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Team-Attributions">Attributions</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Team-Cooperation">Cooperation</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project">
 +
Project
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Abstract">Abstract</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Introduction">Introduction</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Methods">Methods</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Results">Results</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Discussion">Discussion</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Project-Parts">Parts</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Modeling">
 +
Modeling
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Modeling-Scent">Scent-Nuffusion</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Modeling-Time">Time Spent</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Software">
 +
Software
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Modeling-Seeker">BioBrick Seeker</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Notes">
 +
Notes
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Notes-Notebook">Notebook</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Notes-Safety">Safety</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices">
 +
Human Practices
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices-Heureka">Heureka</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices-SoS">SoS</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices-Teaching-Videos">Teaching Videos</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices-Social-Media">Social Media</a>
 +
</li>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Human-Practices-Synthetic-Biology-For-Dummies">SynBio For Dummies</a>
 +
</li>
 +
</ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Qualifications">
 +
Qualifications
 +
</a>
 +
<ul>
 +
<li>
 +
<a href="https://2014.igem.org/Team:Aalto-Helsinki/Qualifications-Medals">Medals</a>
 +
</li>
 +
</ul>
 +
</li>
 +
</li>
 +
<a href="https://2014.igem.org/Main_Page">
 +
<img src="https://static.igem.org/mediawiki/2014/5/5d/Aalto-helsinki-igem-black-100.png" width="55px">
 +
</a>
 +
</ul>
 +
</nav>
 +
</div>
 +
<script>
 +
$(document).ready(function() {
-
a,a:visited {
+
if(location.pathname != "/Team:Aalto-Helsinki") {
-
  color:#999999;
+
$('#sidebar-wrapper a[href^="https://2014.igem.org' + location.pathname + '"]').addClass('active');
-
}
+
} else $('#sidebar-wrapper a.home').addClass('active');
-
.navbar td{
+
$('.sidebar-nav li ul li').hide();
-
text-align:center;
+
console.log($('.sidebar-nav li a.active'));
-
}
+
$('.sidebar-nav li a.active').parent().show();
-
 
+
$('.sidebar-nav li ul li a.active').parent().siblings().show();
-
.navbar .menu-link {
+
$('.sidebar-nav li ul li a.active').addClass("submenu");
-
border:1px solid black;
+
});
-
height:45px;
+
</script>
-
background-color: #e7e7e7;
+
</html>
-
}
+
-
 
+
-
.menu-link a {
+
-
color:#000000;
+
-
}
+
-
 
+
-
.navbar td:hover{
+
-
background-color: #d3d3d3;
+
-
}
+
-
 
+
-
#pagecontent {
+
-
margin: 0 auto;
+
-
margin-top: 5em;
+
-
width: 50%;
+
-
padding: 1em;
+
-
border-radius: 10px;
+
-
}
+
-
 
+
-
#welcomepage {
+
-
margin: 0 auto;
+
-
margin-top: 5em;
+
-
width: 50%;
+
-
padding: 1em;
+
-
border-radius: 10px;
+
-
color: white;
+
-
background-color: gray;
+
-
}
+
-
 
+
-
#top-section {
+
-
  height: 0px;
+
-
  border: none;
+
-
  width: 980px;
+
-
  margin: 0 auto;
+
-
  padding: 0 0 0 0;
+
-
  background-color: transparent;
+
-
  overflow: hide;
+
-
  position: initial;
+
-
}
+
-
 
+
-
#menubar a {
+
-
  color:#999999;
+
-
}
+
-
 
+
-
#menubar{
+
-
  margin-left:245px;
+
-
}
+
-
 
+
-
.left-menu:hover {
+
-
    color: #999999;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
.right-menu li {
+
-
    background-color: transparent;
+
-
}
+
-
.right-menu li a {
+
-
    color: #999999;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
/*SIDEBAAAAAAAAARRRRRRR  STYYYYLEEEEEES  sidebar.css*/
+
-
 
+
-
#sidebar.affix-top{
+
-
position: static;
+
-
margin-top:30px;
+
-
width:228px;
+
-
}
+
-
 
+
-
#sidebar.affix {
+
-
position: fixed;
+
-
top:70px;
+
-
width:228px;
+
-
}
+
-
 
+
-
#wrapper {
+
-
  padding-left: 250px;
+
-
  transition: all 0.4s ease 0s;
+
-
}
+
-
 
+
-
#sidebar-wrapper {
+
-
  margin-left: -250px;
+
-
  left: 250px;
+
-
  width: 250px;
+
-
  position: fixed;
+
-
  height: 100%;
+
-
  overflow-y: auto;
+
-
  z-index: 1000;
+
-
  transition: all 0.4s ease 0s;
+
-
}
+
-
 
+
-
#page-content-wrapper {
+
-
  width: 100%;
+
-
}
+
-
 
+
-
.sidebar-nav {
+
-
  position: absolute;
+
-
  top: 0;
+
-
  width: 250px;
+
-
  list-style: none;
+
-
  margin: 0;
+
-
  padding: 0;
+
-
}
+
-
 
+
-
.sidebar-nav li {
+
-
  line-height: 40px;
+
-
  text-indent: 20px;
+
-
}
+
-
 
+
-
.sidebar-nav li a {
+
-
  color: #999999;
+
-
  display: block;
+
-
  text-decoration: none;
+
-
}
+
-
 
+
-
.sidebar-nav li ul li{
+
-
  list-style: none;
+
-
}
+
-
 
+
-
.sidebar-nav img {
+
-
  margin-left:20px;
+
-
}
+
-
 
+
-
.sidebar-nav li a:hover, .sidebar-nav li ul li a:hover{
+
-
  color: white;
+
-
  text-decoration: none;
+
-
  background-color: #cccccc;
+
-
}
+
-
 
+
-
.sidebar-nav li a:hover{
+
-
}
+
-
 
+
-
.sidebar-nav li a.active{
+
-
  background-color: #999999;
+
-
  color:white;
+
-
}
+
-
 
+
-
.sidebar-nav li ul li a.active{
+
-
  background-color:white;
+
-
  color:#999999
+
-
}
+
-
 
+
-
.sidebar-nav li a:active,
+
-
.sidebar-nav li a:focus {
+
-
  text-decoration: none;
+
-
}
+
-
 
+
-
.sidebar-nav > .sidebar-brand {
+
-
  height: 65px;
+
-
  line-height: 60px;
+
-
  font-size: 18px;
+
-
}
+
-
 
+
-
.sidebar-nav > .sidebar-brand a {
+
-
  color: #999999;
+
-
}
+
-
 
+
-
.sidebar-nav > .sidebar-brand a:hover {
+
-
  color: #fff;
+
-
  background: none;
+
-
}
+
-
 
+
-
.content-header {
+
-
  height: 65px;
+
-
  line-height: 65px;
+
-
}
+
-
 
+
-
.content-header h1 {
+
-
  margin: 0;
+
-
  margin-left: 20px;
+
-
  line-height: 65px;
+
-
  display: inline-block;
+
-
}
+
-
 
+
-
#menu-toggle {
+
-
  display: none;
+
-
}
+
-
 
+
-
.inset {
+
-
  padding: 20px;
+
-
}
+
-
 
+
-
@media (max-width:767px) {
+
-
 
+
-
#wrapper {
+
-
  padding-left: 0;
+
-
}
+
-
 
+
-
#sidebar-wrapper {
+
-
  left: 0;
+
-
}
+
-
 
+
-
#wrapper.active {
+
-
  position: relative;
+
-
  left: 250px;
+
-
}
+
-
 
+
-
#wrapper.active #sidebar-wrapper {
+
-
  left: 250px;
+
-
  width: 250px;
+
-
  transition: all 0.4s ease 0s;
+
-
}
+
-
 
+
-
#menu-toggle {
+
-
  display: inline-block;
+
-
}
+
-
 
+
-
.inset {
+
-
  padding: 15px;
+
-
}
+

Revision as of 09:31, 18 June 2014

Retrieved from "http://2014.igem.org/Team:Aalto-Helsinki/sidebar"