Team:UCLondon/Templates/links-footer

From 2012e.igem.org

(Difference between revisions)
 
(34 intermediate revisions not shown)
Line 2: Line 2:
<div id="footer-links">
<div id="footer-links">
 +
      <div id="foot-icon1"></div>
 +
                <div class="vertical">
<p class="left-footer">Morph Bioinformatics</p>
<p class="left-footer">Morph Bioinformatics</p>
<ul class="right-footer">
<ul class="right-footer">
-
<li><a href="#">MediaWiki</a><ul class='mediawiki-footer'></ul></li>
 
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Downloads</a></li>
<li><a href="#">Downloads</a></li>
Line 10: Line 11:
<li><a href="#">Job Opportunities</a></li>
<li><a href="#">Job Opportunities</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Contact Us</a></li>
 +
                                                <li><a href="#">MediaWiki</a><ul class='mediawiki-footer'><li>item1</li></ul></li>
</ul>
</ul>
 +
                  </div>
 +
        <div id="foot-icon2"></div>
</div>
</div>
Line 16: Line 20:
<style type="text/css">
<style type="text/css">
-
#footer-links {
+
        #foot-icon1 { float: left; }
-
color: rgb(110, 110, 110);
+
        #foot-icon2 { float: left; }
-
+
 
-
border-top-color: rgb(229, 229, 229);
+
#footer-links * {  
-
border-top-style: solid;
+
padding:0;  
-
border-top-width: 1px;
+
margin: 0;
-
border-bottom-color: rgb(229, 229, 229);
+
list-style-type:none;
-
border-bottom-style: solid;
+
    }
-
border-bottom-width: 1px;
+
 
-
+
   
-
margin:auto;
+
    #footer-links a { 
-
width:70%;  
+
text-decoration: none;  
-
+
}
-
margin-bottom: 20px;
+
-
padding-bottom: 5px;
+
#footer-links ul li ul {
-
padding-left: 0px;
+
border: solid 1px #b4b4b4;
-
padding-right: 0px;
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
-
padding-top: 5px;
+
background: white;
 +
}
 +
 +
#footer-links ul li ul li a {
 +
padding-top:3px;  
 +
padding-bottom:3px;
 +
}
 +
#footer-links ul li {
 +
float: left;  
 +
}
 +
#footer-links ul li a {
 +
//font-weight: bold;
 +
padding: 15px 10px;
 +
}
 +
#footer-links li{
 +
position:relative;  
 +
float:left;
 +
}
 +
#footer-links ul li ul, #footer-links:hover ul li ul, #footer-links:hover ul li:hover ul li ul{
 +
display:none;
 +
list-style-type:none;  
 +
width: 140px;
 +
 +
}
 +
#footer-links:hover ul, #footer-links:hover ul li:hover ul, #footer-links:hover ul li:hover ul li:hover ul {
 +
display:block;
 +
}
 +
#footer-links:hover ul li:hover ul li:hover ul {
position: absolute;
position: absolute;
-
text-align: center
+
margin-left: 145px;
-
+
margin-top: -22px;
-
height: 83px;
+
//font: 10px;
-
+
-
z-index: 1;
+
}
}
 +
#footer-links:hover ul li:hover ul {
 +
position: absolute;
 +
margin-top: 1px;
 +
//font: 10px;
 +
bottom:100%;
 +
}
 +
#footer-links .left-footer {
#footer-links .left-footer {
float:left;
float:left;
 +
                margin-left:10px;
}
}
Line 63: Line 100:
padding-right: none;
padding-right: none;
}
}
 +
 +
#footer-links ul li ul li { border: none;  }
 +
 +
      #footer-links { width:90%; margin-left:auto; margin-right:auto;  bottom:5px;}
 +
      // .vertical { display:table-cell; vertical-align:centre; }
</style>
</style>
 +
 +
<script>
 +
 +
$(document).ready(function() {
 +
 +
// get links from mwiki footer and put into our footer
 +
 +
var myarr = $('#footer-box > #footer').children().filter('#f-list');
 +
var mystr = "";
 +
var i = 0;
 +
 +
for (i=0; i < myarr.length; i++){
 +
mystr += myarr[i].innerHTML;
 +
}
 +
 +
$('.mediawiki-footer').html(mystr);
 +
 +
 +
//get icons and put into our footer
 +
 +
$('#foot-icon2').html(  $('#f-copyrightico').html()  );
 +
$('#foot-icon1').html(  $('#f-poweredbyico').html()  );
 +
 +
$('#footer-box').css('display', 'none');
 +
 +
});
 +
 +
</script>
</html>
</html>

Latest revision as of 04:04, 15 September 2012