Template:AboutMenu: Difference between revisions
Jump to navigation
Jump to search
Jacob Dalton (talk | contribs) No edit summary |
Jacob Dalton (talk | contribs) No edit summary |
||
| (43 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<html> | <html> | ||
<style> | <style> | ||
.menu-list li | @import url(http://fonts.googleapis.com/css?family=Ubuntu); | ||
.menu-list ul | |||
{ | |||
text-align: center; | |||
font-family: 'Ubuntu', ubuntu, sans-serif; | |||
margin: 0; | |||
} | |||
.menu-list ul li ul a | |||
{ | |||
color: #888; | |||
} | |||
.menu-list ul li ul a:hover | |||
{ | |||
color: #000; | |||
text-decoration: none; | |||
font-weight: bold; | |||
} | |||
.menu-list ul li | |||
{ | { | ||
display: inline-block; | display: inline-block; | ||
text-align: center; | |||
width: 125px; /*6%;*/ | |||
margin-right: 10px; | |||
vertical-align: top; | |||
position: relative; | |||
padding-bottom: 12px; | |||
} | } | ||
.menu-list ul li ul | |||
{ | |||
display: none; | |||
position: absolute; | |||
top: 98px; | |||
width: 100%; | |||
background-color: #fff; | |||
font-family: arial; | |||
border: 1px solid #aaa; | |||
padding: 9px 0; | |||
} | |||
.menu-list ul li:hover ul | |||
{ | |||
display: block; | |||
} | |||
.menu-list ul li ul li | |||
{ | |||
display: block; | |||
width: 100%; | |||
padding: 2px 0; | |||
font-size: 1.5em; | |||
} | |||
.menu-text | .menu-text | ||
{ | { | ||
color: #000; | color: #000; | ||
display: block; | |||
} | } | ||
.menu-text:hover | .menu-text:hover | ||
{ | { | ||
text-decoration: none; | |||
} | |||
/* hover menu effect */ | |||
.over | |||
{ | |||
font-size: 2em; | |||
padding-top: 67px; | |||
} | |||
.financials | |||
{ | |||
background: url('//opensourceecology.org/w/images/8/80/Financials_-_Black_copy.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .financials | |||
{ | |||
background: url('//opensourceecology.org/w/images/3/34/Financials_-_Colored_copy.png') no-repeat scroll left top transparent; | |||
} | |||
.legal { | |||
background: url('//opensourceecology.org/w/images/2/21/Legal_-_Black_copy.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .legal { | |||
background: url('//opensourceecology.org/w/images/3/3f/Legal_-_Colored_copy.png') no-repeat scroll left top transparent; | |||
} | |||
.mission { | |||
background: url('//opensourceecology.org/w/images/4/4d/Mission_-_Black_copy.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .mission { | |||
background: url('//opensourceecology.org/w/images/c/c8/Mission_-_Colored_copy.png ') no-repeat scroll left top transparent; | |||
} | |||
.people { | |||
background: url('//opensourceecology.org/w/images/9/97/People_-_Black_copy.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .people | |||
{ | |||
background: url('//opensourceecology.org/w/images/9/96/People_-_Colored_copy.png ') no-repeat scroll left top transparent; | |||
} | |||
.planning { | |||
background: url('//opensourceecology.org/w/images/3/3c/Planning_-_Black_copy.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .planning { | |||
background: url('//opensourceecology.org/w/images/3/38/Planning_-_Colored_copy.png ') no-repeat scroll left top transparent; | |||
} | |||
.results { | |||
background: url('//opensourceecology.org/w/images/2/2d/Results_-_Black.png') no-repeat scroll left top transparent; | |||
} | |||
li:hover .results { | |||
background: url('//opensourceecology.org/w/images/c/c0/Results_-_Colored.png') no-repeat scroll left top transparent; | |||
} | } | ||
</style> | </style> | ||
< | <div class="menu-list"> | ||
<ul> | |||
<li><a class="menu-text over mission">Mission</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
</ul> | <li><a href="">Mission</a></li> | ||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
<li><a class="menu-text over results">Results</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
<li><a class="menu-text over planning">Planning</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
<li><a class="menu-text over people">People</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
<li><a class="menu-text over financials">Financials</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
<li><a class="menu-text over legal">Legal</a> | |||
<ul class="menu-list-layer2"> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
<li><a href="">Mission</a></li> | |||
</ul> | |||
</li> | |||
</ul> | |||
</div> | |||
</html> | </html> | ||
Latest revision as of 19:36, 16 December 2012