Difference between revisions of "Team:Sydney Australia/templates/Footer"

 
(35 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
<head>
 
−
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
−
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
−
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
 
−
<link href="https://fonts.googleapis.com/css?family=Quicksand:300,400|Roboto:400,400i" rel="stylesheet">
 
−
 
−
<script type="text/javascript" src="https://use.fontawesome.com/2967839f93.js"></script>
 
−
<meta name="viewport" content="width=device-width, initial-scale=1">
 
−
 
−
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 
−
<script>
 
−
$(window).on('load resize', function() {
 
−
  $('iframe[src*="open.spotify.com"]').each( function() {
 
−
    $(this).css('width', $(this).parent().css('width'));
 
−
    $(this).attr('src', $(this).attr('src'));
 
−
    $(this).removeClass('loaded');
 
−
   
 
−
    $(this).on('load', function(){
 
−
      $(this).addClass('loaded');
 
−
    });
 
−
  });
 
−
});
 
−
</script> 
 
 
<style>
 
<style>
 
#sideMenu, #top_title {display:none;}
 
#sideMenu, #top_title {display:none;}
Line 28: Line 5:
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
  
−
.footer {
+
.footer-distributed{
−
background:#e2e2e2;
+
background-color: #7f7f7f;
−
position:absolute;
+
−
height:200px;
+
−
margin-left:0;
+
−
margin-right:0;
+
−
bottom:0;
+
−
color:white;
+
−
width:100%;
+
 
box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
 
box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
 
  -moz-box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
 
  -moz-box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
 
  -webkit-box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
 
  -webkit-box-shadow: 0px 0px 15px rgba(33,62,83,0.7) inset;
−
}
+
box-sizing: border-box;
−
#disco, #uni, #spot {
+
width: 100%;
−
    top: 20%;
+
text-align: left;
−
    bottom: 20%;
+
padding: 15px 10px;
−
    left: 0;
+
margin-top: 0px;
−
    right: 0;
+
        margin-bottom:-200px;
−
    display: flex; /* add */
+
        bottom:0;
−
    justify-content: center; /* add to align horizontal */
+
        left:0;
−
    align-items: center; /* add to align vertical */
+
        display:inline-block;
 +
position:absolute;
 
}
 
}
 +
.fa {color:white}
  
−
.fa {color:#3e3f3f}
+
.footer-distributed .footer-right{
−
#media_links {
+
float: right;
−
left:5px;
+
margin-top: 6px;
−
right:5px;
+
max-width: 400px;
−
    display: flex;
+
}
−
    justify-content: space-between;
+
 
−
    top:50%
+
.images {
−
    }
+
            margin: 2.5px;
 +
            width: 200px;
 +
        }
 +
 
 +
@media (max-width: 100px) {
 +
 
 +
.footer-distributed .footer-left,
 +
.footer-distributed .footer-right{
 +
text-align: center;
 +
}
 +
 
 +
.footer-distributed .footer-right{
 +
float: none;
 +
margin: 0 auto 20px;
 +
}
 +
 
 +
.footer-distributed .footer-left p.footer-links{
 +
line-height: 1.8;
 +
}
 +
}
 +
@media (max-width: 60em) {
 +
.footer-left {
 +
display: none;
 +
}
 
</style>
 
</style>
−
</head>
+
 
−
<body>
+
<footer class="footer-distributed">
−
<footer class="footer footer-distributed row">
+
<div class="footer-right">
−
<div class="col-xs-2" id="disco">
+
−
<img class=" img-center" src="https://static.igem.org/mediawiki/2017/f/fe/T--Sydney_Australia--footer_logo.png" style="width:100%; max-height:160px;vertical-align:middle"/>
+
−
</div>
+
−
<div class="col-xs-3" id="uni" >
+
−
<img id="uni_logo" class="img-center" src="https://static.igem.org/mediawiki/2016/9/96/T--Sydney_Australia--newusydlogo.png" style="width:100%;vertical-align:middle"/>
+
−
</div>
+
−
<div class="col-xs-3" id="media_links" >
+
 
<a target="_blank" href="mailto:igem.usyd.17@gmail.com"><i class="fa fa-envelope-o fa-2x"></i></a>  
 
<a target="_blank" href="mailto:igem.usyd.17@gmail.com"><i class="fa fa-envelope-o fa-2x"></i></a>  
 
<a target="_blank" href="https://www.instagram.com/igem_usyd/"><i class="fa fa-instagram fa-2x"></i></a>  
 
<a target="_blank" href="https://www.instagram.com/igem_usyd/"><i class="fa fa-instagram fa-2x"></i></a>  
 
<a target="_blank" href="https://www.facebook.com/iGEM.usyd"><i class="fa fa-facebook fa-2x"></i></a>  
 
<a target="_blank" href="https://www.facebook.com/iGEM.usyd"><i class="fa fa-facebook fa-2x"></i></a>  
 
  <a target="_blank" href="https://twitter.com/igem_usyd"><i class="fa fa-twitter fa-2x"></i></a>  
 
  <a target="_blank" href="https://twitter.com/igem_usyd"><i class="fa fa-twitter fa-2x"></i></a>  
−
 
+
−
</div>
+
−
<div class="col-xs-3" id="spot">
+
 
<iframe src="https://open.spotify.com/embed/user/1236373175/playlist/0pkcR2DG7l6KRx6fHZcxbc" frameborder="0" allowtransparency="true"></iframe>
 
<iframe src="https://open.spotify.com/embed/user/1236373175/playlist/0pkcR2DG7l6KRx6fHZcxbc" frameborder="0" allowtransparency="true"></iframe>
−
</div>
+
 
−
<div class="col-xs-1"></div>
+
</div>
−
</footer>
+
<div class="footer-left">
−
</body>
+
<img class="images" src="https://static.igem.org/mediawiki/2017/f/fe/T--Sydney_Australia--footer_logo.png"/>
 +
<img id="uni_logo" class="images" src="https://static.igem.org/mediawiki/2016/9/96/T--Sydney_Australia--newusydlogo.png"/>
 +
                        <img id="sponsors" class="images" src="https://static.igem.org/mediawiki/2017/5/52/T--Sydney_Australia--footer_sponsors.png"/>
 +
</div>
 +
</footer>
 
</html>
 
</html>

Latest revision as of 02:05, 2 November 2017