From 78f664e8921e60983a456ca2759389d770c74712 Mon Sep 17 00:00:00 2001
From: Ziad-I <68874104+Ziad-I@users.noreply.github.com>
Date: Mon, 5 Aug 2024 14:48:55 +0300
Subject: [PATCH] fix CSS inconsistency and small errors

---
 .../bim/data/webui/static/css/drawings.css    | 53 ++++++++++++-------
 .../bim/data/webui/static/css/gantt.css       | 20 ++++---
 .../bim/data/webui/static/css/index.css       | 24 ++++-----
 .../bim/data/webui/templates/drawings.html    |  4 +-
 4 files changed, 61 insertions(+), 40 deletions(-)

diff --git a/src/blenderbim/blenderbim/bim/data/webui/static/css/drawings.css b/src/blenderbim/blenderbim/bim/data/webui/static/css/drawings.css
index 247608df95..eca6d4a8ed 100644
--- a/src/blenderbim/blenderbim/bim/data/webui/static/css/drawings.css
+++ b/src/blenderbim/blenderbim/bim/data/webui/static/css/drawings.css
@@ -39,7 +39,7 @@
 
 html {
     font-size: var(--base-font-size);
-    color: var(--blender-text);
+    color: var(--blender-text, var(--text-color));
 }
 
 body {
@@ -127,7 +127,7 @@ nav ul li a.active {
     overflow-y: auto;
     overflow: hidden;
     transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
-    border: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border: 1px solid var(--blender-tab-outline, var(--border-color));
     background-color: var(--blender-panel-background, var(--nav-bg-color));
     z-index: 1;
     opacity: 0;
@@ -146,7 +146,7 @@ nav ul li a.active {
 
 .client {
     padding: var(--margin-small);
-    border-bottom: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     cursor: pointer;
 }
 
@@ -166,14 +166,13 @@ nav ul li a.active {
 }
 
 .client-detail {
-    border-bottom: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     padding: var(--padding-small);
 }
 
 #show-connected-button {
     width: auto;
     background-color: var(--blender-panel-header, var(--bg-color));
-    border: none;
     font-size: var(--base-font-size);
 }
 
@@ -188,6 +187,32 @@ nav ul li a.active {
     margin-top: var(--margin-small);
 }
 
+footer {
+    background-color: var(--blender-top-bar-header, var(--nav-bg-color));
+    text-align: right;
+    padding: var(--padding-tiny);
+    border-top: 1px solid var(--blender-tab-outline, var(--nav-border-color));
+}
+
+footer p {
+    margin: 0;
+    color: var(--blender-text, var(--nav-link-color));
+    margin-right: var(--margin-small);
+    font-size: 0.8rem;
+}
+
+
+
+button {
+    background-color: var(--blender-panel-header, var(--bg-color));
+    color: var(--blender-text, var(--text-color));
+    border-color: var(--blender-tab-outline, var(--border-color));
+    transition: filter 0.2s ease;
+}
+
+button:hover {
+    filter: brightness(1.2);
+}
 
 .left {
     flex: 1;
@@ -265,20 +290,6 @@ li.svg-name {
     outline: none;
 }
 
-footer {
-    background-color: var(--blender-top-bar-header, var(--nav-bg-color));
-    text-align: right;
-    padding: var(--padding-tiny);
-    border-top: 1px solid var(--blender-tab-outline, var(--nav-border-color));
-}
-
-footer p {
-    margin: 0;
-    color: var(--blender-text, var(--nav-link-color));
-    margin-right: var(--margin-small);
-    font-size: 0.8rem;
-}
-
 /* remove bootstrap css confilcts */
 
 *,
@@ -290,4 +301,8 @@ footer p {
 .btn,
 .btn:hover {
     color: var(--blender-text, var(--nav-link-color));
+}
+
+button:focus {
+    outline: none;
 }
\ No newline at end of file
diff --git a/src/blenderbim/blenderbim/bim/data/webui/static/css/gantt.css b/src/blenderbim/blenderbim/bim/data/webui/static/css/gantt.css
index d0cb83a786..1443d86cbb 100644
--- a/src/blenderbim/blenderbim/bim/data/webui/static/css/gantt.css
+++ b/src/blenderbim/blenderbim/bim/data/webui/static/css/gantt.css
@@ -35,7 +35,7 @@
     --group-item-bg-color: #4b4b4b;
     --input-bg-color: #3b3b3b;
     --input-border-color: #000;
-    --details-border-color: #464444;
+    --border-color: #464444;
 }
 
 :root.light {
@@ -47,7 +47,7 @@
     --nav-link-color: #000000;
     --nav-link-hover-color: #38a63d;
     --warning-color: #FF4500;
-    --details-border-color: #222;
+    --border-color: #222;
 }
 
 html {
@@ -158,7 +158,7 @@ nav ul li a.active {
     overflow-y: auto;
     overflow: hidden;
     transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
-    border: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border: 1px solid var(--blender-tab-outline, var(--border-color));
     background-color: var(--blender-panel-background, var(--nav-bg-color));
     z-index: 1;
     opacity: 0;
@@ -177,7 +177,7 @@ nav ul li a.active {
 
 .client {
     padding: var(--margin-small);
-    border-bottom: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     cursor: pointer;
 }
 
@@ -197,14 +197,13 @@ nav ul li a.active {
 }
 
 .client-detail {
-    border-bottom: 1px solid var(--blender-tab-outline, var(--details-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     padding: var(--padding-small);
 }
 
 #show-connected-button {
     width: auto;
     background-color: var(--blender-panel-header, var(--bg-color));
-    border: none;
     font-size: var(--base-font-size);
 }
 
@@ -258,7 +257,14 @@ footer p {
     transition: filter 0.2s ease;
 }
 
-:root.blender button:hover {
+button {
+    background-color: var(--blender-panel-header, var(--bg-color));
+    color: var(--blender-text, var(--text-color));
+    border-color: var(--blender-tab-outline, var(--border-color));
+    transition: filter 0.2s ease;
+}
+
+button:hover {
     filter: brightness(1.2);
 }
 
diff --git a/src/blenderbim/blenderbim/bim/data/webui/static/css/index.css b/src/blenderbim/blenderbim/bim/data/webui/static/css/index.css
index 87c653986a..682466a3f7 100644
--- a/src/blenderbim/blenderbim/bim/data/webui/static/css/index.css
+++ b/src/blenderbim/blenderbim/bim/data/webui/static/css/index.css
@@ -22,7 +22,7 @@
     --nav-link-color: #fff;
     --nav-link-hover-color: #3fb449;
     --warning-color: #FFDB8F;
-    --table-border-color: #464444;
+    --border-color: #464444;
 }
 
 :root.light {
@@ -34,7 +34,7 @@
     --nav-link-color: #000000;
     --nav-link-hover-color: #38a63d;
     --warning-color: #FF4500;
-    --table-border-color: #222;
+    --border-color: #222;
 }
 
 html {
@@ -127,7 +127,7 @@ nav ul li a.active {
     overflow-y: auto;
     overflow: hidden;
     transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
-    border: 1px solid var(--blender-tab-outline, var(--table-border-color));
+    border: 1px solid var(--blender-tab-outline, var(--border-color));
     background-color: var(--blender-panel-background, var(--nav-bg-color));
     z-index: 1;
     opacity: 0;
@@ -146,7 +146,7 @@ nav ul li a.active {
 
 .client {
     padding: var(--margin-small);
-    border-bottom: 1px solid var(--blender-tab-outline, var(--table-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     cursor: pointer;
 }
 
@@ -166,7 +166,7 @@ nav ul li a.active {
 }
 
 .client-detail {
-    border-bottom: 1px solid var(--blender-tab-outline, var(--table-border-color));
+    border-bottom: 1px solid var(--blender-tab-outline, var(--border-color));
     padding: var(--padding-small);
 }
 
@@ -210,14 +210,14 @@ footer p {
     margin-top: var(--margin-small);
 }
 
-:root.blender button {
-    background-color: var(--blender-panel-header);
-    color: var(--blender-text);
-    border-color: var(--blender-tab-outline);
+button {
+    background-color: var(--blender-panel-header, var(--bg-color));
+    color: var(--blender-text, var(--text-color));
+    border-color: var(--blender-tab-outline, var(--border-color));
     transition: filter 0.2s ease;
 }
 
-:root.blender button:hover {
+button:hover {
     filter: brightness(1.2);
 }
 
@@ -230,8 +230,8 @@ footer p {
 }
 
 :root.light .tabulator {
-    border-top: 1px solid var(--table-border-color);
-    border-bottom: 2px solid var(--table-border-color);
+    border-top: 1px solid var(--border-color);
+    border-bottom: 2px solid var(--border-color);
 }
 
 :root.blender .tabulator-table-holder,
diff --git a/src/blenderbim/blenderbim/bim/data/webui/templates/drawings.html b/src/blenderbim/blenderbim/bim/data/webui/templates/drawings.html
index c8de433b71..88c0ea44b6 100644
--- a/src/blenderbim/blenderbim/bim/data/webui/templates/drawings.html
+++ b/src/blenderbim/blenderbim/bim/data/webui/templates/drawings.html
@@ -82,7 +82,7 @@
             <div class="card pb-2">
               <div class="card-header overflow-hidden" id="headingOne">
                 <button
-                  class="btn p-0 w-100 text-left"
+                  class="btn p-0 pl-2 w-100 text-left"
                   data-toggle="collapse"
                   data-target="#collapseOne"
                 >
@@ -101,7 +101,7 @@
             <div class="card pb-2">
               <div class="card-header overflow-hidden" id="headingTwo">
                 <button
-                  class="btn p-0 w-100 text-left"
+                  class="btn p-0 pl-2 w-100 text-left"
                   data-toggle="collapse"
                   data-target="#collapseTwo"
                 >