Difference between revisions of "Template:Manchester/Footer"

Line 1: Line 1:
 
<html>
 
<html>
−
<style>
+
<footer>
−
#logos {
+
<!-- Add icon library -->
−
  padding= 150%;
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
−
}
+
 
−
</style>
+
<a href="https://www.facebook.com/igem.mancheester.3" class="fa fa-facebook"></a>
 +
<a href="https://twitter.com/UoM_iGem_2018" class="fa fa-twitter"></a>
 +
 
 +
<!--imgages -->
 +
 
 
<div id=logos>
 
<div id=logos>
 
<footer style= "background-color:#ffffff">
 
<footer style= "background-color:#ffffff">
Line 16: Line 20:
 
<a href="https://www.manchester.ac.uk/"><img src="https://2018.igem.org/wiki/image/T--Manchester--UoMsponsorlogo.PNG" width="180" height="auto"></a>
 
<a href="https://www.manchester.ac.uk/"><img src="https://2018.igem.org/wiki/image/T--Manchester--UoMsponsorlogo.PNG" width="180" height="auto"></a>
 
</div>
 
</div>
 +
 +
<style>
 +
/* Style all font awesome icons */
 +
.fa {
 +
    padding: 20px;
 +
    font-size: 30px;
 +
    width: 50px;
 +
    text-align: center;
 +
    text-decoration: none;
 +
}
 +
 +
/* Add a hover effect if you want */
 +
.fa:hover {
 +
    opacity: 0.7;
 +
}
 +
 +
/* Set a specific color for each brand */
 +
 +
/* Facebook */
 +
.fa-facebook {
 +
    background: #3B5998;
 +
    color: white;
 +
}
 +
 +
/* Twitter */
 +
.fa-twitter {
 +
    background: #55ACEE;
 +
    color: white;
 +
}
 +
 +
#logos {
 +
  padding= 150%;
 +
}
 +
</style>
 
</footer>
 
</footer>
 
</html>
 
</html>

Revision as of 13:09, 30 August 2018