Difference between revisions of "Team:Glasgow/Practices"

(Prototype team page)
 
Line 1: Line 1:
−
{{Glasgow}}
+
<!DOCTYPE html>
−
<html>
+
<html lang="en">
 +
  <head>
 +
    <meta charset="utf-8">
 +
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1">
 +
    <meta name="description" content="">
 +
    <meta name="author" content="">
 +
    <link rel="icon" href="../../favicon.ico">
  
−
<h2> Human Practices </h2>
+
    <title>IGEM Glasgow 2015 funding</title>
  
−
<p>iGEM teams are unique and leading the field because they "go beyond the lab" to imagine their projects in a social/environmental context, to better understand issues that might influence the design and use of their technologies.</p>
+
    <!-- Bootstrap core CSS
−
<p>Teams work with students and advisors from the humanities and social sciences to explore topics concerning ethical, legal, social, economic, safety or security issues related to their work. Consideration of these Human Practices is crucial for building safe and sustainable projects that serve the public interest. </p>
+
    <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
−
<p>For more information, please see the <a href="https://2015.igem.org/Practices_Hub">Practices Hub</a>.</p>
+
   
 +
  -->
 +
  <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
  
−
<div class="highlightBox">
+
    <!-- Custom styles for this template
−
<h4>Note</h4>
+
    <link href="http://getbootstrap.com/examples/jumbotron/jumbotron.css" rel="stylesheet">-->
−
<p>You must fill out this page in order to be considered for all <a href="https://2015.igem.org/Judging/Awards">awards</a> for Human Practices:</p>
+
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet" />
−
<ul>
+
    <style>
−
<li>Human Practices silver medal criterion</li>
+
    body {
−
<li>Human Practices gold medal criterion</li>
+
padding-top: 0px;
−
<li>Best Integrated Human Practices award</li>
+
padding-bottom: 0px;
−
<li>Best Education and Public Engagement award</li>
+
}
−
</ul>
+
  .navbar {
−
</div>
+
    margin-bottom: 0px !important;
 +
    border-radius: 0px !important;
 +
  }
 +
  .navbar-inverse .navbar-brand, .navbar-brand:hover {
 +
    color: white;
 +
  }
 +
    </style>
  
 +
    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
 +
    <!--[if lt IE 9]><script src="view-source:http://getbootstrap.com/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
 +
    <script src="http://getbootstrap.com/assets/js/ie-emulation-modes-warning.js"></script>
  
−
<h5>Some Human Practices topic areas </h5>
+
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
−
<ul>
+
    <script src="http://getbootstrap.com/assets/js/ie10-viewport-bug-workaround.js"></script>
−
<li>Philosophy</li>
+
−
<li>Public Engagement / Dialogue</li>
+
−
<li>Education</li>
+
−
<li>Product Design</li>
+
−
<li>Scale-Up and Deployment Issues</li>
+
−
<li>Environmental Impact</li>
+
−
<li>Ethics</li>
+
−
<li>Safety</li>
+
−
<li>Security</li>
+
−
<li>Public Policy</li>
+
−
<li>Law and Regulation</li>
+
−
<li>Risk Assessment</li>
+
−
</ul>
+
  
−
<h5>What should we write about on this page?</h5>
+
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
−
<p>On this page, you should write about the Human Practices topics you considered in your project, and document any special activities you did (such as visiting experts, talking to lawmakers, or doing public engagement).</p>
+
    <!--[if lt IE 9]>
 +
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 +
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
 +
    <![endif]-->
 +
  </head>
  
 +
 
 +
 
 +
<!----------begin-------->
 +
  <body>
 +
    <script>
 +
    $(".progress-bar").css("width",'80%')
 +
    </script>
  
−
<h5>Inspiration</h5>
+
<div class="navbar navbar-inverse" role="navigation">
−
<p>Read what other teams have done:</p>
+
    <div class="container">
−
<ul>
+
      <div class="navbar-header">
−
<li><a href="https://2014.igem.org/Team:Dundee/policypractice/experts">2014 Dundee </a></li>
+
        <a class="navbar-brand" style="text-align: center;">IGEM Glasgow funding</a>
−
<li><a href="https://2014.igem.org/Team:UC_Davis/Policy_Practices_Overview">2014 UC Davis </a></li>
+
      </div>
−
<li><a href="https://2013.igem.org/Team:Manchester/HumanPractices">2013 Manchester </a></li>
+
    </div>
−
<li><a href="https://2013.igem.org/Team:Cornell/outreach">2013 Cornell </a></li>
+
  </div>
−
</ul>
+
  
−
<h3>Integrated Human Practices</h3>
 
  
−
<p>Do you want to be considered for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Best Integrated Human Practices award</a>? Make it easy for the judges to find any wiki content that is relevant to this prize. Highlight this content with a header or separate section.</p>
+
<div class='container' style="text-align:center;font-family: sans-serif;">
 +
<p style="font-size: 60px;">Collected miles: <br/></p>
  
−
<h3>Education and Public Engagement</h3>
+
<div class="row">
 +
<div class="col-sm-3">
 +
    <img src="{% static 'img/walking.png' %}"/>
 +
<h3>Walking</h3>
 +
<h4>Collected miles:</h4>
 +
<hr/>
 +
<span style='text-align:left !important;'>
 +
</span>
 +
<hr/>
 +
</div>
 +
<div class="col-sm-3">
 +
    <img src="{% static 'img/swimming.png' %}"/>
 +
<h3>Swimming</h3>
 +
<h4>Collected miles:</h4>
 +
<hr/>
 +
<span style='text-align:left !important;'>
 +
</span>
 +
<hr/>
 +
</div>
 +
