Separating theme from layout for CSS files.
Change-Id: I4c3cec28b30de8026df4298f65ebf6ad92faf68f
(cherry picked from commit 11f662f)
diff --git a/web/gui/src/main/webapp/app/fw/mast/mast-theme.css b/web/gui/src/main/webapp/app/fw/mast/mast-theme.css
new file mode 100644
index 0000000..8f94066
--- /dev/null
+++ b/web/gui/src/main/webapp/app/fw/mast/mast-theme.css
@@ -0,0 +1,95 @@
+/*
+ * Copyright 2016-present Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ ONOS GUI -- Masthead (theme) -- CSS file
+ */
+
+.light #mast {
+ background-color: #bbb;
+ box-shadow: 0 2px 8px #777;
+}
+.dark #mast {
+ background-color: #444;
+ box-shadow: 0 2px 8px #222;
+}
+
+
+.light #mast .nav-menu-button:hover {
+ background-color: #ddd;
+}
+.dark #mast .nav-menu-button:hover {
+ background-color: #777;
+}
+
+#mast img.logo:hover {
+ /* need something better */
+ /*background-color: #888;*/
+}
+
+.light #mast .title {
+ color: #369;
+}
+.dark #mast .title {
+ color: #eee;
+}
+
+.light #mast-right a {
+ color: #369;
+}
+
+.dark #mast-right a {
+ color: #eee;
+}
+
+.light #mast nav {
+ color: #369;
+}
+
+.dark #mast nav {
+ color: #eee;
+}
+
+
+/* Theme styles for drop down menu */
+
+.light #mast .dropdown {
+ background-color: #bbb;
+ box-shadow: 0 2px 8px #777;
+}
+
+.dark #mast .dropdown {
+ background-color: #444;
+ box-shadow: 0 2px 8px #111;
+}
+
+.light #mast .dropdown a {
+ color: #369;
+ border-bottom: solid #ccc 1px;
+}
+
+.dark #mast .dropdown a {
+ color: #eee;
+ border-bottom: solid #333 1px;
+}
+
+.light #mast .dropdown a:hover {
+ background-color: #ddd;
+}
+
+.dark #mast .dropdown a:hover {
+ background-color: #777;
+}
diff --git a/web/gui/src/main/webapp/app/fw/mast/mast.css b/web/gui/src/main/webapp/app/fw/mast/mast.css
index a8df379..b2ccb37 100644
--- a/web/gui/src/main/webapp/app/fw/mast/mast.css
+++ b/web/gui/src/main/webapp/app/fw/mast/mast.css
@@ -15,7 +15,7 @@
*/
/*
- ONOS GUI -- Masthead -- CSS file
+ ONOS GUI -- Masthead (layout) -- CSS file
*/
#mast {
@@ -28,15 +28,6 @@
padding-top: 16px;
}
-.light #mast {
- background-color: #bbb;
- box-shadow: 0 2px 8px #777;
-}
-.dark #mast {
- background-color: #444;
- box-shadow: 0 2px 8px #222;
-}
-
#mast .nav-menu-button {
width: 30px;
height: 30px;
@@ -44,12 +35,6 @@
margin-bottom: 4px;
cursor: pointer;
}
-.light #mast .nav-menu-button:hover {
- background-color: #ddd;
-}
-.dark #mast .nav-menu-button:hover {
- background-color: #777;
-}
#mast img.logo {
height: 38px;
@@ -57,23 +42,12 @@
padding-right: 8px;
}
-#mast img.logo:hover {
- /* need something better */
- /*background-color: #888;*/
-}
-
#mast .title {
font-size: 14pt;
font-style: italic;
vertical-align: 12px;
}
-.light #mast .title {
- color: #369;
-}
-.dark #mast .title {
- color: #eee;
-}
#mast-right {
display: inline-block;
@@ -84,21 +58,6 @@
line-height: 44px;
}
-.light #mast-right a {
- color: #369;
-}
-
-.dark #mast-right a {
- color: #eee;
-}
-
-.light #mast nav {
- color: #369;
-}
-
-.dark #mast nav {
- color: #eee;
-}
/*
MAST HEAD DROPDOWN MENU
@@ -145,33 +104,3 @@
html[data-platform='iPad'] #mast .dropdown {
top: 57px;
}
-
-/* Theme styles for drop down menu */
-
-.light #mast .dropdown {
- background-color: #bbb;
- box-shadow: 0 2px 8px #777;
-}
-
-.dark #mast .dropdown {
- background-color: #444;
- box-shadow: 0 2px 8px #111;
-}
-
-.light #mast .dropdown a {
- color: #369;
- border-bottom: solid #ccc 1px;
-}
-
-.dark #mast .dropdown a {
- color: #eee;
- border-bottom: solid #333 1px;
-}
-
-.light #mast .dropdown a:hover {
- background-color: #ddd;
-}
-
-.dark #mast .dropdown a:hover {
- background-color: #777;
-}
\ No newline at end of file