(35 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
− | + | <head> | |
+ | <meta charset="utf-8" /> | ||
+ | <!-- <script async src="../src/js/index.js"></script> --> | ||
+ | <style> | ||
+ | #interlab a{ | ||
+ | text-decoration: none; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | .topbar-menu{ | ||
+ | display: flex; | ||
+ | width: 100%; | ||
+ | align-items: center; | ||
+ | height: fit-content; | ||
+ | background-color: gainsboro; | ||
+ | } | ||
+ | |||
+ | .topbar-menuItem { | ||
+ | padding-right: 50px; | ||
+ | white-space: nowrap; | ||
+ | cursor: pointer; | ||
+ | user-select: none; | ||
+ | } | ||
+ | |||
+ | .topbar-icon{ | ||
+ | height: 120px; | ||
+ | padding: 10px; | ||
+ | cursor: pointer; | ||
+ | user-select: none; | ||
+ | } | ||
+ | |||
+ | .topbar-toggle{ | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | } | ||
+ | .topbar-menuItem:hover .topbar-toggle{ | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .topbar-item{ | ||
+ | padding-top: 5px; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | <head> | ||
+ | <body> | ||
+ | <div class="topbar-menu"> | ||
+ | <div> | ||
+ | <img class='topbar-icon' src="https://i.imgur.com/BxLfzBB.png"/> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="topbar-menuItem"> | ||
+ | <div>Team</div> | ||
+ | </div> | ||
+ | |||
+ | <div class="topbar-menuItem"> | ||
+ | <div>DryLab</div> | ||
+ | <div class="topbar-toggle"> | ||
+ | <div class="topbar-item">BioReactor</div> | ||
+ | <div class="topbar-item">MV Kit</div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="topbar-menuItem"> | ||
+ | <div>WetLab</div> | ||
+ | <div class="topbar-toggle"> | ||
+ | <div class="topbar-item">Experiment</div> | ||
+ | <div class="topbar-item">Parts</div> | ||
+ | <div class="topbar-item" id="interlab"><a href="https://2018.igem.org/Team:NTHU_Taiwan/InterLab">InterLab</a></div> | ||
+ | <div class="topbar-item">Protocal</div> | ||
+ | <div class="topbar-item">Notebook</div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="topbar-menuItem">Humam Practices</div> | ||
+ | <div class="topbar-menuItem">Awards</div> | ||
+ | </div> | ||
+ | </body> | ||
</html> | </html> |
Latest revision as of 09:10, 29 August 2018