Add navigation menu

[matches/MCTX3420.git] / testing / MCTXWeb / public_html / static / nav-menu.css

diff --git a/testing/MCTXWeb/public_html/static/nav-menu.css b/testing/MCTXWeb/public_html/static/nav-menu.css
index e64408d..371da5e 100644 (file)
--- a/testing/MCTXWeb/public_html/static/nav-menu.css
+++ b/testing/MCTXWeb/public_html/static/nav-menu.css
@@ -1,89 +1,32 @@
-/* 
-    Document   : nav-menu
-    Created on : 21/09/2013, 8:33:30 PM
-    Author     : Jeremy Tan
-    Description:
-        Navigation menu styling.
-        Background colour: #2A2A2A
-        Highlight colour: #f2f2f2
-        Normal text colour: #bbbbbb
-*/
-
-/** Easing **/
 .nav-menu {
-  transition: all 0.2s ease 0s;
+  list-style: none;
+  margin: 0;
+  padding: 0;
 }
 
-/** Main menu list styling **/
 .nav-menu ul {
-  list-style: none outside none;
+  padding: 0;
   margin: 0;
-  padding-left: 0;
-  text-align: right;
 }
 
-/** Menu item styling **/
 .nav-menu li {
-  display: inline-block;
-  position: relative;
+  margin: 0;
+  padding: 0;
+  list-style: none;
 }
 
-/** Link styling **/
 .nav-menu a {
-  background-color: #2A2A2A;
-  border-radius: 2px;
-  border: 1px solid #444444;
-  color: #BBBBBB;
-  display: inline-block;
-  margin: 0.1em;
-  padding: 0.2em 2em;
-  text-decoration: none;
-  transition: all 0.2s ease 0s;
-}
-
-/** Highlight currently hovered-over item **/
-.nav-menu li:hover > a {
-  background-color: #f2f2f2;
+  border-bottom: 1px solid #ccc;
   color: #2a2a2a;
-}
-
-/** Display submenu when hovering over list item **/
-.nav-menu ul li:hover > ul {
   display: block;
+  margin: 0;
+  padding: 8px 12px;
+  text-decoration: none;
+  font-weight: normal;
 }
 
-/** Submenu styling **/
-.nav-menu ul ul {
-  background-color: #2A2A2A;
-  border-radius: 2px;
-  box-shadow: 1px 1px 1px #2A2A2A;
-  display: none;
-  left: 0;
-  padding: 0.25em 0.5em;
-  position: absolute;
-  text-align: left;
-  z-index: 10;
-}
-
-/** Submenu link styling **/
-.nav-menu ul ul a {
-  width: 11em;
-  padding: 0.25em 0.5em;
+.nav-menu a:hover {
+  background: #2580a2 url('hover.gif') left center no-repeat;
+  color: #fff;
+  padding-bottom: 8px;
 }
-
-/**
-  Style of menu:
-  <div class="nav-menu">
-    <ul class="menu">
-      <li><a href="#">Link 1</a></li>
-      <li><a href="#">Link 2</a></li>
-      <li>
-        <a href="#">Link 3</a>
-        <ul class="submenu">
-          <li><a href="#">Sub-link 1</a></li>
-          <li><a href="#">Sub-link 2</a></li>
-        </ul>
-      </li>
-    </ul>
-  </div>
-*/
\ No newline at end of file