Difference between revisions of "Team:DTU-Denmark/test"

Line 1: Line 1:
−
<html lang="en">
+
<html>
−
<head>
+
<head lang="en">
−
  <meta charset="utf-8">
+
    <meta charset="UTF-8">
−
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
    <title></title>
  
−
<!--link rel="stylesheet/less" href="less/bootstrap.less" type="text/css" /-->
+
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
−
<!--link rel="stylesheet/less" href="less/responsive.less" type="text/css" /-->
+
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
−
<!--script src="js/less-1.3.3.min.js"></script-->
+
    <link rel="stylesheet" href="/Team:DTU-Denmark/test/files/css/wiki.css" type="text/css" />
−
<!--append ‘#!watch’ to the browser URL, then refresh the page. -->
+
−
+
−
<link href="/Team:DTU-Denmark/test/files/css/bootstrap.min.css?action=raw&ctype=text/css" rel="stylesheet">
+
−
<link href="/Team:DTU-Denmark/test/files/css/style.css?action=raw&ctype=text/css" rel="stylesheet">
+
  
−
  <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
−
  <!--[if lt IE 9]>
+
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
−
     <script src="j/Team:DTU-Denmark/test/files/js/html5shiv.js?action=raw&ctype=text/javascript"></script>
+
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
−
  <![endif]-->
+
    <style>
 +
.timeline {
 +
    list-style: none;
 +
    padding: 20px 0 20px;
 +
    position: relative;
 +
}
  
−
 
+
    .timeline:before {
−
<script type="text/javascript" src="/Team:DTU-Denmark/test/files/js/jquery.min.js?action=raw&ctype=text/javascript"></script>
+
        top: 0;
−
<script type="text/javascript" src="/Team:DTU-Denmark/test/files/js/bootstrap.min.js?action=raw&ctype=text/javascript"></script>
+
        bottom: 0;
−
<!--script type="text/javascript" src="/Team:DTU-Denmark/test/files/js/scripts.js?action=raw&ctype=text/javascript"--></script>
+
        position: absolute;
−
</head>
+
        content: " ";
−
<body>
+
        width: 3px;
−
<div class="container">
+
        background-color: #eeeeee;
−
<div class="row clearfix">
+
        left: 50%;
−
<div class="col-md-12 column">
+
        margin-left: -1.5px;
−
<div class="page-header">
+
    }
−
<h1>Modular Biosynthesis
+
−
<small>Technical University of Denmark</small>
+
−
</h1>
+
−
</div>
+
−
<nav class="navbar navbar-default" role="navigation">
+
−
<div class="navbar-header">
+
−
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+
−
                        <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="#"></a>
+
−
</div>
+
−
+
−
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
−
<ul class="nav navbar-nav">
+
−
                       
+
−
<li class="active" >
+
−
<a href="/Team:DTU-Denmark/test">Main</a>
+
−
</li>
+
−
                       
+
−
<li>
+
−
<a href="/Team:DTU-Denmark/test/Team">Team</a>
+
−
</li>
+
−
                       
+
−
<li>
+
−
<a href="/Team:DTU-Denmark/test/Collaboration">Collaboration</a>
+
−
</li>
+
−
                       
+
−
</ul>
+
−
</div>
+
−
+
−
</nav>
+
−
</div>
+
−
</div>
+
−
<div class="row clearfix">
+
−
       
+
−
+
−
+
  
 +
    .timeline > li {
 +
        margin-bottom: 20px;
 +
        position: relative;
 +
    }
  
 +
        .timeline > li:before,
 +
        .timeline > li:after {
 +
            content: " ";
 +
            display: table;
 +
        }
  
−
<section class="main" id="Section">
+
        .timeline > li:after {
 +
            clear: both;
 +
        }
 +
 
 +
        .timeline > li:before,
 +
        .timeline > li:after {
 +
            content: " ";
 +
            display: table;
 +
        }
 +
 
 +
        .timeline > li:after {
 +
            clear: both;
 +
        }
 +
 
 +
        .timeline > li > .timeline-panel {
 +
            width: 46%;
 +
            float: left;
 +
            border: 1px solid #d4d4d4;
 +
            border-radius: 2px;
 +
            padding: 20px;
 +
            position: relative;
 +
            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
 +
            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
 +
        }
 +
 
 +
            .timeline > li > .timeline-panel:before {
 +
                position: absolute;
 +
                top: 26px;
 +
                right: -15px;
 +
                display: inline-block;
 +
                border-top: 15px solid transparent;
 +
                border-left: 15px solid #ccc;
 +
                border-right: 0 solid #ccc;
 +
                border-bottom: 15px solid transparent;
 +
                content: " ";
 +
            }
 +
 
 +
            .timeline > li > .timeline-panel:after {
 +
                position: absolute;
 +
                top: 27px;
 +
                right: -14px;
 +
                display: inline-block;
 +
                border-top: 14px solid transparent;
 +
                border-left: 14px solid #fff;
 +
                border-right: 0 solid #fff;
 +
                border-bottom: 14px solid transparent;
 +
                content: " ";
 +
            }
 +
 
 +
        .timeline > li > .timeline-badge {
 +
            color: #fff;
 +
            width: 50px;
 +
            height: 50px;
 +
            line-height: 50px;
 +
            font-size: 1.4em;
 +
            text-align: center;
 +
            position: absolute;
 +
            top: 16px;
 +
            left: 50%;
 +
            margin-left: -25px;
 +
            background-color: #999999;
 +
            z-index: 100;
 +
            border-top-right-radius: 50%;
 +
            border-top-left-radius: 50%;
 +
            border-bottom-right-radius: 50%;
 +
            border-bottom-left-radius: 50%;
 +
        }
 +
 
 +
        .timeline > li.timeline-inverted > .timeline-panel {
 +
            float: right;
 +
        }
 +
 
 +
            .timeline > li.timeline-inverted > .timeline-panel:before {
 +
                border-left-width: 0;
 +
                border-right-width: 15px;
 +
                left: -15px;
 +
                right: auto;
 +
            }
 +
 
 +
            .timeline > li.timeline-inverted > .timeline-panel:after {
 +
                border-left-width: 0;
 +
                border-right-width: 14px;
 +
                left: -14px;
 +
                right: auto;
 +
            }
 +
 
 +
