Difference between revisions of "Template:UC San Diego"

Line 47: Line 47:
  
 
<style>
 
<style>
    div {display:block;}
 
  
     #navbar {
+
      
      position: fixed;
+
      z-index: 9999;
+
      top: 0;
+
      left: 0;
+
      width: 100%;
+
      height: 96px;
+
      box-sizing: border-box;
+
      padding-right: 64px;
+
      padding-top: 48px;
+
      background: #fff;
+
      box-shadow: 5px 10px 18px #eee;
+
    }
+
 
+
    .navlink {
+
      position: relative;
+
      float: right;
+
      height: 32px;
+
      font-size: 20px;
+
      color: #000;
+
      padding-right: 32px;
+
    }
+
 
+
    .navlink:after {
+
      content: "";
+
      opacity: 0;
+
      position: absolute;
+
      top: 80%;
+
      left: 0;
+
      height: 2px;
+
      width: 38px;
+
      background: #bba5ef;
+
      transition: all ease .3s;
+
    }
+
 
+
    .navlink:hover:after {
+
      opacity: 1;
+
    }
+
 
+
    .firstnav:after {
+
      content: "";
+
      opacity: 1;
+
      position: absolute;
+
      top: 80%;
+
      left: 0;
+
      height: 2px;
+
      width: 38px;
+
      background: #bba5ef;
+
      transition: all ease .3s;
+
    }
+
 
+
    .navlink:hover~.firstnav:after {
+
      opacity: 0;
+
    }
+
 
+
    .navlink:hover>.navdrop {
+
      display: block;
+
    }
+
 
+
    .navdrop {
+
      box-shadow: 5px 10px 18px #eee;
+
      border-radius: 4px;
+
      position: absolute;
+
      display: none;
+
      top: 100%;
+
      left: 0;
+
      background: #fff;
+
      transition: all ease .3s;
+
    }
+
 
+
    .subnavlink {
+
      border-radius: 4px;
+
      font-size: 12px;
+
      background: #fff;
+
      color: #222;
+
      padding: 8px;
+
      box-sizing: border-box;
+
      transition: all ease .3s;
+
    }
+
 
+
    .subnavlink:hover {
+
      background: #5ab6dd;
+
      color: #fff;
+
    }
+
 
/**************************************************************************************************************************************************************************************************/
 
/**************************************************************************************************************************************************************************************************/
  
Line 581: Line 497:
  
  
 +
#navbar {
 +
      position: fixed;
 +
      z-index: 9999;
 +
      top: 0;
 +
      left: 0;
 +
      width: 100%;
 +
      height: 96px;
 +
      box-sizing: border-box;
 +
      padding-right: 64px;
 +
      padding-top: 48px;
 +
      background: #fff;
 +
      box-shadow: 5px 10px 18px #eee;
 +
    }
  
 +
    .navlink {
 +
      position: relative;
 +
      float: right;
 +
      height: 32px;
 +
      font-size: 20px;
 +
      color: #000;
 +
      padding-right: 32px;
 +
    }
 +
 +
    .navlink:after {
 +
      content: "";
 +
      opacity: 0;
 +
      position: absolute;
 +
      top: 80%;
 +
      left: 0;
 +
      height: 2px;
 +
      width: 38px;
 +
      background: #bba5ef;
 +
      transition: all ease .3s;
 +
    }
 +
 +
    .navlink:hover:after {
 +
      opacity: 1;
 +
    }
 +
 +
    .firstnav:after {
 +
      content: "";
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 80%;
 +
      left: 0;
 +
      height: 2px;
 +
      width: 38px;
 +
      background: #bba5ef;
 +
      transition: all ease .3s;
 +
    }
 +
 +
    .navlink:hover~.firstnav:after {
 +
      opacity: 0;
 +
    }
 +
 +
    .navlink:hover>.navdrop {
 +
      display: block;
 +
    }
 +
 +
    .navdrop {
 +
      box-shadow: 5px 10px 18px #eee;
 +
      border-radius: 4px;
 +
      position: absolute;
 +
      display: none;
 +
      top: 100%;
 +
      left: 0;
 +
      background: #fff;
 +
      transition: all ease .3s;
 +
    }
 +
 +
    .subnavlink {
 +
      border-radius: 4px;
 +
      font-size: 12px;
 +
      background: #fff;
 +
      color: #222;
 +
      padding: 8px;
 +
      box-sizing: border-box;
 +
      transition: all ease .3s;
 +
    }
 +
 +
    .subnavlink:hover {
 +
      background: #5ab6dd;
 +
      color: #fff;
 +
    }
  
  

Revision as of 06:06, 9 September 2018