|
|
Line 1: |
Line 1: |
| {{RUM-UPRM}} | | {{RUM-UPRM}} |
− | <html lang="en"> | + | <!DOCTYPE html> |
− | | + | <html> |
| <head> | | <head> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | | <meta name="viewport" content="width=device-width, initial-scale=1"> |
Line 30: |
Line 30: |
| </style> | | </style> |
| </head> | | </head> |
− |
| |
| <body> | | <body> |
− | <!--Preloader-->
| |
− | <div class="se-pre-con"></div>
| |
− | <!-- Navigation-->
| |
− | <nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
| |
− | <div class="container">
| |
− | <a class="navbar-brand js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM">RUM-UPRM</a>
| |
− | <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
| |
− | Menu
| |
− | <i class="fas fa-bars"></i>
| |
− | </button>
| |
− | <div class="collapse navbar-collapse" id="navbarResponsive">
| |
− | <ul class="navbar-nav ml-auto">
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM/Members">Team</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM/Description">Projects</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM/Safety">Safety</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM/Engineering">Engineering Success</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://2020.igem.org/Team:RUM-UPRM/Human_Practices">Human Practices</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="#">Awards</a></li>
| |
− | <li class="nav-item"><a class="nav-link js-scroll-trigger" href="#">Judging Form</a></li>
| |
− | </ul>
| |
− | </div>
| |
− | </div>
| |
− | </nav>
| |
| | | |
| + | - |
| | | |
− |
| |
− | <section class="bg-light content" style="background-size: 100%;margin-top: 0em;padding-top: 1.1em;" class="height-90 parallax">
| |
− | <div class="d-flex h-100 align-items-center">
| |
− | <h3 class="display-5">Lab Protocols</h3>
| |
− |
| |
− | <h2>Animated Collapsibles</h2>
| |
− |
| |
− | <p>A Collapsible:</p>
| |
− | <button class="collapsible">Open Collapsible</button>
| |
− | <div class="content">
| |
− | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
| |
− | </div>
| |
− |
| |
− | <p>Collapsible Set:</p>
| |
− | <button class="collapsible">Open Section 1</button>
| |
− | <div class="content">
| |
− | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
| |
− | </div>
| |
− | <button class="collapsible">Open Section 2</button>
| |
− | <div class="content">
| |
− | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
| |
− | </div>
| |
− | <button class="collapsible">Open Section 3</button>
| |
− | <div class="content">
| |
− | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
| |
− | </div>
| |
− |
| |
− | <script>
| |
− | var coll = document.getElementsByClassName("collapsible");
| |
− | var i;
| |
− |
| |
− | for (i = 0; i < coll.length; i++) {
| |
− | coll[i].addEventListener("click", function() {
| |
− | this.classList.toggle("active");
| |
− | var content = this.nextElementSibling;
| |
− | if (content.style.maxHeight){
| |
− | content.style.maxHeight = null;
| |
− | } else {
| |
− | content.style.maxHeight = content.scrollHeight + "px";
| |
− | }
| |
− | });
| |
− | }
| |
− | </script>
| |
| </body> | | </body> |
− |
| |
− | </div>
| |
− | </section>
| |
− | <footer class="footer bg-black small text-center text-white-50"><div class="container">Copyright © UPRM-RUM 2020</div></footer>
| |
− | </body>
| |
| </html> | | </html> |