Difference between revisions of "Team:Goettingen/Team"

(Prototype team page)
 
Line 1: Line 1:
−
{{Goettingen}}
 
−
<html>
 
  
−
<div class="column two_thirds_size" >
+
{{:Team:Goettingen/Menu}}
  
−
<h1>Team</h1>
+
<html>
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
+
    <style>
−
 
+
        .content{
−
 
+
            font-family: Tahoma, Geneva, sans-serif;
−
<h3>What should this page contain?</h3>
+
        }
−
<ul>
+
    </style>
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
+
    <head>
−
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
+
        <script>
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
+
            window.onload = function(){
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
+
                var buttons = document.getElementsByClassName("dropdown_button")
−
</ul>
+
                var i;
−
</div>
+
           
−
 
+
                for(i=0; i < buttons.length; i++){
−
 
+
                    buttons[i].addEventListener("click", function(){
−
 
+
                        this.classList.toggle("active");
−
<div class="column third_size" >
+
                        var dropDownContainer = this.nextElementSibling;
−
<div class="highlight decoration_A_full">
+
                        if(dropDownContainer.style.display === "flex"){
−
<h3>Inspiration</h3>
+
                            dropDownContainer.style.opacity = "0";
−
<p>You can look at what other teams did to get some inspiration! <br />
+
                            dropDownContainer.style.display = "none";
−
Here are a few examples:</p>
+
                        }
−
<ul>
+
                        else{
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">2014 METU Turkey </a></li>
+
                            dropDownContainer.style.opacity = "1";
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">2014 Colombia</a></li>
+
                            dropDownContainer.style.display = "flex";
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">2014 Stony Brook</a></li>
+
                        }
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">2014 OUC-China</a></li>
+
                    });
−
</ul>
+
                }
−
</div>
+
            }
−
</div>
+
        </script>
 +
    </head>
 +
    <body>
 +
        <div class=wrapper>
 +
            <!-- Sidebar-Menü-->
 +
            <div class="side_container">
 +
                <nav class="side_menu">
 +
                    <a href="#" class="side_items">Home</a>
 +
                    <button class="dropdown_button side_items">Team</button>
 +
                    <div class="side_menu_dropdown">
 +
                        <a href="https://2018.igem.org/Team:Goettingen/Team">Team Members</a>
 +
                        <a href="#">Collaborations</a>
 +
                    </div>
 +
                    <button class="dropdown_button side_items">Project</button>
 +
                    <div class="side_menu_dropdown">
 +
                        <a href="#">Description</a>
 +
                        <a href="#">Design</a>
 +
                        <a href="#">Experiments</a>
 +
                        <a href="#">Notebook</a>
 +
                        <a href="#">InterLab</a>
 +
                        <a href="#">Results</a>
 +
                        <a href="#">Demonstrate</a>
 +
                        <a href="#">Attributions</a>
 +
                    </div>
 +
                    <button class="dropdown_button side_items">Parts</button>
 +
                    <div class="side_menu_dropdown">
 +
                        <a href="#">Parts Overview</a>
 +
                        <a href="#">Basic Parts</a>
 +
                        <a href="#">Composite Parts</a>
 +
                        <a href="#">Part Collection</a>
 +
                    </div>
 +
                    <a href="#" class="side_items">Safety</a>
 +
                    <button class="dropdown_button side_items">Human Practices</button>
 +
                    <div class="side_menu_dropdown">
 +
                        <a href="#">Human Practices</a>
 +
                        <a href="#">Education & Engagement</a>
 +
                    </div>
 +
                    <button class="dropdown_button side_items">Awards</button>
 +
                    <div class="side_menu_dropdown">
 +
                        <a href="#">Applied Design</a>
 +
                        <a href="#">Entrepreneurship</a>
 +
                        <a href="#">Measurement</a>
 +
                        <a href="#">Model</a>
 +
                        <a href="#">Plant</a>
 +
                        <a href="#">Software</a>
 +
                    </div>
 +
                    <a href="#" class="side_items">Judging Form</a>
 +
                </nav>
 +
                <div class="triangle_down">
 +
                </div>
 +
            </div>
 +
           
 +
            <div class="content">
 +
                <video class="front_video" autoplay muted loop>
 +
                    <source src="https://static.igem.org/mediawiki/2018/e/e9/T--Goettingen--Main-Page-Introduction.mp4" type="video/mp4">
 +
                </video>
 +
                <div class="example_textfield">
 +
                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
 +
                </div>
 +
                <div class="example_textfield" style="line-height: 300px; font-size: 3em; text-align: center">Mindmap</div>
 +
            </div>
 +
            <!-- Bereich für den Footer-->
 +
            <div class="footer_container">
 +
                <div class="triangle_up"></div>
 +
                <div class="footer">
 +
                    Footer-Platzhalter
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </body>
 
</html>
 
</html>

Revision as of 11:10, 15 May 2018

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Mindmap
Footer-Platzhalter