Team:EPF Lausanne test

From 2014.igem.org

(Difference between revisions)
Line 11: Line 11:
<!-- menu -->
<!-- menu -->
-
<button type="button" class="btn btn-default">Default</button>
+
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
-
<table id="menu" width="100%" cellspacing="0" height="135px">
+
        <div class="container">
-
<tr>
+
            <div class="navbar-header">
-
<td  bgColor="#FFFFFF"></td>
+
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
-
<td valign="bottom" width="975px" align="center" bgColor="#FFFFFF">
+
                    <span class="sr-only">Toggle navigation</span>
 +
                    <span class="icon-bar"></span>
 +
                    <span class="icon-bar"></span>
 +
                    <span class="icon-bar"></span>
 +
                </button>
 +
                <a class="navbar-brand" href="http://startbootstrap.com">Start Bootstrap</a>
 +
            </div>
-
<table align="center">
+
            <!-- Collect the nav links, forms, and other content for toggling -->
-
<tr height="50px">
+
            <div class="collapse navbar-collapse navbar-right navbar-ex1-collapse">
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>  
+
                <ul class="nav navbar-nav">
-
<a href="https://2014.igem.org/WikitemplateB_home"style="text-decoration:none;color:#1C140D">HOME </a> </td>  
+
                    <li><a href="#about">About</a>
 +
                    </li>
 +
                    <li><a href="#services">Services</a>
 +
                    </li>
 +
                    <li><a href="#contact">Contact</a>
 +
                    </li>
 +
                </ul>
 +
            </div>
 +
            <!-- /.navbar-collapse -->
 +
        </div>
 +
        <!-- /.container -->
 +
    </nav>
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
    <div class="intro-header">
-
<a href="https://2014.igem.org/WikitemplateB_project" style="text-decoration:none;color:#1C140D">PROJECT</a> </td>
+
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
        <div class="container">
-
<a href="" style="text-decoration:none;color:#1C140D">PARTS</a></td>  
+
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>  
+
            <div class="row">
-
<a href="" style="text-decoration:none;color:#1C140D">TEAM </a> </td>
+
                <div class="col-lg-12">
 +
                    <div class="intro-message">
 +
                        <h1>Landing Page</h1>
 +
                        <h3>A Template by Start Bootstrap</h3>
 +
                        <hr class="intro-divider">
 +
                        <ul class="list-inline intro-social-buttons">
 +
                            <li><a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
 +
                            </li>
 +
                            <li><a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
 +
                            </li>
 +
                            <li><a href="#" class="btn btn-default btn-lg"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
 +
                            </li>
 +
                        </ul>
 +
                    </div>
 +
                </div>
 +
            </div>
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
        </div>
-
<a href="" style="text-decoration:none;color:#1C140D">NOTEBOOK </a> </td>
+
        <!-- /.container -->
-
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
    </div>
-
<a href="" style="text-decoration:none;color:#1C140D">SAFETY </a></td>
+
    <!-- /.intro-header -->
-
</tr>
+
-
<tr> <td colspan="5"></td>
+
    <div class="content-section-a">
-
<td align="center" width="162px"><a href="https://igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a></td>
+
-
</tr>
+
-
</table>
+
-
</td>
+
        <div class="container">
-
<td  bgColor="#FFFFFF"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of menu -->
+
 +
            <div class="row">
 +
                <div class="col-lg-5 col-sm-6">
 +
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">Death to the Stock Photo:
 +
                        <br>Special Thanks</h2>
 +
                    <p class="lead">A special thanks to Death to the Stock Photo for providing the photographs that you see in this template. <a target="_blank" href="http://join.deathtothestockphoto.com/">Visit their website</a> to become a member.</p>
 +
                </div>
 +
                <div class="col-lg-5 col-lg-offset-2 col-sm-6">
 +
                    <img class="img-responsive" src="img/ipad.png" alt="">
 +
                </div>
 +
            </div>
-
<!-- First block of content -->
+
        </div>
-
<table  id="firstblock" width="100%"  cellspacing="0" height="500px">
+
        <!-- /.container -->
-
<tr>
+
-
<td  bgColor="#FFFFFF"></td>
+
-
<td width="975px" align="center" bgColor="#FFFFFF" >
+
-
<!-- You can replace this image with your team's logo! -->
+
    </div>
