Team:Freiburg/Modeling

From 2013.igem.org

(Difference between revisions)
(Prototype team page)
 
(2 intermediate revisions not shown)
Line 1: Line 1:
-
<!-- *** What falls between these lines is the Alert Box!  You can remove it from your pages once you have read and understood the alert *** -->
 
-
 
<html>
<html>
-
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #fe2b33;">
 
-
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
 
-
This is a template page. READ THESE INSTRUCTIONS.
 
-
</div>
 
-
<div id="instructions" style="text-align: center; font-weight: normal; font-size: small; color: #f6f6f6; padding: 5px;">
 
-
You are provided with this team page template with which to start the iGEM season.  You may choose to personalize it to fit your team but keep the same "look." Or you may choose to take your team wiki to a different level and design your own wiki.  You can find some examples <a href="https://2008.igem.org/Help:Template/Examples">HERE</a>.
 
-
</div>
 
-
<div id="warning" style="text-align: center; font-weight: bold; font-size: small; color: #f6f6f6; padding: 5px;">
 
-
You <strong>MUST</strong>  have all of the pages listed in the menu below with the names specified.  PLEASE keep all of your pages within your teams namespace. 
 
-
</div>
 
-
</div>
 
-
</html>
 
-
<!-- *** End of the alert box *** -->
+
<!-- Flexslider CSS and JS -->
 +
<style>
 +
/*
 +
* jQuery FlexSlider v2.0
 +
* http://www.woothemes.com/flexslider/
 +
*
 +
* Copyright 2012, Julia Voß
 +
* Free to use under the MIT license.
 +
* http://www.opensource.org/licenses/mit-license.php
 +
*/
 +
 +
/* Browser Resets */
 +
.flex-container a:active,
 +
.flexslider a:active,
 +
.flex-container a:focus,
 +
.flexslider a:focus  {outline: none;}
 +
.slides,
 +
.flex-control-nav,
 +
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
-
{| style="color:#1b2c8a;background-color:#0c6;" cellpadding="3" cellspacing="1" border="1" bordercolor="#fff" width="62%" align="center"
+
/* FlexSlider Necessary Styles
-
!align="center"|[[Team:Freiburg|Home]]
+
*********************************/
-
!align="center"|[[Team:Freiburg/Team|Team]]
+
.flexslider {margin: 0; padding: 0;}
-
!align="center"|[https://igem.org/Team.cgi?year=2013&team_name=Freiburg Official Team Profile]
+
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
-
!align="center"|[[Team:Freiburg/Project|Project]]
+
.flexslider .slides img {width: 50%; display: block;}
-
!align="center"|[[Team:Freiburg/Parts|Parts Submitted to the Registry]]
+
.flex-pauseplay span {text-transform: capitalize;}
-
!align="center"|[[Team:Freiburg/Modeling|Modeling]]
+
-
!align="center"|[[Team:Freiburg/Notebook|Notebook]]
+
-
!align="center"|[[Team:Freiburg/Safety|Safety]]
+
-
!align="center"|[[Team:Freiburg/Attributions|Attributions]]
+
-
|}
+
 +
/* Clearfix for the .slides element */
 +
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
 +
html[xmlns] .slides {display: block;}
 +
* html .slides {height: 1%;}
-
If you choose to include a '''Modeling''' page, please write about your modeling adventures here.  This is not necessary but it may be a nice list to include.
+
/* No JavaScript Fallback */
 +
/* If you are not using another script, such as Modernizr, make sure you
 +
* include js that eliminates this class on page load */
 +
.no-js .slides > li:first-child {display: block;}
 +
 
 +
 
 +
/* FlexSlider Default Theme
 +
*********************************/
 +
.flexslider {margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1;}
 +
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
 +
.loading .flex-viewport {max-height: 300px;}
 +
.flexslider .slides {zoom: 1;}
 +
 
 +
.carousel li {margin-right: 5px}
 +
 
 +
 
 +
/* Direction Nav */
 +
 
 +
.flex-direction-nav {*height: 0;}
 +
.flex-direction-nav a {
 +
width: 35px;
 +
height: 32px;
 +
margin: -20px 0 0;
 +
display: block;
 +
background: url(https://static.igem.org/mediawiki/2013/e/eb/Controls1.png) no-repeat 0 0;
 +
position: absolute;
 +
top: 50%;
 +
cursor: pointer;
 +
text-indent: -9999px;
 +
}
 +
 
 +
 +
.flex-direction-nav .flex-next {background-position: -35px 0; right: 0px; }
 +
.flex-direction-nav .flex-prev {background-position: 0px 0; left: 0px;}
 +
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}
 +
 
 +
 
 +
 
 +
/* Control Nav */
 +
.flex-control-nav {
 +
    width: 100%;
 +
    position: absolute;
 +
    bottom: 30px;
 +
    left: 58px;
 +
    text-align: center;
 +
}
 +
 
 +
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
 +
.flex-control-nav li:first-child {margin: 0;}
 +
.flex-control-nav li a {width: 13px; height: 13px; display: block; background: url() no-repeat 0 0; cursor: pointer; text-indent: -9999px;}
 +
.flex-control-nav li a:hover {background-position: 0 -13px;}
 +
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}
 +
 
 +
 
 +
 
 +
 
 +
