Difference between revisions of "Team:BOKU-Vienna/Notebook"

Line 13: Line 13:
 
       text-align: center;
 
       text-align: center;
 
       color: black;
 
       color: black;
       background: url("https://static.igem.org/mediawiki/2017/b/bf/T--BOKU-Vienna--Protocol_Backgroundgrey.jpg") no-repeat bottom center scroll;
+
       background: url("https://static.igem.org/mediawiki/2017/6/60/T--BOKU-Vienna--Notebook_Background2.jpg") no-repeat bottom center scroll;
 
       background-color: black;
 
       background-color: black;
 
       -webkit-background-size: cover;
 
       -webkit-background-size: cover;
Line 31: Line 31:
 
       font-family: Tahoma, Geneva, sans-serif;
 
       font-family: Tahoma, Geneva, sans-serif;
 
     }
 
     }
   
 
  
 
</style>
 
</style>
 
 
 
<div id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
 
<div id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
 
     <!-- One-Page Scroll NavBar -->
 
     <!-- One-Page Scroll NavBar -->
Line 88: Line 85:
  
 
     <!-- About Section -->
 
     <!-- About Section -->
 
 
 
 
 
     <section id="Notebook" class="container content-section text-center">
 
     <section id="Notebook" class="container content-section text-center">
 
         <div class="row">
 
         <div class="row">
Line 97: Line 90:
 
                 <h2>Notebook.</h2>
 
                 <h2>Notebook.</h2>
 
                 <p> <br>Our <a href="https://2017.igem.org/Team:BOKU-Vienna/Notebookdata">Notebook</a> is still under construction. You can find our protocol for the methods here:  
 
                 <p> <br>Our <a href="https://2017.igem.org/Team:BOKU-Vienna/Notebookdata">Notebook</a> is still under construction. You can find our protocol for the methods here:  
<a href="https://2017.igem.org/Team:BOKU-Vienna/Protocol">Protocol</a>               </br></p>
+
<a href="https://2017.igem.org/Team:BOKU-Vienna/Protocol">Protocol</a>
 +
               
 +
 
 +
 
 +
</br></p>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
Line 103: Line 100:
 
<!---TEST--->
 
<!---TEST--->
  
<!---TEST-->
+
<!-- Special version of Bootstrap that only affects content wrapped in .bootstrap-iso -->
 +
<link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" />  
  
 +
<!--Font Awesome (added because you use icons in your prepend/append)-->
 +
<link rel="stylesheet" href="https://formden.com/static/cdn/font-awesome/4.4.0/css/font-awesome.min.css" />
 +
 +
<!-- Inline CSS based on choices in "Settings" tab -->
 +
<style>.bootstrap-iso .formden_header h2, .bootstrap-iso .formden_header p, .bootstrap-iso form{font-family: Arial, Helvetica, sans-serif; color: black}.bootstrap-iso form button, .bootstrap-iso form button:hover{color: white !important;} .asteriskField{color: red;}</style>
 +
 +
<!-- HTML Form (wrapped in a .bootstrap-iso div) -->
 +
<div class="bootstrap-iso">
 +
<div class="container-fluid">
 +
  <div class="row">
 +
  <div class="col-md-6 col-sm-6 col-xs-12">
 +
    <form method="post">
 +
    <div class="form-group ">
 +
      <label class="control-label " for="date1">
 +
      Date
 +
      </label>
 +
      <div class="input-group">
 +
      <div class="input-group-addon">
 +
        <i class="fa fa-calendar">
 +
        </i>
 +
      </div>
 +
      <input class="form-control" id="date1" name="date1" placeholder="MM/DD/YYYY" type="text"/>
 +
      </div>
 +
    </div>
 +
    <div class="form-group">
 +
      <div>
 +
      <button class="btn btn-primary " name="submit" type="submit">
 +
        Submit
 +
      </button>
 +
      </div>
 +
    </div>
 +
    </form>
 +
  </div>
 +
  </div>
 +
</div>
 +
</div>
 +
 +
 +
<!-- Extra JavaScript/CSS added manually in "Settings" tab -->
 +
<!-- Include jQuery -->
 +
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
 +
 +
<!-- Include Date Range Picker -->
 +
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
 +
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
 +
 +
<script>
 +
    $(document).ready(function(){
 +
        var date_input=$('input[name="date"]'); //our date input has the name "date"
 +
        var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
 +
        date_input.datepicker({
 +
            format: 'mm/dd/yyyy',
 +
            container: container,
 +
            todayHighlight: true,
 +
            autoclose: true,
 +
        })
 +
    })
 +
</script>
 +
 +
<!---TEST-->
 +
$('.datepicker').datepicker();
 
     </section>
 
     </section>
  

Revision as of 13:45, 11 July 2017

Notebook

V

Notebook.


Our Notebook is still under construction. You can find our protocol for the methods here: Protocol

$('.datepicker').datepicker();