From aeb6f766111604fdc75c7aeb26d3198f15c6b8b5 Mon Sep 17 00:00:00 2001
From: coderaiser <coderaiser@cloudcmd.io>
Date: Mon, 30 Dec 2019 12:08:39 +0200
Subject: [PATCH] chore(css) add custom variables: --color, --color-transparent

---
 css/query.css     |  2 +-
 css/style.css     | 13 +++++++++----
 css/user-menu.css |  2 +-
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/css/query.css b/css/query.css
index 0765b65205..eb32035162 100644
--- a/css/query.css
+++ b/css/query.css
@@ -99,7 +99,7 @@
     
     /* текущий файл под курсором */
     .current-file {
-        background-color: rgba(49, 123, 249, .40);
+        background-color: var(--color-transparent);
         color: white;
     }
     /* делаем иконки под курсом белыми */
diff --git a/css/style.css b/css/style.css
index 9e762a3753..5bcd53fb0a 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,3 +1,8 @@
+:root {
+    --color: rgba(49, 123, 249);
+    --color-transparent: rgba(49, 123, 249, 0.4);
+}
+
 html {
     height           : 94%;
 }
@@ -42,7 +47,7 @@ body, pre, code {
 
 .panel, .cmd-button {
     border: 1px solid;
-    border-color: rgba(49, 123, 249, 0.4);
+    border-color: var(--color-transparent);
 }
 
 .icon {
@@ -89,7 +94,7 @@ body, pre, code {
     bottom      : 5px;
     left        : 16px;
     font-size   : 10px;
-    color       : rgb(49, 123, 249);
+    color       : var(--color);
     content     : attr(data-progress);
 }
 
@@ -109,7 +114,7 @@ body, pre, code {
 
 .cmd-button:active {
     color: white;
-    background-color: rgb(49, 123, 249);
+    background-color: var(--color);
     transition: ease 0.1s;
 }
 
@@ -159,7 +164,7 @@ a:hover, a:active {
 }
 
 .current-file {
-    box-shadow: 0 0 0 1px rgba(49, 123, 249, 0.4) inset;
+    box-shadow: 0 0 0 1px var(--color-transparent) inset;
 }
 
 .cut-file {
diff --git a/css/user-menu.css b/css/user-menu.css
index bc806ce9a7..7ce0e97167 100644
--- a/css/user-menu.css
+++ b/css/user-menu.css
@@ -8,7 +8,7 @@
 }
 
 .cloudcmd-user-menu > option:checked {
-    box-shadow: 20px -20px 0 2px rgba(49, 123, 249) inset;
+    box-shadow: 20px -20px 0 2px var(--color) inset;
 }
 
 .cloudcmd-user-menu-button {