.flexslider {
 +
    width: 950px;
 +
    margin: 0px 0px 10px;
 +
 +
}
 +
 
 +
div.frontpage-slide {
 +
    height: 300px;
 +
    background-color: white;
 +
}
 +
 
 +
div.frontpage-slide img{
 +
    height: 300px;
 +
    float: left;
 +
margin:0px;
 +
}
 +
 
 +
div.slide-right-col {
 +
    color: black;
 +
    float: right;
 +
    width: 400px;
 +
    font-size: 16px;
 +
    margin-top: 18px;
 +
    margin-right: 50px;
 +
    line-height: 1.5em;
 +
text-align:justify;
 +
}
 +
 
 +
div.slide-heading {
 +
color: black;
 +
    font-size: 18px;
 +
    font-weight: bold;
 +
    margin-bottom: 20px;
 +
}
 +
 
 +
 
 +
</style>
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
 +
<script src="http://2012.igem-bielefeld.de/includes/wiki/flex/js/jquery.flexslider.js"></script>
 +
 
 +
<!-- Load the flexslider -->
 +
<script type="text/javascript" charset="utf-8">
 +
  $(window).load(function() {
 +
    $('.flexslider').flexslider({
 +
          animation: "slide", // slide or fade
 +
          controlsContainer: ".flex-container" // the container that holds the flexslider
 +
    });
 +
  });
 +
</script>
 +
 
 +
 
 +
 
 +
<!-- Slider Container and Images -->
 +
<div style="padding:5px; z-index:1;">
 +
 
 +
        <div class="flexslider">
 +
            <ul class="slides">
 +
                  <li>
 +
                    <div class="frontpage-slide">
 +
                        <img src="https://static.igem.org/mediawiki/2013/d/d2/Project_kachel.png">
 +
                        <div class="slide-right-col">
 +
                            <div class="slide-heading">
 +
                                Our Toolbox
 +
                            </div>
 +
                         
 +
all what you need
 +
                            <p><a href="https://2013.igem.org/Team:Freiburg/Project/1">
 +
                            Click here to read more</a> about our project
 +
                            </p>
 +
 
 +
                        </div>
 +
                        <div class=clear></div>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <div class="frontpage-slide">
 +
                        <img src="">
 +
                        <div class="slide-right-col">
 +
                            <div class="slide-heading">
 +
                              I do not know
 +
                            </div>
 +
 
 +
 +
                            <p><a href="https://2013.igem.org/Team:Freiburg/Project/1">
 +
                            Click here to read more </a> about our methods...
 +
                          </p>
 +
                           
 +
                        </div>
 +
                        <div class=clear></div>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <div class="frontpage-slide">
 +
                        <img src="https://static.igem.org/mediawiki/2013/d/d2/Project_kachel.png">
 +
                        <div class="slide-right-col">
 +
                            <div class="slide-heading">
 +
                                The Potential
 +
                            </div>
 +
   
 +
   
 +
                            <p><a href="http://">
 +
                            Click here to read more</a> </p>                     
 +
 
 +
                        </div>
 +
                        <div class=clear></div>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <div class="frontpage-slide">
 +
                      <img src="https://static.igem.org/mediawiki/2013/d/d2/Project_kachel.png">
 +
                        <div class="slide-right-col">
 +
                            <div class="slide-heading">
 +
                                Light-Activation
 +
                            </div>
 +
 +
 +
 
 +
                            <p><a href="https://2013.igem.org/Team:Freiburg/Project/1">
 +
                            Click here to read more</a>
 +
                          </p>
 +
 
 +
 
 +
                        </div>
 +
 
 +
                        <div class=clear></div>
 +
                    </div>
 +
                </li>
 +
 
 +
               
 +
               
 +
             
 +
            </ul>
 +
        </div>
 +
 
 +
    </div>
 +
 
 +
</html>

Latest revision as of 13:32, 28 August 2013