From ddf23d1ea50df56d4817a243badf662d72cd23a0 Mon Sep 17 00:00:00 2001
From: Lars Jung <lrsjng@gmail.com>
Date: Mon, 27 Apr 2015 00:49:50 +0200
Subject: [PATCH] Clean and refactor styles.

---
 src/_h5ai/client/css/inc/ext/contextmenu.less |  4 ++--
 src/_h5ai/client/css/inc/main/info.less       |  4 ++--
 src/_h5ai/client/css/inc/mixins.less          | 20 ++++++++++++++++++-
 src/_h5ai/client/css/inc/view/mainrow.less    |  8 +-------
 src/_h5ai/client/css/inc/view/root.less       | 10 ++--------
 src/_h5ai/client/css/inc/view/topbar.less     |  8 +-------
 6 files changed, 27 insertions(+), 27 deletions(-)

diff --git a/src/_h5ai/client/css/inc/ext/contextmenu.less b/src/_h5ai/client/css/inc/ext/contextmenu.less
index b0fdea0f..d14d2720 100644
--- a/src/_h5ai/client/css/inc/ext/contextmenu.less
+++ b/src/_h5ai/client/css/inc/ext/contextmenu.less
@@ -15,8 +15,8 @@
         position: absolute;
         left: 100px;
         top: 100px;
-        background: @col-back-paper;
         color: @col-text;
+        background: @col-back-paper;
         z-index: 10;
         overflow: auto;
         min-width: 200px;
@@ -42,7 +42,7 @@
 
         &:hover {
             color: @col-text-hover;
-            background: @col-grey-100;
+            background: @col-back-hover;
         }
     }
 
diff --git a/src/_h5ai/client/css/inc/main/info.less b/src/_h5ai/client/css/inc/main/info.less
index afc1939e..18667538 100644
--- a/src/_h5ai/client/css/inc/main/info.less
+++ b/src/_h5ai/client/css/inc/main/info.less
@@ -3,7 +3,7 @@
     #content {
         flex: 1 1 auto;
         order: 50;
-        color: @col-text-primary-black;
+        color: @col-text;
         text-align: center;
     }
 
@@ -23,7 +23,7 @@
         font-size: 4em;
         font-weight: 300;
         margin: 0.8em 0 0 0;
-        color: @col-text-primary-black;
+        color: @col-text;
         text-decoration: none;
 
         &:hover {
diff --git a/src/_h5ai/client/css/inc/mixins.less b/src/_h5ai/client/css/inc/mixins.less
index 7df59898..81bb96e8 100644
--- a/src/_h5ai/client/css/inc/mixins.less
+++ b/src/_h5ai/client/css/inc/mixins.less
@@ -24,6 +24,24 @@
     transition: all 0.2s ease-in-out;
 }
 
+.flex-base {
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+    align-content: flex-start;
+    align-items: stretch;
+}
+
+.flex-column {
+    .flex-base;
+    flex-direction: column;
+}
+
+.flex-row {
+    .flex-base;
+    flex-direction: row;
+}
+
 .el-button {
     .card;
     .rounded;
@@ -44,7 +62,7 @@
     .clear-appearance;
     font-family: @font-family;
     font-weight: @font-weight;
-    color: @col-text-primary-black;
+    color: @col-text;
     background: @col-back-paper;
     border: none;
     outline: none;
diff --git a/src/_h5ai/client/css/inc/view/mainrow.less b/src/_h5ai/client/css/inc/view/mainrow.less
index cb906781..6d57f804 100644
--- a/src/_h5ai/client/css/inc/view/mainrow.less
+++ b/src/_h5ai/client/css/inc/view/mainrow.less
@@ -1,13 +1,7 @@
 #main-row {
+    .flex-row;
     flex: 1 1 auto;
     order: 50;
 
-    display: flex;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-    align-content: flex-start;
-    align-items: stretch;
-
     height: 0; // non-webkit fix;
 }
diff --git a/src/_h5ai/client/css/inc/view/root.less b/src/_h5ai/client/css/inc/view/root.less
index 588bd2e1..e6ee844c 100644
--- a/src/_h5ai/client/css/inc/view/root.less
+++ b/src/_h5ai/client/css/inc/view/root.less
@@ -1,4 +1,5 @@
 #root {
+    .flex-column;
     position: absolute;
     left: 0;
     top: 0;
@@ -8,13 +9,6 @@
     font-family: @font-family;
     font-size: @font-size;
     font-weight: @font-weight;
-    color: @col-text-primary-black;
+    color: @col-text;
     background: @col-back;
-
-    display: flex;
-    flex-direction: column;
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-    align-content: flex-start;
-    align-items: stretch;
 }
diff --git a/src/_h5ai/client/css/inc/view/topbar.less b/src/_h5ai/client/css/inc/view/topbar.less
index 1c4eb5e1..db727e32 100644
--- a/src/_h5ai/client/css/inc/view/topbar.less
+++ b/src/_h5ai/client/css/inc/view/topbar.less
@@ -1,15 +1,9 @@
 #topbar {
+    .flex-row;
     overflow: hidden;
     flex: 0 0 auto;
     order: 1;
 
-    display: flex;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-    align-content: flex-start;
-    align-items: stretch;
-
     background: @col-back-panel;
     box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
     z-index: 1;