Difference between revisions of "Template:Team:UMarylandMenu"

Line 23: Line 23:
 
width:100%;
 
width:100%;
 
min-width:800;
 
min-width:800;
height:180px;
+
height:188px;
 
min-height:100px;
 
min-height:100px;
 
position:absolute;
 
position:absolute;
Line 29: Line 29:
 
margin:0px;
 
margin:0px;
 
top:10px;
 
top:10px;
background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #21FF89), color-stop(25, #FFFFFF), color-stop(50, #40BFFF), color-stop(75, #FFFFFF), color-stop(100, #21FF89));
+
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ffffff), color-stop(100, #00ffff));
 
font-family: "Arial Black", Gadget, sans-serif;
 
font-family: "Arial Black", Gadget, sans-serif;
 
font-size: 14px;
 
font-size: 14px;
Line 35: Line 35:
 
}
 
}
  
#blocky {
+
#beacon {
position:relative;
+
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ffffff), color-stop(100, #00ffff));
 +
padding:10px;
 +
overflow:visible;
 +
position: absolute;
 +
left: 38%;
 +
top:0px;
 +
border: 2px solid black;
 +
border-radius: 0px 0px 50px 50px;
 +
}
 +
 
 +
#swagmenu {
 +
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #000000), color-stop(5, #2D1BA0), color-stop(50, #1BB1CF), color-stop(100, #00ffff));
 +
color:#ffffff;
 +
border-top: 2px solid black;
 +
border-bottom: 2px solid black;
 
width:100%;
 
width:100%;
height:180px;
+
margin:auto;
 +
height:40px;
 
}
 
}
  
Line 44: Line 59:
 
text-align: center;
 
text-align: center;
 
display: inline;
 
display: inline;
margin: 0;
+
margin: 0px;
 
padding: 10px;
 
padding: 10px;
 
list-style: none;
 
list-style: none;
Line 52: Line 67:
 
margin-right: -4px;
 
margin-right: -4px;
 
position: relative;
 
position: relative;
margin: 5px;
+
margin: 0px;
 
padding: 10px ;
 
padding: 10px ;
 
min-width:100px;
 
min-width:100px;
-webkit-transition: all .5s;
+
-webkit-transition: all 1s;
-moz-transition: all .5s;
+
-moz-transition: all 1s;
-ms-transition: all .5s;
+
-ms-transition: all 1s;
-o-transition: all .5s;
+
-o-transition: all 1s;
transition: all .5s;
+
transition: all 1s;
border: 4px solid transparent;
+
border-left: 2px solid black;
 +
border-right: 2px solid black;
 +
}
  
}
 
 
#swagmenu ul li:hover {
 
#swagmenu ul li:hover {
 
 
display: inline-block;
 
display: inline-block;
margin-right: -4px;
+
background: #b8e1fc;
position: relative;
+
font-size:110%;
margin: 5px;
+
-webkit-transition: all 1s ease;
padding: 10px ;
+
-moz-transition: all 1s ease;
min-width:100px;
+
-ms-transition: all 1s ease;
-webkit-transition: all .5s;
+
-o-transition: all 1s ease;
-moz-transition: all .5s;
+
transition: all 1s ease;
-ms-transition: all .5s;
+
}
-o-transition: all .5s;
+
transition: all .5s;
+
border: 2px solid black;
+
border-radius: 20px 20px 20px 20px;
+
background: #ffffff;
+
  
}
 
#swagmenu ul li a {
 
color: #000000;
 
}
 
#swagmenu ul li a:hover {
 
color: #000000;
 
}
 
#swagmenu ul li:hover {
 
color: #0000FF;
 
}
 
 
#swagmenu ul li ul {
 
#swagmenu ul li ul {
 
padding: 0;
 
padding: 0;
 
position: absolute;
 
position: absolute;
top: 42px;
 
 
left: 0;
 
left: 0;
 
min-width:100px;
 
min-width:100px;
Line 99: Line 98:
 
opacity: 0;
 
opacity: 0;
 
visibility: hidden;
 
