From: Jérôme Benoit <jerome.benoit@sap.com>
Date: Sat, 17 Feb 2024 14:37:04 +0000 (+0100)
Subject: refactor(ui): refine tables CSS
X-Git-Tag: v1.2.37~30
X-Git-Url: https://git.piment-noir.org/?a=commitdiff_plain;h=b002bbab128f876af40ac81686a771e39e3021fd;p=e-mobility-charging-stations-simulator.git

refactor(ui): refine tables CSS

Signed-off-by: Jérôme Benoit <jerome.benoit@sap.com>
---

diff --git a/ui/web/src/components/charging-stations/CSData.vue b/ui/web/src/components/charging-stations/CSData.vue
index b11ad0fe..44aed709 100644
--- a/ui/web/src/components/charging-stations/CSData.vue
+++ b/ui/web/src/components/charging-stations/CSData.vue
@@ -162,14 +162,13 @@ function deleteChargingStation(): void {
 <style>
 #connectors-table {
   display: flex;
-  background-color: white;
   flex-direction: column;
+  background-color: white;
   overflow: auto hidden;
   border-collapse: collapse;
   empty-cells: show;
 }
 
-#connectors-table__head,
 #connectors-table__body {
   display: flex;
   flex-direction: column;
@@ -177,18 +176,19 @@ function deleteChargingStation(): void {
 
 .connectors-table__row {
   display: flex;
+  flex-direction: row;
   justify-content: center;
   align-items: center;
 }
 
-#connectors-table__head .connectors-table__row {
-  background-color: lightgrey;
-}
-
 .connectors-table__row:nth-of-type(even) {
   background-color: whitesmoke;
 }
 
+#connectors-table__head .connectors-table__row {
+  background-color: lightgrey;
+}
+
 .connectors-table__column {
   width: calc(100% / 5);
   text-align: center;
diff --git a/ui/web/src/components/charging-stations/CSTable.vue b/ui/web/src/components/charging-stations/CSTable.vue
index 3d9efbbf..05a8255f 100644
--- a/ui/web/src/components/charging-stations/CSTable.vue
+++ b/ui/web/src/components/charging-stations/CSTable.vue
@@ -51,7 +51,6 @@ const props = defineProps<{
   empty-cells: show;
 }
 
-#cs-table__head,
 #cs-table__body {
   height: fit-content;
   width: 100%;
@@ -71,14 +70,11 @@ const props = defineProps<{
   height: fit-content;
   width: 100%;
   display: flex;
+  flex-direction: row;
   justify-content: center;
   align-items: center;
 }
 
-#cs-table__head .cs-table__row {
-  background-color: lightgrey;
-}
-
 .cs-table__row:nth-of-type(even) {
   background-color: whitesmoke;
 }
@@ -89,9 +85,12 @@ const props = defineProps<{
   text-align: center;
 }
 
+#cs-table__head .cs-table__row {
+  background-color: lightgrey;
+}
+
 .cs-table__connectors-column {
   height: fit-content;
   width: 35%;
-  text-align: center;
 }
 </style>