Difference between revisions of "Team:British Columbia/Notebook/Protocols"

(Replaced content with "{{:Team:British Columbia/Template/Fixednavbar}} <html lang="en"> <body> <ul class="nav nav-pills nav-stacked col-md-3"> <li><a href="#a" data-toggle="tab">1</a></li> ...")
Line 3: Line 3:
 
   
 
   
 
   <body>
 
   <body>
<div class="container">
+
<ul class="nav nav-pills nav-stacked col-md-3">
  <div class="row">
+
     <li><a href="#a" data-toggle="tab">1</a></li>
    <div class="col-md-6">
+
     <li><a href="#b" data-toggle="tab">2</a></li>
      <h3>Tabs</h3>
+
    <li><a href="#c" data-toggle="tab">3</a></li>
        <!-- tabs -->
+
</ul>
        <div class="tabbable">
+
          <ul class="nav nav-tabs">
+
            <li class="active"><a href="#one" data-toggle="tab">One</a></li>
+
            <li><a href="#two" data-toggle="tab">Two</a></li>
+
            <li><a href="#twee" data-toggle="tab">Twee</a></li>
+
          </ul>
+
          <div class="tab-content">
+
            <div class="tab-pane active" id="one">Lorem ipsum dolor sit amet, charetra varius quam sit amet vulputate.
+
            Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.</div>
+
            <div class="tab-pane" id="two">Secondo sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
+
            Aliquam in felis sit amet augue.</div>
+
            <div class="tab-pane" id="twee">Thirdamuno, ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
+
            Quisque mauris augue, molestie tincidunt condimentum vitae.</div>
+
          </div>
+
        </div>
+
        <!-- /tabs -->
+
 
+
    </div>
+
    <div class="col-md-6"><h3>Tabs -below</h3>
+
      
+
         
+
      <!-- tabs bottom -->
+
      <div class="tabbable tabs-below">
+
        <div class="tab-content">
+
        <div class="tab-pane active" id="one_">Lorem ipsum dolor sit amet, charetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.</div>
+
        <div class="tab-pane" id="two_">Secondo sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
+
        Aliquam in felis sit amet augue.</div>
+
        <div class="tab-pane" id="twee_">Thirdamuno, ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae. </div>
+
        </div>
+
        <ul class="nav nav-tabs">
+
          <li><a href="#one_" data-toggle="tab">One</a></li>
+
          <li><a href="#two_" data-toggle="tab">Two</a></li>
+
          <li><a href="#twee_" data-toggle="tab">Twee</a></li>
+
        </ul>
+
      </div>
+
      <!-- /tabs -->
+
     
+
      
+
    </div>
+
  </div><!-- /row -->
+
  <div class="row">
+
   
+
    <div class="col-md-6"><h3>Tabs -left</h3>
+
         
+
      <!-- tabs left -->
+
      <div class="tabbable tabs-left">
+
        <ul class="nav nav-tabs">
+
          <li><a href="#a" data-toggle="tab">One</a></li>
+
          <li class="active"><a href="#b" data-toggle="tab">Two</a></li>
+
          <li><a href="#c" data-toggle="tab">Twee</a></li>
+
        </ul>
+
        <div class="tab-content">
+
        <div class="tab-pane active" id="a">Lorem ipsum dolor sit amet, charetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.</div>
+
        <div class="tab-pane" id="b">Secondo sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
+
        Aliquam in felis sit amet augue.</div>
+
        <div class="tab-pane" id="c">Thirdamuno, ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae. </div>
+
        </div>
+
      </div>
+
      <!-- /tabs -->
+
     
+
    </div>
+
   
+
    <div class="col-md-6"><h3>Tabs -right</h3>
+
         
+
      <!-- tabs right -->
+
      <div class="tabbable tabs-right">
+
        <ul class="nav nav-tabs">
+
          <li class="active"><a href="#1" data-toggle="tab">One</a></li>
+
          <li><a href="#2" data-toggle="tab">Two</a></li>
+
          <li><a href="#3" data-toggle="tab">Twee</a></li>
+
        </ul>
+
        <div class="tab-content">
+
        <div class="tab-pane active" id="1">Lorem ipsum dolor sit amet, charetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.</div>
+
        <div class="tab-pane" id="2">Secondo sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
+
        Aliquam in felis sit amet augue.</div>
+
        <div class="tab-pane" id="3">Thirdamuno, ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
+
        Quisque mauris augue, molestie tincidunt condimentum vitae. </div>
+
        </div>
+
      </div>
+
      <!-- /tabs -->
+
     
+
    </div>
+
   
+
  </div><!-- /row -->
+
</div>
+
 
+
 
+
 
+
 
+
<hr>
+
 
+
 
   </body>
 
   </body>
 
</html>
 
</html>

Revision as of 19:47, 31 March 2015

UBC iGEM 2015