Team:Dundee/Notebook

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{:Team:Dundee/Template/header}}
 
-
 
-
 
<html>
<html>
<head>
<head>
-
<title>Dundee 2014 Team</title>
 
-
 
-
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
      
      
-
  <link href="https://2014.igem.org/Team:Dundee/stylesheet?action=raw&ctype=text/css" rel="stylesheet">
+
    <link href="css/notebookPageFlip.css" type="text/css" rel="stylesheet"/>
-
  <link href="https://2014.igem.org/Team:Dundee/bootstrap?action=raw&ctype=text/css" rel="stylesheet">
+
    <link href="https://2014.igem.org/Team:Dundee/bootstrap?action=raw&ctype=text/css" rel="stylesheet">  
-
   <link href="https://2014.igem.org/Team:Dundee/animate?action=raw&ctype=text/css" rel="stylesheet">
+
        <link href= "css/animateActual.css" rel="stylesheet">    
-
 
+
   
-
<link href='http://fonts.googleapis.com/css?family=Special+Elite' rel='stylesheet' type='text/css'>
+
<link href="https://2014.igem.org/Team:Dundee/Team/booklet/css?action=raw&ctype=text/css" type="text/css" rel="stylesheet" media="screen, projection, tv" />
-
+
-
 
+
-
 
+
-
 
+
-
<!--ADDDDDDEDEDEDEDDE STUFFFFFFFFF-->
+
 +
<!-- jQuery -->
 +
    <script src="http://code.jquery.com/jquery-latest.js"></script>
   
   
<!-- jQuery UI -->     
<!-- jQuery UI -->     
Line 26: Line 17:
<!-- booklet js file-->
<!-- booklet js file-->
<script src="https://2014.igem.org/Team:Dundee/Team/booklet/js?action=raw&ctype=text/javascript"></script>
<script src="https://2014.igem.org/Team:Dundee/Team/booklet/js?action=raw&ctype=text/javascript"></script>
-
 
+
   
-
<!-- booklet css -->
+
   
-
<link href="https://2014.igem.org/Team:Dundee/Team/booklet/css?action=raw&ctype=text/css" type="text/css" rel="stylesheet" media="screen, projection, tv" />
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
<style>
+
-
+
-
img.bg {
+
-
/* Set rules to fill background */
+
-
min-height: 100%;
+
-
min-width: 1024px;
+
-
+
-
/* Set up proportionate scaling */
+
-
width: 100%;
+
-
height: auto;
+
-
+
-
/* Set up positioning */
+
-
position: fixed;
+
-
top: 0;
+
-
left: 0;
+
-
}
+
-
+
-
@media screen and (max-width: 1024px){
+
-
img.bg {
+
-
left: 50%;
+
-
margin-left: -512px; }
+
-
}
+
-
</style>
+
-
 
+
-
 
+
-
 
+
-
 
+
</head>
</head>
-
 
+
    <body>
-
<body>
+
       
-
 
+
       
-
 
+
    <!-- NAV BAR-->
-
<img src="https://static.igem.org/mediawiki/2014/5/5b/Dundee_test_background.jpg" class="bg">
+
<div class = "navbar navbar-default navbar-fixed-top">
-
 
+
<div class="container">
-
 
+
<a href="#" class="navbar-brand">Dundee 2014</a>
-
          <!-- Text Grid -->
+
 +
<button class = "navbar-toggle" data-toggle = "collapse" data-target=".navHeaderCollapse">
 +
<span class = "icon-bar"></span>
 +
<span class = "icon-bar"></span>
 +
<span class = "icon-bar"></span>
 +
</button>
 +
 +
<!-- navHeaderCollapse  is an id, button above targets by name!-->
 +
<div class = "collapse navbar-collapse navHeaderCollapse">
 +
<ul class = "nav navbar-nav navbar-right">
 +
 +
<li><a href="#">Project</a></li>
 +
<li class = "dropdown">
 +