-
<img src="https://static.igem.org/mediawiki/2014/0/06/BioPad.png" width="500px">
+
    <!-- /.content-section-a -->
-
<h3>Welcome! <br> We are Team EPFL! </h3>
+
-
<p>Scroll down to find more about our project! </p>
+
-
</td>
+
    <div class="content-section-b">
-
<td bgColor="#FFFFFF"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of first block -->
+
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-lg-5 col-lg-offset-1 col-sm-push-6  col-sm-6">
 +
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">3D Device Mockups
 +
                        <br>by PSDCovers</h2>
 +
                    <p class="lead">Turn your 2D designs into high quality, 3D product shots in seconds using free Photoshop actions by PSDCovers! <a target="_blank" href="http://www.psdcovers.com/">Visit their website</a> to download some of their awesome, free photoshop actions!</p>
 +
                </div>
 +
                <div class="col-lg-5 col-sm-pull-6  col-sm-6">
 +
                    <img class="img-responsive" src="img/doge.png" alt="">
 +
                </div>
 +
            </div>
-
<!-- Block of content 1 -->
+
        </div>
-
<table width="100%"  cellspacing="0" height="500px">
+
        <!-- /.container -->
-
<tr><td  bgColor="#FEE5AD"></td>
+
-
<td width="975px" align="center" bgColor="#FEE5AD" >
+
-
<table  width="975px"  cellspacing="0" height="500px">
+
-
<tr>
+
-
<td width="95%" bgColor="#FEE5AD"  rowspan="3" align="center">  
+
    </div>
 +
    <!-- /.content-section-b -->
-
<!-- Content goes here -->
+
    <div class="content-section-a">
-
<!-- Google Calendar -->
+
        <div class="container">
-
<iframe src="https://www.google.com/calendar/embed?src=2uie7evdhbncnvevqhkba4aad0%40group.calendar.google.com&ctz=Europe/Zurich" style="border: 0" width="800" height="600" frameborder="0" scrolling="no"></iframe>
+
-
<h3>Our Calendar :)</h3>
+
            <div class="row">
-
<p>This is our google calendar !</p>
+
                <div class="col-lg-5 col-sm-6">
-
</td>
+
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">Google Web Fonts and
 +
                        <br>Font Awesome Icons</h2>
 +
                    <p class="lead">This template features the 'Lato' font, part of the <a target="_blank" href="http://www.google.com/fonts">Google Web Font library</a>, as well as <a target="_blank" href="http://fontawesome.io">icons from Font Awesome</a>.</p>
 +
                </div>
 +
                <div class="col-lg-5 col-lg-offset-2 col-sm-6">
 +
                    <img class="img-responsive" src="img/phones.png" alt="">
 +
                </div>
 +
            </div>
 +
        </div>
 +
        <!-- /.container -->
-
<!-- This is the back to top button -->
+
    </div>
-
<td bgColor=#FEE5AD> </td>
+
    <!-- /.content-section-a -->
-
<tr><td bgColor=#FEE5AD></td></tr>
+
-
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
-
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
+
-
</table>
+
 +
    <div class="banner">
-
</td>
+
        <div class="container">
-
<td bgColor="#FEE5AD"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of Block-->
+
 +
            <div class="row">
 +
                <div class="col-lg-6">
 +
                    <h2>Connect to Start Bootstrap:</h2>
 +
                </div>
 +
                <div class="col-lg-6">
 +
                    <ul class="list-inline banner-social-buttons">
 +
                        <li><a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
 +
                        </li>
 +
                        <li><a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
 +
                        </li>
 +
                        <li><a href="#" class="btn btn-default btn-lg"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
 +
                        </li>
 +
                    </ul>
 +
                </div>
 +
            </div>
 +
        </div>
 +
        <!-- /.container -->
-
<!-- Block of content 2 -->
+
    </div>
-
<table width="100%"  cellspacing="0" height="500px">
+
    <!-- /.banner -->
-
<tr>
+
-
<td  bgColor="#FACA66"></td>
+
-
<td width="975px" align="center" bgColor="#FACA66" >
+
-
<table  width="975px"  cellspacing="0" height="500px">
+
    <footer>
-
<tr>
+
        <div class="container">
-
<td width="95%" bgColor="#FACA66"  rowspan="3" align="center">  
+
            <div class="row">
-
 
