Difference between revisions of "Team:UNC-Asheville"

 
(186 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
{{UNC-Asheville/CSS2}} {{UNC-Asheville/Bootstrap}} {{UNC-Asheville/BootstrapJS}}
+
{{:Team:UNC-Asheville/Templates/NavBar}}
−
<html lang="en">
+
  
−
<head>
+
<html>
−
    <meta charset="UTF-8">
+
<head>
−
    <title>About Us</title>
+
  <title>
−
    <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
+
  iGEM UNC-Asheville
−
    <!--
+
  </title>
−
    <link rel="stylesheet" href="https://2017.igem.org/Template:UNC-Asheville/Bootstrap">
+
  <meta name="viewport" content="width=device-width, initial-scale=1" />
−
    <link rel="stylesheet" href="https://2017.igem.org/Template:UNC-Asheville/JqueryJS">
+
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
−
    <script src="https://2017.igem.org/Template:UNC-Asheville/BootstrapJS"></script>
+
  <meta charset="utf-8" />
−
-->
+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
 +
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
 +
 
 +
 
 
<style>
 
<style>
−
    .bg {
+
.jumbotron {
−
        background: url('TopDownEdit.JPG') no-repeat center center;
+
    background-image: url("https://static.igem.org/mediawiki/2017/e/ef/UNC-Asheville-TCEPlaceHolder.jpg");
−
        position: fixed;
+
    margin-bottom: 0;
−
        width: 100%;
+
    min-height: 800px;
−
        height: 550px; /*same height as jumbotron */
+
    background-repeat: no-repeat;
−
        top:0;
+
    background-position: fixed;
−
        left:0;
+
    -webkit-background-size: cover;
−
        z-index: -1;
+
    background-size: cover;
−
     }
+
    padding: 50em inherit;
 +
    background-color: hsla(0,0%,100%,0.50);
 +
    background-blend-mode: overlay;
 +
    background-repeat: no-repeat;
 +
     padding-left: 30px;
 +
    padding-right: 30px;
  
−
    .jumbotron {
+
}
−
        height: 550px;
+
−
        color: white;
+
−
        text-shadow: #444 0 1px 1px;
+
−
        background:transparent;
+
−
    }
+
  
 +
div.jumbotron{
 +
  padding-top:250px;
 +
}
  
−
    .location-name, .building-name {
+
.jumbotron h1{
−
        text-align: center;
+
    color: black;
−
        color:black;
+
    font-size: 100px;
−
        font-size: 60px;
+
    font-family: 'Raleway', sans-serif;
−
        text-shadow: 2px 2px black;
+
    letter-spacing: 10px;
−
    }
+
    text-shadow: 0 0 2px #fff;
 +
}
  
 +
.jumbotron p{
 +
    color: black;
 +
    font-size: 30px;
 +
    font-family: 'Raleway', sans-serif;
 +
    font-weight: Semi-Bold
 +
    letter-spacing: 10px;
 +
    text-shadow: 0 0 2px #fff;
 +
}
  
−
    .menu-links {
+
.jumbotron h2{
−
        display: block;
+
    color: black;
−
        text-align: center;
+
    font-size: 50px;
−
     }
+
     font-family: 'Playfair Display', serif;
 +
    font-family: 'Raleway', sans-serif;
 +
    font-weight: Semi-Bold
 +
    letter-spacing: 10px;
 +
    text-shadow: 0 0 2px #fff;
 +
}
  
−
</style>
 
  
−
</head>
 
−
<body>
 
−
<nav class="navbar navbar-default" role="navigation">
 
−
    <div class="container-fluid">
 
−
        <!-- Brand and toggle get grouped for better mobile display -->
 
−
        <div class="navbar-header">
 
−
            <button type="button" class="navbar-toggle collapsed" 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="#">ATG</a>
 
−
        </div>
 
  
−
        <!-- Collect the nav links, forms, and other content for toggling -->
+
.row h1{
−
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
    color: black;
−
            <ul class="nav navbar-nav">
+
    font-size: 45px;
−
                <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
+
    font-family: 'Raleway', sans-serif;
−
                <li><a href="#">Link</a></li>
+
    text-shadow: 2px 2px white;
−
                <li class="dropdown">
+
     letter-spacing: 4px;
−
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
+
}
−
                    <ul class="dropdown-menu" role="menu">
+
−
                        <li><a href="#">Action</a></li>
+
−
                        <li><a href="#">Another action</a></li>
+
−
                        <li><a href="#">Something else here</a></li>
+
−
                        <li class="divider"></li>
+
−
                        <li><a href="#">Separated link</a></li>
+
−
                        <li class="divider"></li>
+
−
                        <li><a href="#">One more separated link</a></li>
+
−
                    </ul>
+
−
                </li>
+
−
            </ul>
+
−
            <form class="navbar-form navbar-left" role="search">
+
−
                <div class="form-group">
+
−
                    <input type="text" class="form-control" placeholder="Search">
+
−
                </div>
+
−
                <button type="submit" class="btn btn-default">Submit</button>
+
−
            </form>
+
−
            <ul class="nav navbar-nav navbar-right">
+
−
                <li><a href="#">Link</a></li>
+
−
                <li class="dropdown">
+
−
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
+
−
                    <ul class="dropdown-menu" role="menu">
+
−
                        <li><a href="#">Action</a></li>
+
−
                        <li><a href="#">Another action</a></li>
+
−
                        <li><a href="#">Something else here</a></li>
+
−
                        <li class="divider"></li>
+
−
                        <li><a href="#">Separated link</a></li>
+
−
                    </ul>
+
−
                </li>
+
−
            </ul>
+
−
        </div><!-- /.navbar-collapse -->
+
−
     </div><!-- /.container-fluid -->
+
−
</nav>
+
  
−
<div class="bg"></div>
+
.row h2{
−
<div class="jumbotron">
+
     color: black;
−
     <p class="location-name"> T C E a s y</p>
+
     font-size: 30px;
−
     <p class="building-name">ECE Engineering Building</p>
+
     font-family: 'Raleway', sans-serif;
−
     <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Online Editing</a></div>
+
     text-shadow: 2px 2px white;
−
     <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Building FCA Query</a></div>
+
     letter-spacing: 2px;
−
     <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Chart FCA Query</a></div>
+
     margin-top: -15px
−
     <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Facility Document Management CP</a></div>
+
     font-weight: bold;
−
     <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Facility Document Management Query</a></div>
+
}
−
</div>
+
  
−
<div class="container">
+
.row blockquote{
−
     <div class="row">
+
     color: black;
−
        <h2>Page Content</h2>
+
    font-size: 20px;
−
        blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
+
    font-family: 'Raleway', sans-serif;
−
        blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
+
     border-left: 1px solid grey;
−
     </div>
+
     border-right: 1px solid grey;
−
     <hr>
+
     border-bottom: 1px solid grey;
−
     <div class="row">
+
     border-top: 1px solid grey;
−
        <h2>Page Content</h2>
+
−
        blah blah blah blah blah blah blah blah blah blah blah
+
−
        blah blah blah blah blah blah blah blah blah blah blah
+
−
        blah blah blah blah blah blah blah blah blah blah blah
+
−
     </div>
+
−
</div>
+
  
−
<hr>
+
}
  
−
<div class="container">
+
.container-fluid blockquote{
−
     <div class="row">
+
     color: black;
−
        <div class="col-md-12 text-center"><p>The End.</p></div>
+
    font-size: 30px;
−
     </div>
+
    font-family: 'Raleway', sans-serif;
−
</div>
+
     border-left: 1px solid grey;
 +
    border-right: 1px solid grey;
 +
    border-bottom: 1px solid grey;
 +
    border-top: 1px solid grey;
 +
letter-spacing: 2px;
  
−
<script>
+
}
−
    // sandbox disable popups
+
−
    if (window.self !== window.top && window.name!="view1") {;
+
−
        window.alert = function(){/*disable alert*/};
+
−
        window.confirm = function(){/*disable confirm*/};
+
−
        window.prompt = function(){/*disable prompt*/};
+
−
        window.open = function(){/*disable open*/};
+
−
    }
+
  
−
    // prevent href=# click jump
+
.header h1{
−
    document.addEventListener("DOMContentLoaded", function() {
+
  color: black;
−
        var links = document.getElementsByTagName("A");
+
  font-size: 60px;
−
        for(var i=0; i < links.length; i++) {
+
  font-family: 'Raleway', sans-serif;  
−
            if(links[i].href.indexOf('#')!=-1) {
+
}
−
                links[i].addEventListener("click", function(e) {
+
−
                    console.debug("prevent href=# click");
+
−
                    if (this.hash) {
+
−
                        if (this.hash=="#") {
+
−
                            e.preventDefault();
+
−
                            return false;
+
−
                        }
+
−
                        else {
+
−
                            /*
+
−
                            var el = document.getElementById(this.hash.replace(/#/, ""));
+
−
                            if (el) {
+
−
                            el.scrollIntoView(true);
+
−
                            }
+
−
                            */
+
−
                        }
+
−
                    }
+
−
                    return false;
+
−
                })
+
−
            }
+
−
        }
+
−
    }, false);
+
  
−
</script>
+
body {
 +
    background-color: #edece6;
 +
}
 +
.img-fluid {
 +
  width: 100%;
 +
}
 +
img {
 +
  display: block;
 +
  max-width: 90%;
 +
  height: auto;
 +
}
  
−
<!--scripts loaded here-->
+
body {
 +
    background-color: #edece6;
 +
}
  
−
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
+
</style>
−
<script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js"></script>
+
−
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
+
  
 +
</head>
 +
  
−
<script src="https://rawgit.com/bassjobsen/affix/master/assets/js/affix.js"></script>
+
<body>
 +
<div class="jumbotron center">
 +
  <div class="container center">
 +
        <h1>TCEasy</h1>
 +
        <p>Degradation of Tricholoretheylene through a novel metabolic pathway.<p>
 +
        <hr>
 +
        <h2>Toxic waste has seeped into our backyard.<br> We're trying to fix it.</h2>
  
−
<script>
+
  </div>
−
    $('.navbar').affix({
+
</div>
−
        offset:{
+
−
            top: $('#header').outerHeight(),
+
−
            bottom: $('#header').outerHeight() - 200
+
−
        }
+
−
    });
+
−
 
+
−
    $('#sidemenu').affix({
+
−
        offset:{
+
−
            top: $('#header').outerHeight() - 20,
+
−
            bottom: $('footer').outerHeight() + 50
+
−
        }
+
−
    });
+
−
 
+
−
</script>
+
−
 
+
−
<script>
+
−
    var jumboHeight = $('.jumbotron').outerHeight();
+
−
    function parallax(){
+
−
        var scrolled = $(window).scrollTop();
+
−
        $('.bg').css('height', (jumboHeight-scrolled) + 'px');
+
−
    }
+
−
 
+
−
    $(window).scroll(function(e){
+
−
        parallax();
+
−
    });
+
−
</script>
+
−
 
+
−
</body>
+
−
</html>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
</html>
+

Latest revision as of 02:17, 2 November 2017

About Us

iGEM UNC-Asheville

TCEasy

Degradation of Tricholoretheylene through a novel metabolic pathway.

Toxic waste has seeped into our backyard.
We're trying to fix it.