<a href="'#" class="dropdown-toggle" data-toggle = "dropdown">Work Done<b class="caret"></b></a>
 +
 +
<ul class="dropdown-menu">
 +
<li><a href="#">Parts</a></li>
 +
<li><a href="#">Modeling</a></li>
 +
<li><a href="#">Notebook</a></li>
 +
</ul>
 +
</li>
 +
                           
 +
<li class = "dropdown">
 +
<a href="'#" class="dropdown-toggle" data-toggle = "dropdown">Team<b class="caret"></b></a>
 +
 +
<ul class="dropdown-menu">
 +
<li><a href="#">Team Bios</a></li>
 +
<li><a href="#">Official iGem Page</a></li>
 +
</ul>
 +
</li>
 +
                           
 +
<li><a href="#">Saftey</a></li>
 +
<li><a href="#">Attributes</a></li>
 +
</ul>
 +
</div>
 +
 +
</div>
 +
</div>
 +
       
 +
          <!-- Text Grid -->
        
        
       <div id="display">
       <div id="display">
Line 104: Line 97:
              
              
             <div class="col-md-6 col-centered" id="info">                                       
             <div class="col-md-6 col-centered" id="info">                                       
-
                 <a href="#bookHolder"  data-toggle="modal"><img src="http://placehold.it/350x150" class="img-responsive" onclick="showBook(0)" alt="Responsive image"></a>
+
                 <a href="#bookHolder"  data-toggle="modal"><img src="img/Books/spine/notebook.jpg" class="img-responsive" onclick="showBook(0)" alt="Responsive image"></a>
-
                 <a href="#bookHolder"  data-toggle="modal"><img onclick="showBook(1)" src="http://placehold.it/350x150" ></a>
+
                 <a href="#bookHolder"  data-toggle="modal"><img onclick="showBook(1)" src="img/Books/spine/memories.jpg" ></a>
             </div>     
             </div>     
              
              
Line 146: Line 139:
                 p3Cont.className = "pageImage";
                 p3Cont.className = "pageImage";
                  
                  
-
                 cCont.src = "http://placehold.it/350x150";
+
                 cCont.src = "img/Books/Diary/diaryFront.jpg";
                 c.appendChild(cCont);
                 c.appendChild(cCont);
                  
                  
-
                 p1Cont.src = "http://placehold.it/350x150";
+
                 p1Cont.src = "img/Books/Diary/week1.jpg";
                 p1.appendChild(p1Cont);
                 p1.appendChild(p1Cont);
                  
                  
-
                 p2Cont.src = "http://placehold.it/350x150";
+
                 p2Cont.src = "img/Books/Diary/week2.jpg";
                 p2.appendChild(p2Cont);
                 p2.appendChild(p2Cont);
                  
                  
-
                 p3Cont.src = "http://placehold.it/350x150";
+
                 p3Cont.src = "img/Books/Diary/week3.jpg";
                 p3.appendChild(p3Cont);
                 p3.appendChild(p3Cont);
                  
                  
Line 254: Line 247:
      
      
     </div>     
     </div>     
-
 
+
</body>
-
        <!-- STOP MODAL BEING UNDER BACKGROUND!-->
+
   
-
    <script>
+
      
-
    $('#bookHolder').appendTo("body").modal('show');
+
-
    </script>
+
-
 
+
-
     <!-- FOOTER -->
+
-
 
+
-
 
+
-
 
+
     <!-- JS import  WILL NEED CHANGED DONE LOCAL FOR BS -->
     <!-- JS import  WILL NEED CHANGED DONE LOCAL FOR BS -->
-
     <script src="http://code.jquery.com/jquery-latest.js"></script>
+
     <script src="js/bootstrap.js"></script>
-
    <script src="http://www.kyleharrison.co.uk/igem/js/bootstrap.min.js"></script>
+
-
</body>
+
</html>
</html>

Revision as of 16:18, 4 June 2014

Diary Library

Responsive image