+
                <div class="col-lg-12">
-
<!-- Content goes here -->
+
                    <ul class="list-inline">
-
 
+
                        <li><a href="#home">Home</a>
-
 
+
                        </li>
-
 
+
                        <li class="footer-menu-divider">&sdot;</li>
-
</td> 
+
                        <li><a href="#about">About</a>
-
 
+
                        </li>
-
 
+
                        <li class="footer-menu-divider">&sdot;</li>
-
<!-- This is the back to top section -->
+
                        <li><a href="#services">Services</a>
-
<td bgColor=#FACA66> </td>
+
                        </li>
-
<tr><td bgColor=#FACA66></td></tr>
+
                        <li class="footer-menu-divider">&sdot;</li>
-
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>  
+
                        <li><a href="#contact">Contact</a>
-
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
+
                        </li>
-
</table>
+
                    </ul>
-
 
+
                    <p class="copyright text-muted small">Copyright &copy; Your Company 2013. All Rights Reserved</p>
-
</td>
+
                </div>
-
<td bgColor="#FACA66"></td>
+
            </div>
-
</tr>
+
        </div>
-
</table>
+
    </footer>
-
<!-- end of Block-->
+
-
 
+
-
 
+
-
 
+
-
<!--  Block of content 3 -->
+
-
<table width="100%"  cellspacing="0" height="500px">
+
-
<tr>
+
-
<td  bgColor="#F7A541"></td>
+
-
<td width="975px" align="center" bgColor="#F7A541" >
+
-
 
+
-
<table  width="975px"  cellspacing="0" height="500px">
+
-
<tr>
+
-
<td width="95%" bgColor="#F7A541"  rowspan="3" align="center">
+
-
 
+
-
<!-- Content goes here -->
+
-
 
+
-
 
+
-
</td>
+
-
 
+
-
 
+
-
<!-- This is the back to top section -->
+
-
<td bgColor=#F7A541> </td>
+
-
<tr><td bgColor=#F7A541></td></tr>
+
-
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
-
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
+
-
 
+
-
</table>
+
-
 
+
-
 
+
-
</td>
+
-
<td bgColor="#F7A541"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of Block-->
+
-
 
+
-
 
+
-
<!--  Block of content 4 -->
+
-
<table width="100%"  cellspacing="0" height="500px">
+
-
<tr>
+
-
<td  bgColor="#F45D4C"></td>
+
-
<td width="975px" align="center" bgColor="#F45D4C" >
+
-
 
+
-
<table  width="975px"  cellspacing="0" height="500px">
+
-
<tr>
+
-
<td width="95%" bgColor="#F45D4C"  rowspan="3" align="center">
+
-
<!-- Content goes here -->
+
-
 
+
-
 
+
-
 
+
-
</td>
+
-
 
+
-
 
+
-
<!-- This is the back to top section -->
+
-
<td bgColor=#F45D4C> </td>
+
-
<tr><td bgColor=#F45D4C ></td></tr>
+
-
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
+
-
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
+
-
 
+
-
</table>
+
-
</td>
+
-
<td bgColor="#F45D4C"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of Block-->
+
-
 
+
-
 
+
-
 
+
-
<!-- Final block of content -->
+
-
<table  id="firstblock" width="100%"  cellspacing="0" height="200px">
+
-
<tr>
+
-
<td  bgColor="#FFFFFF"></td>
+
-
<td width="975px" align="center" bgColor="#FFFFFF" >
+
-
 
+
-
<p>Here you can place the logos of your sponsors or other links!</p>
+
-
 
+
-
</td>
+
-
<td bgColor="#FFFFFF"></td>
+
-
</tr>
+
-
</table>
+
-
<!-- end of final block -->
+
</html>
</html>

Revision as of 14:18, 31 May 2014

Landing Page

A Template by Start Bootstrap



Death to the Stock Photo:
Special Thanks

A special thanks to Death to the Stock Photo for providing the photographs that you see in this template. Visit their website to become a member.


3D Device Mockups
by PSDCovers

Turn your 2D designs into high quality, 3D product shots in seconds using free Photoshop actions by PSDCovers! Visit their website to download some of their awesome, free photoshop actions!


Google Web Fonts and
Font Awesome Icons

This template features the 'Lato' font, part of the Google Web Font library, as well as icons from Font Awesome.