Difference between revisions of "Template:UI-Indonesia/css/menu bar"

Line 8: Line 8:
 
<style type="text/css">
 
<style type="text/css">
 
@charset "UTF-8";
 
@charset "UTF-8";
−
#cssmenu {position: fixed; width: 100%; padding: 0; margin: 0px auto; border: 0;}
+
#cssmenu {padding: 0; margin: 0; border: 0;}
 
#cssmenu ul, #cssmenu li {list-style: none; margin: 0; padding: 0;}
 
#cssmenu ul, #cssmenu li {list-style: none; margin: 0; padding: 0;}
 
#cssmenu ul {position: relative; z-index: 597; }
 
#cssmenu ul {position: relative; z-index: 597; }
Line 24: Line 24:
  
 
#cssmenu {
 
#cssmenu {
−
  background-color: #f8f8f8;
+
background: #333;
−
  border-bottom: 4px solid #15bdb6;
+
border-bottom: 4px solid #1b9bff;
−
  font-family: 'Titillium Web', Tahoma, sans-serif;
+
font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif;
−
  font-size: 14px;
+
font-size: 12px;
−
  font-weight: bold;
+
−
  margin: 0px auto;
+
−
  z-index: 7000;
+
−
  clear: both;
+
−
  top: 14px;
+
 
}
 
}
  
−
  #cssmenu > ul { *display: inline-block; text-align: center;}
+
#cssmenu > ul { *display: inline-block; }
  
−
  #cssmenu:after, #cssmenu ul:after {
+
#cssmenu:after, #cssmenu ul:after {
−
    content: '';
+
content: '';
−
    display: block;
+
display: block;
−
    clear: both;  
+
clear: both;
 
}
 
}
  
 
#cssmenu a {
 
#cssmenu a {
−
    background: #f8f8f8;
+
background: #333;
−
    color: #1e8380;
+
color: #CBCBCB;
−
    padding: 0 20px;  
+
padding: 0 20px;
 
}
 
}
−
#cssmenu ul { text-transform: uppercase; left: 30px; text-align: center;}
+
#cssmenu ul { text-transform: uppercase; }
  
−
    #cssmenu ul ul {
+
#cssmenu ul ul {
−
      border-top: 4px solid #15bdb6;
+
border-top: 4px solid #1b9bff;
−
      text-transform: none;
+
text-transform: none;
−
      min-width: 200px;  
+
min-width: 190px;
 
}
 
}
−
      #cssmenu ul ul a {
+
#cssmenu ul ul a {
−
        background: #15bdb6;
+
background: #1b9bff;
−
        color: #FFF;
+
color: #FFF;
−
        border: 1px solid #1e8380;
+
border: 1px solid #0082e7;
−
        border-top: 0 none;
+
border-top: 0 none;
−
        line-height: 150%;
+
line-height: 150%;
−
        padding: 16px 20px;  
+
padding: 16px 20px;
 
}
 
}
−
      #cssmenu ul ul ul { border-top: 0 none; }
+
#cssmenu ul ul ul { border-top: 0 none; }
  
−
      #cssmenu ul ul li { position: relative }
+
#cssmenu ul ul li { position: relative }
−
#cssmenu > ul > li > a { line-height: 48px; }
+
#cssmenu > ul > li > a { line-height: 48px; }
  
−
#cssmenu ul ul li:first-child > a { border-top: 1px solid #332e2e; }
+
#cssmenu ul ul li:first-child > a { border-top: 1px solid #0082e7; }
−
        #cssmenu ul ul li:hover > a { background: #1e8380;}
+
#cssmenu ul ul li:hover > a { background: #35a6ff; }
  
−
        #cssmenu ul ul li:last-child > a {
+
#cssmenu ul ul li:last-child > a {
−
          border-radius: 0 0 5px 5px;
+
border-radius: 0 0 3px 3px;
−
          box-shadow: 0 1px 0 #1e8380;  
+
box-shadow: 0 1px 0 #1b9bff;
 
}
 
}
−
        #cssmenu ul ul li:last-child:hover > a { border-radius: 0 0 0 3px; }
+
#cssmenu ul ul li:last-child:hover > a { border-radius: 0 0 0 3px; }
  
−
        #cssmenu ul ul li.has-sub > a:after {
+
#cssmenu ul ul li.has-sub > a:after {
−
          content: '+';
+
content: '+';
−
          position: absolute;
+
position: absolute;
−
          top: 50%;
+
top: 50%;
−
          right: 15px;
+
right: 15px;
−
          margin-top: -8px;
+
margin-top: -8px;
 
}
 
}
−
    #cssmenu ul li:hover > a, #cssmenu ul li.active > a {
+
 
−
      background: #1e8380;
+
#cssmenu ul li:hover > a, #cssmenu ul li.active > a {
−
  border-radius: 5px 5px 5px 5px;
+
background: #1b9bff;
−
      color: #FFF;
+
color: #FFF;
 
}
 
}
−
    #cssmenu ul li.has-sub > a:after {
+
#cssmenu ul li.has-sub > a:after {
−
      content: '+';
+
content: '+';
−
      margin-left: 5px;  
+
margin-left: 5px;
 
}
 
}
−
    #cssmenu ul li.last ul {
+
#cssmenu ul li.last ul {
−
      left: auto;
+
left: auto;
−
      right: 0;  
+
right: 0;
 
}
 
}
−
      #cssmenu ul li.last ul ul {
+
#cssmenu ul li.last ul ul {
−
        left: auto;
+
left: auto;
−
        right: 99.5%;
+
right: 99.5%;
−
}
+
−
 
+
−
#nav-box {
+
−
display: block;
+
−
position: relative;
+
−
width: 100%;
+
−
height: auto;
+
−
margin: 0px auto;
+
−
margin-bottom: 20px;
+
−
background: transparent;
+
−
        top: 0px;
+
−
        clear: both;
+
 
}
 
}
 
</style>
 
</style>

Revision as of 00:55, 14 October 2016