refactoring

8 files changed, 37 insertions, 37 deletions

diff --git a/web/css/keyboard.css b/web/css/keyboard.css
index ebe1d95e..ce7468d0 100644
--- a/web/css/keyboard.css
+++ b/web/css/keyboard.css
@@ -30,8 +30,8 @@ div.keyboard div.key, div.modifier {
 	font-size: 0.9em;
 	text-align: center;
 	vertical-align: top;
-	box-shadow: var(--micro-shadow);
-	border: var(--grey-border);
+	box-shadow: var(--shadow-micro);
+	border: var(--border-gray-thin);
 	border-radius: 6px;
 	color: var(--fg-color-normal);
 	background-color: var(--bg-color-gray);
diff --git a/web/css/main.css b/web/css/main.css
index e185b14b..41730777 100644
--- a/web/css/main.css
+++ b/web/css/main.css
@@ -22,7 +22,7 @@ a {
 
 hr {
 	border: none;
-	border-top: var(--normal-border);
+	border-top: var(--border-normal-thin);
 }
 
 button, select {
@@ -93,7 +93,7 @@ select:active {
 	width: 16.66%
 }
 .row50:not(:first-child), .row25:not(:first-child), .row16:not(:first-child) {
-	border-left: var(--dark-border);
+	border-left: var(--border-dark-thin);
 }
 
 img#logo {
@@ -104,7 +104,7 @@ img#logo {
 }
 
 ul#ctl {
-	box-shadow: var(--small-shadow);
+	box-shadow: var(--shadow-small);
 	list-style-type: none;
 	margin: 0;
 	padding: 0;
@@ -132,7 +132,7 @@ ul#ctl li a.ctl-item {
 	line-height: 50px;
 	outline: none;
 	cursor: pointer;
-	border-left: var(--black-border);
+	border-left: var(--border-black-thin);
 	display: inline-block;
 	color: var(--fg-color-normal);
 	padding-left: 16px;
@@ -150,13 +150,13 @@ div.ctl-dropdown-content {
 	visibility: hidden;
 	overflow: hidden;
 	white-space: nowrap;
-	border: var(--intensive-border);
-	border-top: var(--dark-border);
+	border: var(--border-intensive-2px);
+	border-top: var(--border-dark-thin);
 	border-radius: 0 0 8px 8px;
 	position: absolute;
 	background-color: var(--bg-color-ctl);
 	min-width: 180px;
-	box-shadow: var(--big-shadow);
+	box-shadow: var(--shadow-big);
 	z-index: 2147483645;
 }
 div.ctl-dropdown-content button, select {
@@ -174,7 +174,7 @@ div.ctl-dropdown-content hr {
 	height: 0px;
 	padding: 0;
 	border: none;
-	border-top: var(--dark-border);
+	border-top: var(--border-dark-thin);
 }
 div.ctl-dropdown-content-buttons {
 	background-color: var(--bg-color-normal);
diff --git a/web/css/modals.css b/web/css/modals.css
index cfb0df20..4d49815e 100644
--- a/web/css/modals.css
+++ b/web/css/modals.css
@@ -15,15 +15,15 @@ div.modal-window {
 	outline: none;
 	margin: 15% auto;
 	overflow: hidden;
-	border: var(--dark-border);
+	border: var(--border-dark-thin);
 	border-radius: 8px;
 	box-sizing: border-box;
-	box-shadow: var(--big-shadow);
+	box-shadow: var(--shadow-big);
 	background-color: var(--bg-color-light);
 	padding: 0;
 }
 div.modal-window:focus {
-	border: var(--intensive-border) !important;
+	border: var(--border-intensive-2px) !important;
 }
 
 
@@ -31,7 +31,7 @@ div.modal-header {
 	text-align: center;
 	font-weight: bold;
 	padding: 3px 9px 3px 9px;
-	border-bottom: var(--normal-border);
+	border-bottom: var(--border-normal-thin);
 }
 
 div.modal-content {
@@ -41,7 +41,7 @@ div.modal-content {
 }
 
 div.modal-buttons {
-	border-top: var(--dark-border);
+	border-top: var(--border-dark-thin);
 	margin: 0;
 	padding: 0;
 	font-size: 0;
diff --git a/web/css/sliders.css b/web/css/sliders.css
index 8e60e078..5fcfb6cf 100644
--- a/web/css/sliders.css
+++ b/web/css/sliders.css
@@ -28,7 +28,7 @@ input[type=range].slider::-webkit-slider-runnable-track {
 }
 
 input[type=range].slider::-webkit-slider-thumb {
-	border: var(--intensive-border);
+	border: var(--border-intensive-2px);
 	height: 18px;
 	width: 18px;
 	border-radius: 25px;
@@ -37,7 +37,7 @@ input[type=range].slider::-webkit-slider-thumb {
 	margin-top: -7px;
 }
 input[type=range].slider:disabled::-webkit-slider-thumb {
-	border: var(--inactive-border);
+	border: var(--border-inactive-2px);
 	background: var(--bg-color-normal);
 }
 
@@ -48,13 +48,13 @@ input[type=range].slider::-moz-range-track {
 }
 
 input[type=range].slider::-moz-range-thumb {
-	border: var(--intensive-border);
+	border: var(--border-intensive-2px);
 	height: 18px;
 	width: 18px;
 	border-radius: 25px;
 	background: var(--bg-color-intensive);
 }
 input[type=range].slider:disabled::-moz-range-thumb {
-	border: var(--inactive-border);
+	border: var(--border-inactive-2px);
 	background: var(--bg-color-normal);
 }
diff --git a/web/css/stream.css b/web/css/stream.css
index d0166fa9..b5b9d57c 100644
--- a/web/css/stream.css
+++ b/web/css/stream.css
@@ -22,7 +22,7 @@ img.stream-image-inactive {
 div#stream-box {
 	position: relative;
 	display: inline-block;
-	border: var(--dark-border);
+	border: var(--border-dark-thin);
 }
 div.stream-box-inactive::after {
 	cursor: wait;
diff --git a/web/css/switches.css b/web/css/switches.css
index 3a97b072..08e50033 100644
--- a/web/css/switches.css
+++ b/web/css/switches.css
@@ -63,7 +63,7 @@ div.switch-box span.switch {
 	top: 0;
 	bottom: 0;
 	right: 31px;
-	border: var(--intensive-border);
+	border: var(--border-intensive-2px);
 	border-radius: 15px;
 }
 
diff --git a/web/css/vars.css b/web/css/vars.css
index 73143366..7fd8b3a9 100644
--- a/web/css/vars.css
+++ b/web/css/vars.css
@@ -17,20 +17,20 @@
 	--bg-color-stream-screen: black;
 
 	--border-color-normal: var(--bg-color-normal);
-	--border-color-grey: var(--bg-color-ctl);
+	--border-color-gray: var(--bg-color-ctl);
 	--border-color-dark: var(--bg-color-dark);
 	--border-color-intensive: #5b90bb;
 	--border-color-important: #ff6467;
 
-	--dark-border: thin solid var(--border-color-dark);
-	--grey-border: thin solid var(--border-color-grey);
-	--normal-border: thin solid var(--border-color-normal);
-	--black-border: thin solid black;
-	--inactive-border: 2px solid var(--border-color-normal);
-	--intensive-border: 2px solid var(--border-color-intensive);
-	--thin-intensive-border: thin solid var(--border-color-intensive);
+	--border-dark-thin: thin solid var(--border-color-dark);
+	--border-gray-thin: thin solid var(--border-color-gray);
+	--border-normal-thin: thin solid var(--border-color-normal);
+	--border-black-thin: thin solid black;
+	--border-inactive-2px: 2px solid var(--border-color-normal);
+	--border-intensive-2px: 2px solid var(--border-color-intensive);
+	--border-intensive-thin: thin solid var(--border-color-intensive);
 
-	--micro-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.4);
-	--small-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
-	--big-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
+	--shadow-micro: 1px 2px 4px 0 rgba(0, 0, 0, 0.4);
+	--shadow-small: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
+	--shadow-big: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
 }
diff --git a/web/css/windows.css b/web/css/windows.css
index 151ca59a..5c183f07 100644
--- a/web/css/windows.css
+++ b/web/css/windows.css
@@ -3,16 +3,16 @@ div.window {
 	outline: none;
 	overflow: hidden;
 	position: fixed;
-	border: var(--dark-border);
+	border: var(--border-dark-thin);
 	border-radius: 8px;
 	box-sizing: border-box;
-	box-shadow: var(--big-shadow);
+	box-shadow: var(--shadow-big);
 	white-space: nowrap;
 	background-color: var(--bg-color-light);
 	padding: 30px 9px 9px 9px;
 }
 div.window:focus {
-	border: var(--intensive-border) !important;
+	border: var(--border-intensive-2px) !important;
 }
 
 div.window-header {
@@ -25,7 +25,7 @@ div.window-header {
 	height: 20px;
 	font-size: 0.8em;
 	color: var(--fg-color-dark);
-	border-bottom: var(--normal-border);
+	border-bottom: var(--border-normal-thin);
 }
 
 div.window-grab {
@@ -42,7 +42,7 @@ div.window-grab {
 div.window-header-grabbed {
 	color: var(--fg-color-intensive);
 	background-color: var(--bg-color-intensive);
-	border-bottom: var(--thin-intensive-border);
+	border-bottom: var(--border-intensive-thin);
 }
 
 button.window-button-close {