<div class="col-sm-3">
 +
    <img src="Glasglow/2015-Glasgow-cycling.png"/>
 +
<h3>Cycling</h3>
 +
<h4>Collected miles</h4>
 +
<hr/>
 +
<span style='text-align:left !important;'>
 +
</span>
 +
<hr/>
 +
</div>
 +
<div class="col-sm-3">
 +
    <img src="{% static 'img/running.png' %}"/>
 +
<h3>Running</h3>
 +
<h4>Collected miles:</h4>
 +
<hr/>
 +
<span style='text-align:left !important;'>
 +
</span>
 +
<hr/>
 +
</div>
 +
</div>
 +
</div>
  
−
<p>Do you want to be considered for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Best Education and Public Outreach award</a>? Make it easy for the judges to find any wiki content that is relevant to this prize. Highlight this content with a header or separate section.</p>
 
  
 +
<style>
 +
#p-bar{
 +
  height:60px;
 +
}
 +
</style> 
 +
<div class="progress" id="p-bar">
 +
  <div class="progress-bar" id="count25" role="progressbar" style="width:10%;background-color: red;">
 +
    <span class="sr-only">10%</span>
 +
    <div style="margin-top: 20px;font-size: 20px;">10%</div>
 +
  </div>
 +
  <div class="progress-bar" id="count25" role="progressbar" style="width:20%;background-color: blue;">
 +
    <span class="sr-only">20%</span>
 +
    <div style="margin-top: 20px;font-size: 20px;">20%</div>
 +
  </div>
 +
  <div class="progress-bar" id="count25" role="progressbar" style="width:10%;background-color: green;">
 +
    <span class="sr-only">10%</span>
 +
    <div style="margin-top: 20px;font-size: 20px;">10%</div>
 +
  </div>
 +
  <div class="progress-bar" id="count25" role="progressbar" style="width:10%;background-color: yellow;color:black;">
 +
    <span class="sr-only">10%</span>
 +
    <div style="margin-top: 20px;font-size: 20px;">10%</div>
 +
  </div>
 
</div>
 
</div>
 +
 +
 +
 +
 +
 +
 +
<div class="body">
 +
  <div class="content">
 +
    <div class="retro"></div>
 +
    <div class="display"></div>
 +
    <div class="base"></div>
 +
    <div class="base-bottom"></div>
 +
    <div class="open"></div>
 +
  </div>
 +
</div>
 +
<style>
 +
.body {
 +
  width: 100%;
 +
  text-align: center;
 +
}
 +
 +
 +
.content {
 +
  display: inline-block;
 +
  height: 400px;
 +
width: 400px;
 +
margin: 20px auto;
 +
   
 +
}
 +
 +
.retro{
 +
  background : #333333;
 +
  position : absolute ;
 +
  margin: 50px 58px;
 +
  width : 284px;
 +
  height : 187px;
 +
   
 +
-webkit-border-top-left-radius: 15px;
 +
-webkit-border-top-right-radius: 15px;
 +
-moz-border-radius-topleft: 15px;
 +
-moz-border-radius-topright: 15px;
 +
border-top-left-radius: 15px;
 +
border-top-right-radius: 15px;
 +
 
 +
}
 +
 +
 +
.display {
 +
  background : #EDEDEB;
 +
  background : rgba(237, 237, 235, 1);
 +
  display: block;
 +
position: absolute;
 +
  margin: 65px 71px;
 +
  width : 259px;
 +
  height : 163px;
 +
}
 +
 +
.base {
 +
  background : #D8D8D8;
 +
  background : rgba(216, 216, 216, 1);
 +
  display: block;
 +
  margin: 237px auto;
 +
  width : 380px;
 +
  height : 11px;
 +
}
 +
 +
.base-bottom {
 +
  background : #ABABAB;
 +
  display: block;
 +
  margin: -237px auto;
 +
  width : 378px;
 +
  height : 5px;
 +
  -webkit-border-bottom-right-radius:15px;
 +
  -webkit-border-bottom-left-radius: 15px;
 +
  -moz-border-radius-bottomright: 15px;
 +
  -moz-border-radius-bottomleft: 15px;
 +
  border-bottom-right-radius: 15px;
 +
  border-bottom-left-radius: 15px;
 +
}
 +
 +
 +
.open {
 +
  background : #828181;
 +
 
 +
  position : absolute ;
 +
  display: block;
 +
  margin: 221px 170px;
 +
  width : 52px;
 +
  height : 5px;
 +
-webkit-border-bottom-right-radius: 10px;
 +
-webkit-border-bottom-left-radius: 10px;
 +
-moz-border-radius-bottomright: 10px;
 +
-moz-border-radius-bottomleft: 10px;
 +
border-bottom-right-radius: 10px;
 +
border-bottom-left-radius: 10px;
 +
}
 +
</style>
 +
     
 +
    <div class="container">
 +
      <hr>
 +
      <footer>
 +
        <p>&copy; IGEM Glasgow 2015</p>
 +
      </footer>
 +
    </div> <!-- /container -->
 +
    <!-- Bootstrap core JavaScript
 +
    ================================================== -->
 +
    <!-- Placed at the end of the document so the pages load faster -->
 +
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 +
    <script src="{% static 'js/bootstrap.min.js' %}"></script>
 +
  </body>
 
</html>
 
</html>

Revision as of 11:19, 22 July 2015

<!DOCTYPE html> IGEM Glasgow 2015 funding

Collected miles:

Walking

Collected miles:

Swimming

Collected miles:

Cycling

Collected miles

Running

Collected miles:

10%
10%
20%
20%
10%
10%
10%
10%

© IGEM Glasgow 2015