.timeline-badge.primary {
 +
    background-color: #2e6da4 !important;
 +
}
 +
 
 +
.timeline-badge.success {
 +
    background-color: #3f903f !important;
 +
}
 +
 
 +
.timeline-badge.warning {
 +
    background-color: #f0ad4e !important;
 +
}
 +
 
 +
.timeline-badge.danger {
 +
    background-color: #d9534f !important;
 +
}
 +
 
 +
.timeline-badge.info {
 +
    background-color: #5bc0de !important;
 +
}
 +
 
 +
.timeline-title {
 +
    margin-top: 0;
 +
    color: inherit;
 +
}
 +
 
 +
.timeline-body > p,
 +
.timeline-body > ul {
 +
    margin-bottom: 0;
 +
}
 +
 
 +
    .timeline-body > p + p {
 +
        margin-top: 5px;
 +
    }
 +
 
 +
@media (max-width: 767px) {
 +
    ul.timeline:before {
 +
        left: 40px;
 +
    }
 +
 
 +
    ul.timeline > li > .timeline-panel {
 +
        width: calc(100% - 90px);
 +
        width: -moz-calc(100% - 90px);
 +
        width: -webkit-calc(100% - 90px);
 +
    }
 +
 
 +
    ul.timeline > li > .timeline-badge {
 +
        left: 15px;
 +
        margin-left: 0;
 +
        top: 16px;
 +
    }
 +
 
 +
    ul.timeline > li > .timeline-panel {
 +
        float: right;
 +
    }
 +
 
 +
        ul.timeline > li > .timeline-panel:before {
 +
            border-left-width: 0;
 +
            border-right-width: 15px;
 +
            left: -15px;
 +
            right: auto;
 +
        }
 +
 
 +
        ul.timeline > li > .timeline-panel:after {
 +
            border-left-width: 0;
 +
            border-right-width: 14px;
 +
            left: -14px;
 +
            right: auto;
 +
        }
 +
}
 +
 
 +
    </style>
 +
</head>
 +
<body data-spy="scroll" data-target="#test">
 +
 
 +
<!-- Navigation -->
 +
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
 +
    <!-- Brand and toggle get grouped for better mobile display -->
 
     <div class="container">
 
     <div class="container">
−
         <div class="row">
+
         <div class="navbar-header">
−
             <div class="col-lg-12">
+
             <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
−
                 <h2>Section</h2>
+
                 <span class="sr-only">Toggle navigation</span>
−
                 <p>Writing some stuff</p>
+
                 <span class="icon-bar"></span>
 +
                <span class="icon-bar"></span>
 +
                <span class="icon-bar"></span>
 +
            </button>
 +
            <a class="navbar-brand" href="#">DTU</a>
 +
        </div>
  
 +
        <!-- Collect the nav links, forms, and other content for toggling -->
 +
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 +
            <ul class="nav navbar-nav">
 +
               
 +
                <li >
 +
                    <a class="wee" href="/">Home</a>
 +
                </li>
 +
               
 +
                <li >
 +
                    <a class="wee" href="/Team">Team</a>
 +
                </li>
 +
               
 +
                <li >
 +
                    <a class="wee" href="/Project">Project</a>
 +
                </li>
 +
               
 +
                <li >
 +
                    <a class="wee" href="/Collaborations">Collaborations</a>
 +
                </li>
 +
               
 +
                <li >
 +
                    <a class="wee" href="/Practices">Human Practices</a>
 +
                </li>
 +
               
 +
                <li >
 +
                    <a class="wee" href="/Journal">Journal</a>
 +
                </li>
 +
               
 +
            </ul>
 +
            <!--ul class="nav navbar-nav navbar-right">
 +
                <li><a href="#">Link</a></li>
 +
            </ul-->
 +
        </div><!-- /.navbar-collapse -->
 +
    </div>
 +
