Team:British Columbia/Teamtest

From 2014.igem.org

(Difference between revisions)
(Created page with "{{:Team:British Columbia/Templates/MainHeader}} <html> <style type="text/css"> .modal-backdrop { position: relative; } .dl-horizontal dt { white...")
Line 11: Line 11:
         white-space: normal;
         white-space: normal;
   }
   }
 +
 +
 +
<!-- style for panel -->
 +
 +
.cd-panel {
 +
    /*...*/
 +
      visibility: hidden;
 +
    transition: visibility 0s 0.6s;
 +
}
 +
 +
.cd-panel.is-visible {
 +
    visibility: visible;
 +
    transition: visibility 0s 0s;
 +
}
 +
 +
.cd-panel-header {
 +
    /*...*/
 +
    position: fixed;
 +
    top: -50px;
 +
    width: 90%;
 +
    height: 50px;
 +
    transition: top 0.3s 0s;
 +
}
 +
 +
.is-visible .cd-panel-header {
 +
    top: 0;
 +
    transition: top 0.3s 0.3s;
 +
}
 +
 +
.cd-panel-container {
 +
    /*...*/
 +
    position: fixed;
 +
    width: 90%;
 +
    height: 100%;
 +
    top: 0;
 +
    right: 0;
 +
 +
    transition-property: transform;
 +
    transition-duration: 0.3s;
 +
    transition-delay: 0.3s;
 +
 +
    transform: translate3d(100%, 0, 0);
 +
}
 +
 +
.is-visible .cd-panel-container {
 +
    transform: translate3d(0, 0, 0);
 +
    transition-delay: 0s;
 +
}
   </style>
   </style>
 +
 +
 +
<!-- panel -->
 +
 +
<main class="cd-main-content">
 +
    <!-- your main content here -->
 +
</main>
 +
 +
<div class="cd-panel from-right">
 +
    <header class="cd-panel-header">
 +
        <h1>Title Goes Here</h1>
 +
        <a href="#0" class="cd-panel-close">Close</a>
 +
    </header>
 +
 +
    <div class="cd-panel-container">
 +
        <div class="cd-panel-content">
 +
            <!-- your side content here -->
 +
        </div> <!-- cd-panel-content -->
 +
    </div> <!-- cd-panel-container -->
 +
</div> <!-- cd-panel -->
 +
 +
   <div class="container team-table" style="margin-top:100px">
   <div class="container team-table" style="margin-top:100px">

Revision as of 21:01, 17 October 2014

2014 UBC iGEM

Title Goes Here

Close

© 2014 UBC iGEM