From 651851beca45203902e777efe0b86a313beaf3cb Mon Sep 17 00:00:00 2001
From: Zack Spear <hi@zackspear.com>
Date: Wed, 26 Jun 2024 18:11:30 -0700
Subject: [PATCH] refactor: docker.vm.manager VMMachines css vars

---
 .../sheets/VMMachines-azure.css               | 10 ----
 .../sheets/VMMachines-black.css               | 10 ----
 .../sheets/VMMachines-gray.css                | 10 ----
 .../sheets/VMMachines-white.css               | 10 ----
 .../dynamix.vm.manager/sheets/VMMachines.css  | 46 +++++++++++++------
 5 files changed, 33 insertions(+), 53 deletions(-)
 delete mode 100644 emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-azure.css
 delete mode 100644 emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-black.css
 delete mode 100644 emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-gray.css
 delete mode 100644 emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-white.css

diff --git a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-azure.css b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-azure.css
deleted file mode 100644
index 6d1f08e3c..000000000
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-azure.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.fileTree {
-    background: #f2f2f2;
-    width: 500px;
-    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
diff --git a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-black.css b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-black.css
deleted file mode 100644
index 5e2c6fa75..000000000
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-black.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.fileTree {
-    background: #1c1c1c;
-    width: 500px;
-    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
diff --git a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-gray.css b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-gray.css
deleted file mode 100644
index 5e2c6fa75..000000000
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-gray.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.fileTree {
-    background: #1c1c1c;
-    width: 500px;
-    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
diff --git a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-white.css b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-white.css
deleted file mode 100644
index 6d1f08e3c..000000000
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines-white.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.fileTree {
-    background: #f2f2f2;
-    width: 500px;
-    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
diff --git a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css
index f90391a00..045a4cedb 100644
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css
@@ -1,3 +1,12 @@
+:root {
+    --vm-machines-file-tree-background: var(--black);
+}
+
+.Theme--azure:root,
+.Theme--white:root {
+    --vm-machines-file-tree-background: var(--gray-100);
+}
+
 th.th1 {
     width: 25%;
 }
@@ -69,42 +78,42 @@ i.fa-dot-circle-o {
 }
 .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button[disabled] {
     cursor: default;
-    color: #808080;
+    color: var(--gray-500);
     background:
         -webkit-gradient(
                 linear,
                 left top,
                 right top,
-                from(#404040),
-                to(#808080)
+                from(var(--gray-600)),
+                to(var(--gray-500))
             )
             0 0 no-repeat,
         -webkit-gradient(
                 linear,
                 left top,
                 right top,
-                from(#404040),
-                to(#808080)
+                from(var(--gray-600)),
+                to(var(--gray-500))
             ) 0 100% no-repeat,
         -webkit-gradient(
                 linear,
                 left bottom,
                 left top,
-                from(#404040),
-                to(#404040)
+                from(var(--gray-600)),
+                to(var(--gray-600))
             ) 0 100% no-repeat,
         -webkit-gradient(
                 linear,
                 left bottom,
                 left top,
-                from(#808080),
-                to(#808080)
+                from(var(--gray-500)),
+                to(var(--gray-500))
             ) 100% 100% no-repeat;
     background:
-        linear-gradient(90deg, #404040 0, #808080) 0 0 no-repeat,
-        linear-gradient(90deg, #404040 0, #808080) 0 100% no-repeat,
-        linear-gradient(0deg, #404040 0, #404040) 0 100% no-repeat,
-        linear-gradient(0deg, #808080 0, #808080) 100% 100% no-repeat;
+        linear-gradient(90deg, var(--gray-600) 0, var(--gray-500)) 0 0 no-repeat,
+        linear-gradient(90deg, var(--gray-600) 0, var(--gray-500)) 0 100% no-repeat,
+        linear-gradient(0deg, var(--gray-600) 0, var(--gray-600)) 0 100% no-repeat,
+        linear-gradient(0deg, var(--gray-500) 0, var(--gray-500)) 100% 100% no-repeat;
     background-size:
         100% 2px,
         100% 2px,
@@ -118,3 +127,14 @@ span.vmgraphics {
     font-size: 1.1rem;
     text-align: left;
 }
+
+.fileTree {
+    background: var(--vm-machines-file-tree-background);
+    width: 500px;
+    max-height: 320px;
+    overflow-y: scroll;
+    overflow-x: hidden;
+    position: absolute;
+    z-index: 100;
+    display: none;
+}