LnF updates to navigation menu.
Change-Id: I8dce2d5feebcf65143b1c0b4eee8b298a68995e0
(cherry picked from commit c0e282b)
diff --git a/web/gui/src/main/webapp/app/fw/nav/nav-theme.css b/web/gui/src/main/webapp/app/fw/nav/nav-theme.css
index 6111642..8d22fd0 100644
--- a/web/gui/src/main/webapp/app/fw/nav/nav-theme.css
+++ b/web/gui/src/main/webapp/app/fw/nav/nav-theme.css
@@ -19,42 +19,46 @@
*/
.light #nav {
- background-color: #bbb;
- box-shadow: 0 2px 8px #777;
+ background-color: #231f20;
}
.dark #nav {
- background-color: #444;
- box-shadow: 0 2px 8px #111;
+ /* TODO: dark theme */
+ background-color: #231f20;
}
.light #nav .nav-hdr {
- color: #ddd;
- border-bottom: solid 1px #999;
- background-color: #aaa;
+ color: #716b6a;
+ background-color: #3c3a3a;
}
.dark #nav .nav-hdr {
- color: #888;
- border-bottom: solid 1px #444;
- background-color: #555;
+ /* TODO: dark theme */
+ color: #716b6a;
+ background-color: #3c3a3a;
}
.light #nav a {
- color: #369;
- border-bottom: solid #ccc 1px;
+ color: #c7c7c0;
+ border-bottom: solid #3c3a3a 1px;
}
.dark #nav a {
- color: #eee;
- border-bottom: solid #333 1px;
+ /* TODO: dark theme */
+ color: #c7c7c0;
+ border-bottom: solid #3c3a3a 1px;
}
.light #nav a:hover {
- background-color: #ddd;
+ color: #ffffff;
}
.dark #nav a:hover {
- background-color: #777;
+ /* TODO: dark theme */
+ color: #ffffff;
}
#nav a div svg.embeddedIcon g.icon .glyph {
- fill: #c66;
+ fill: #007dc4;
+}
+
+#nav a:hover div svg.embeddedIcon g.icon .glyph {
+ fill: #20b2ff;
}
diff --git a/web/gui/src/main/webapp/app/fw/nav/nav.css b/web/gui/src/main/webapp/app/fw/nav/nav.css
index 7991088..7d283bd 100644
--- a/web/gui/src/main/webapp/app/fw/nav/nav.css
+++ b/web/gui/src/main/webapp/app/fw/nav/nav.css
@@ -20,27 +20,32 @@
#nav {
position: absolute;
- top: 45px;
- left: 1px;
+ top: 48px;
+ left: 0;
padding: 0;
z-index: 3000;
visibility: hidden;
}
html[data-platform='iPad'] #nav {
- top: 57px;
+ top: 60px;
}
#nav .nav-hdr {
- font-style: italic;
- padding: 6px 8px 6px 8px;
+ font-weight: bold;
+ font-variant: small-caps;
+ text-transform: uppercase;
+ font-size: 12pt;
+ padding: 8px 15px;
}
#nav a {
text-decoration: none;
- font-size: 14pt;
+ font-size: 13pt;
+ font-weight: lighter;
display: block;
- padding: 8px 16px 6px 12px;
+ padding: 6px 10px;
+ margin: 0 7px;
}
#nav a div {
diff --git a/web/gui/src/main/webapp/index.html b/web/gui/src/main/webapp/index.html
index de42a8e..e4fa6e2 100644
--- a/web/gui/src/main/webapp/index.html
+++ b/web/gui/src/main/webapp/index.html
@@ -24,6 +24,9 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700'
+ rel='stylesheet' type='text/css'>
+
<title>ONOS</title>
<!-- Third party library code included here -->