visibility: hidden;
-webkit-transiton: opacity .5s;
+
-webkit-transition: all 1s ease;
-moz-transition: opacity .5s;
+
-moz-transition: all 1s ease;
-ms-transition: opacity .5s;
+
-ms-transition: all 1s ease;
-o-transition: opacity .5s;
+
-o-transition: all 1s ease;
-transition: opacity .5s;
+
transition: all 1s ease;
 
}
 
}
 +
 
#swagmenu ul li ul li {  
 
#swagmenu ul li ul li {  
 
display: block;
 
display: block;
 
text-align: center;
 
text-align: center;
color: #000000;
+
background-color: #00ffff;
margin:-3px;
+
padding:7px;
+
 
border: 2px solid black;
 
border: 2px solid black;
border-radius: 10px 10px 10px 10px;
+
padding:10px;
 +
top:10px;
 +
width:150px;
 
}
 
}
 
#swagmenu ul li ul li:hover {  
 
#swagmenu ul li ul li:hover {  
background: #ffffff;
+
background-color: #b8e1fc;
 
}
 
}
 
#swagmenu ul li:hover ul {
 
#swagmenu ul li:hover ul {
  display: block;
+
display: block;
  opacity: 1;
+
opacity: 1;
  visibility: visible;
+
visibility: visible;
 +
}
 +
 
 +
#swagmenu ul li a {
 +
color: #ffffff;
 +
}
 +
#swagmenu ul li a:hover {
 +
color: #000000;
 
}
 
}
 
#swagmenu ul li ul li a {
 
#swagmenu ul li ul li a {
Line 128: Line 135:
 
color: #000000;
 
color: #000000;
 
}
 
}
 +
 
#swagmenu ul li:nth-child(3) {
 
#swagmenu ul li:nth-child(3) {
 
margin-right: 200px;
 
margin-right: 200px;
Line 137: Line 145:
  
 
#swagmenu ul li ul li:nth-child(3) {
 
#swagmenu ul li ul li:nth-child(3) {
margin-right: 2px;
+
margin-right: 0px;
 
}
 
}
  
 
#swagmenu ul li ul li:nth-child(4) {
 
#swagmenu ul li ul li:nth-child(4) {
margin-left: 2px;
+
margin-left: 0px;
 +
}
 +
#swagmenu ul li ul li:last-child {
 +
  border-radius: 0px 0px 20px 20px;
 
}
 
}
  
#beacon {
 
background: url(https://static.igem.org/mediawiki/2015/3/3d/Umd-igem2.png) 50% 0 no-repeat;
 
background-size: 300px 168px;
 
overflow:visible;
 
width: 340px;
 
height: 208px;
 
position: absolute;
 
left: 38%;
 
top:0px;
 
 
}
 
  
 
#mainlink {
 
#mainlink {
Line 172: Line 172:
 
<div id='swagmenu'>
 
<div id='swagmenu'>
  
 +
<div id='beacon'>
 
<a href="https://2015.igem.org/Team:UMaryland">
 
<a href="https://2015.igem.org/Team:UMaryland">
<div id='beacon'>
+
<img src="https://static.igem.org/mediawiki/2015/3/3d/Umd-igem2.png" alt="Home" height="168" width="300"></a>
</div></a>
+
</div>
 
+
 
+
 
+
 
+
  
 
<ul>
 
<ul>
 
 
<li class='has-sub'><a href="#"><span>Info</a><ul>
 
<li class='has-sub'><a href="#"><span>Info</a><ul>
 
<li><a href="https://2015.igem.org/Team:UMaryland/about"><span>About</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/about"><span>About</span></a></li>
Line 190: Line 186:
 
<li><a href="https://2015.igem.org/Team:UMaryland/Description"><span>Description</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/Description"><span>Description</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/Design"><span>Design</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/Design"><span>Design</span></a></li>
 +
<li><a href="https://2015.igem.org/Team:UMaryland/Hardware"><span>PCR</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/sideprojects"><span>Side Projects</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/sideprojects"><span>Side Projects</span></a></li>
 
<li><a href="https://2015.igem.org/Team:UMaryland/Interlab"><span>Interlab Study
 
<li><a href="https://2015.igem.org/Team:UMaryland/Interlab"><span>Interlab Study
Line 220: Line 217:
 
</div></a>
 
</div></a>
  
</div>
 
 
 
<div id='blocky'>
 
 
</div>
 
</div>

Revision as of 00:42, 6 September 2015