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

Line 1: Line 1:
<html>
+
<!DOCTYPE html>
<head lang="en">
+
<html lang="en">
    <meta charset="UTF-8">
+
<head>
    <title></title>
+
  <meta charset="utf-8">
 +
  <title>Team</title>
 +
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
  <meta name="description" content="">
 +
  <meta name="author" content="">
  
    <link rel="stylesheet" href="/Team:DTU-Denmark/test/bootstrap.css?action=raw&ctype=text/css" type="text/css" />
+
<!--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/wiki.css?action=raw&ctype=text/css" type="text/css" />
+
<!--append ‘#!watch’ to the browser URL, then refresh the page. -->
 +
 +
<link href="/Team:DTU-Denmark/test/css/bootstrap.css" rel="stylesheet">
 +
<!--link href="/Team:DTU-Denmark/test/css/style.css" rel="stylesheet"-->
  
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
+
  <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
+
  <!--[if lt IE 9]>
     <script src="/Team:DTU-Denmark/test/bootstrap.js?action=raw&amp;ctype=text/js"></script>
+
     <script src="j/Team:DTU-Denmark/test/js/html5shiv.js"></script>
    <style>
+
  <![endif]-->
.timeline {
+
    list-style: none;
+
    padding: 20px 0 20px;
+
    position: relative;
+
}
+
  
    .timeline:before {
+
 
        top: 0;
+
<script type="text/javascript" src="/Team:DTU-Denmark/test/js/jquery.min.js"></script>
        bottom: 0;
+
<script type="text/javascript" src="/Team:DTU-Denmark/test/js/bootstrap.min.js"></script>
        position: absolute;
+
<!--script type="text/javascript" src="/Team:DTU-Denmark/test/js/scripts.js"--></script>
        content: " ";
+
        width: 3px;
+
        background-color: #eeeeee;
+
        left: 50%;
+
        margin-left: -1.5px;
+
    }
+
 
+
    .timeline > li {
+
        margin-bottom: 20px;
+
        position: relative;
+
    }
+
 
+
        .timeline > li:before,
+
        .timeline > li:after {
+
            content: " ";
+
            display: table;
+
        }
+
 
+
        .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>
 
</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="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="#">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="/Team:DTU-Denmark/test">Main</a></li><li ><a class="wee" href="/Team:DTU-Denmark/test/Team">Team</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">
+
<body>
    <div class="container">
+
<div class="container">
        <ul class="nav navbar-nav">
+
<div class="row clearfix">
            <li><a class="page-scroll" href="#Members">Members</a></li>
+
<div class="col-md-12 column">
        </ul>
+
<div class="page-header">
    </div>
+
<h1>
</nav>
+
Modular Biosynthesis <small>Technical University of Denmark</small>
<section class="intro-header" style="background-image: url(/static/);">
+
</h1>
    <div class="intro-message">
+
</div>
        <!--div class="igem-logo col-md-12">
+
<nav class="navbar navbar-default" role="navigation">
            <a href="https://igem.org" target="_blank">
+
<div class="navbar-header">
                <img src="/img/Igemlogo_officiallogo.png">
+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
            </a>
+
                        <span class="sr-only">Toggle navigation</span><span class="icon-bar"></span>
        </div-->
+
                        <span class="icon-bar"></span>
        <div class="container">
+
                        <span class="icon-bar"></span>
            <div class="row intro-text">
+
                    </button>
                <div class="col-md-12">
+
                     <a class="navbar-brand" href="#">DTU</a>
                   
+
</div>
                   
+
                     <h1>Team</h1>
+
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                   
+
<ul class="nav navbar-nav">
                    <hr />
+
                    <ul class="list-inline intro-social-buttons">
+
 
                          
 
                          
                        <li>
+
<li>
                            <a id="Members-submenu" class="btn btn-default btn-transparent btn-lg page-scroll" href="#Members">Members</a>
+
<a href="/">Main</a>
                        </li>
+
</li>
 
                          
 
                          
                        <!--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>
+
<a href="/Team">Team</a>
                        </li>
+
</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>
+
</ul>
                        </li>
+
</div>
                        <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>
+
</nav>
                        </li-->
+
</div>
                    </ul>
+
</div>
                   
+
<div class="row clearfix">
                </div>
+
       
 +
 +
<div class="col-md-12 column">
 +
    <h2>
 +
        Members
 +
    </h2>
 +
   
 +
   
 +
       
 +
        <div class="row">
 +
            <div class="col-md-12">
 +
            <h3>Member1</h3>
 
             </div>
 
             </div>
             <div class="row">
+
             <div class="col-md-2">
                <div class="col-md-12">
+
                 <img src="/Team:DTU-Denmark/test/img/default-avatar.png" class="img-circle" style="width: 100px;">
                    Scroll down for more<br>
+
                 <a href="#Members" class="btn btn-circle page-scroll">
+
                    <i class="fa fa-angle-double-down"></i>
+
                </a>
+
                </div>
+
 
             </div>
 
             </div>
        </div>
+
            <div class="col-md-10">
    </div>
+
                <p>Hi</p>
</section>
+
  
 +
<p>I am Member 1.</p>
  
 +
<p>I can write&nbsp;<strong>bold</strong>&nbsp;text</p>
  
 
+
            </div>
 
+
        </div>
 
+
       
 
+
   
<section class="main" id="Members">
+
       
    <div class="container">
+
 
         <div class="row">
 
         <div class="row">
 
             <div class="col-md-12">
 
             <div class="col-md-12">
                <h2>Members</h2>
+
            <h3 class="text-right">Member 2</h3>
               
+
               
+
 
             </div>
 
             </div>
        </div>
+
            <div class="col-md-10">
    </div>
+
                <p>Hi there</p>
</section>
+
  
 +
<p>My name is Member 2</p>
  
 
+
            </div>
<footer class="container">
+
            <div class="col-md-2">
    <div class="row">
+
                 <img src="/Team:DTU-Denmark/test/img/default-avatar.png" class="img-circle" style="width: 100px;">
        <div class="col-md-2 col-md-offset-2">
+
             </div>
            <a href="http://www.dtu.dk" target="_blank">
+
                 <img src="https://static.igem.org/mediawiki/2014/d/de/DTU-Denmark-DTUlogo.png" 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="/img/igemlogo_officiallogo.png" height="90px">
+
             </a>
+
 
         </div>
 
         </div>
     </div>
+
       
</footer>
+
      
<script>
+
</div>
$(document).ready(function() {
+
    $('body').scrollspy({target: '.extrabar',
+
</div>
                        offset: 60})
+
</div>
    // 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 16:40, 23 April 2015

<!DOCTYPE html> Team

Members

Member1

Hi

I am Member 1.

I can write bold text

Member 2

Hi there

My name is Member 2