Team:British Columbia/Team

From 2014.igem.org

(Difference between revisions)
Line 7: Line 7:
       <div class="row">
       <div class="row">
           <div class="col-xs-6 col-md-3">
           <div class="col-xs-6 col-md-3">
-
               <a href="" class="thumbnail">
+
 
-
                 <img src-data="holder.js/100%x180" alt="" src="https://static.igem.org/mediawiki/2014/d/d7/Ubc_eric_s.jpg" class="thumbnail">
+
              <!-- link trigger modal-->
 +
               <a href="" class="thumbnail" data-toggle="modal" data-target="#myModal">
 +
                 <img src-data="holder.js/100%x180" alt="Eric_S" src="https://static.igem.org/mediawiki/2014/d/d7/Ubc_eric_s.jpg" class="thumbnail">
               </a>
               </a>
             </div>
             </div>
           <!-- Modal pop up for Eric S. -->
           <!-- Modal pop up for Eric S. -->
-
           <div class="md-modal md-effect-1" id="modal-1">
+
           <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-
            <div class="md-content">
+
              <div class="modal-dialog">
-
                <h3>Modal Dialog</h3>
+
                  <div class="modal-content">
-
                <div>
+
                      <div class="modal-header">
-
                      <p>This is a modal window. You can do the following things with it:</p>
+
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
-
                      <ul>
+
                            <h4 class="modal-title" id="myModalLabel">Modal title</h4>
-
                        <li><strong>Read:</strong> Modal windows will probably tell you something important so don't forget to read what it says.</li>
+
                      </div>
-
                        <li><strong>Look:</strong> modal windows enjoy a certain kind of attention; just look at it and appreciate its presence.</li>
+
                      <div class="modal-body">
-
                        <li><strong>Close:</strong> click on the button below to close the modal.</li>
+
                              ...
-
                      </ul>
+
                      </div>
-
                      <button class="md-close">Close me!</button>
+
                      <div class="modal-footer">
-
                </div>
+
                          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 +
                          <button type="button" class="btn btn-primary">Save changes</button>
 +
                      </div>
 +
                </div>
             </div>
             </div>
-
          </div>
+
          </div>
-
          <!-- Modal Eric S ends -->
+
          <!-- Modal Eric S ends -->

Revision as of 22:20, 6 September 2014

2014 UBC iGEM

Our Team