</nav>
 +
 +
 +
<nav class="navbar navbar-default extrabar hidden hidden-xs hidden-sm" id="test" data-spy="affix">
 +
    <div class="container">
 +
        <ul class="nav navbar-nav">
 +
            <li><a class="page-scroll" href="#Section">Section</a></li>
 +
        </ul>
 +
    </div>
 +
</nav>
 +
<section class="intro-header" style="background-image: url(/Team:DTU-Denmark/test/files/img/dna.jpg);">
 +
    <div class="intro-message">
 +
        <!--div class="igem-logo col-md-12">
 +
            <a href="https://igem.org" target="_blank">
 +
                <img src="</html>{{filepath:Igemlogo_officiallogo.png|nowiki}}<html>">
 +
            </a>
 +
        </div-->
 +
        <div class="container">
 +
            <div class="row intro-text">
 +
                <div class="col-md-12">
 +
                   
 +
                   
 +
                    <h1>Lorem ipsum dolor sit amet</h1>
 +
                    <h3>Technical University of Denmark</h3>
 +
                   
 +
                    <hr />
 +
                    <ul class="list-inline intro-social-buttons">
 +
                       
 +
                        <li>
 +
                            <a id="Section-submenu" class="btn btn-default btn-transparent btn-lg page-scroll" href="#Section">Section</a>
 +
                        </li>
 +
                       
 +
                        <!--li>
 +
                            <a href="https://twitter.com/SBootstrap" class="btn btn-default btn-transparent 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-transparent 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-transparent btn-lg"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
 +
                        </li-->
 +
                    </ul>
 +
                   
 +
                </div>
 +
            </div>
 +
            <div class="row">
 +
                <div class="col-md-12">
 +
                    Scroll down for more<br>
 +
                <a href="#Section" class="btn btn-circle page-scroll">
 +
                    <i class="fa fa-angle-double-down"></i>
 +
                </a>
 +
                </div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 
</section>
 
</section>
 +
<div class="container">
 +
 +
 +
<div class="row col-md-12 column">
 +
    <h2>
 +
        Section
 +
    </h2>
 +
    <p>Writing some stuff</p>
  
−
 
−
</div>
 
 
</div>
 
</div>
 +
 +
 +
</div>
 +
<footer class="container">
 +
    <div class="row">
 +
        <div class="col-md-2 col-md-offset-2">
 +
            <a href="http://www.dtu.dk" target="_blank">
 +
                <img src="</html>{{filepath:DTU-Denmark-DTUlogo.png|nowiki}}<html>" height="130px">
 +
            </a>
 +
        </div>
 +
        <div class="col-md-4">
 +
            <address>
 +
                <strong>Technical University of Denmark</strong><br>
 +
                Department of Systems Biology <br>
 +
                Søltofts Plads 221 <br>
 +
                2800 Kgs. Lyngby<br>
 +
                Denmark<br>
 +
                <abbr title="Phone">P:</abbr> +45 45 25 25 25<br>
 +
                <abbr title="Mail">M:</abbr> <a class="dtured" href="mailto:dtuigem14@gmail.com">dtuigem14@gmail.com</a>
 +
            </address>
 +
        </div>
 +
        <div class="col-md-2">
 +
            <a href="https://igem.org" style="float:left" target="_blank">
 +
                <img src="</html>{{filepath:Igemlogo_officiallogo.png|nowiki}}<html>" height="90px">
 +
            </a>
 +
        </div>
 +
    </div>
 +
</footer>
 +
<script>
 +
$(document).ready(function() {
 +
    $('body').scrollspy({target: '.extrabar',
 +
                        offset: 60})
 +
    // jQuery to collapse the navbar on scroll
 +
    $(window).scroll(function () {
 +
        if ($(".navbar").offset().top > $(".intro-header").height()) {
 +
            $(".navbar-fixed-top").addClass("top-nav-collapse");
 +
            $(".extrabar").removeClass("hidden");
 +
        } else {
 +
            $(".navbar-fixed-top").removeClass("top-nav-collapse");
 +
            $(".extrabar").addClass("hidden");
 +
        }
 +
    });
 +
    // jQuery for page scrolling feature - requires jQuery Easing plugin
 +
    $(function () {
 +
        $('a.page-scroll').bind('click', function (event) {
 +
            var $anchor = $(this);
 +
            $('html, body').stop().animate({
 +
                scrollTop: $($anchor.attr('href')).offset().top
 +
            }, 1500, 'easeInOutExpo');
 +
            event.preventDefault();
 +
        });
 +
    });
 +
});
 +
</script>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 17:43, 18 July 2015

Lorem ipsum dolor sit amet

Technical University of Denmark

Scroll down for more

Section

Writing some stuff

Technical University of Denmark
Department of Systems Biology
Søltofts Plads 221
2800 Kgs. Lyngby
Denmark
P: +45 45 25 25 25
M: dtuigem14@gmail.com