refactor(ui): improve the charging stations list styles

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

diff --git a/ui/web/src/components/actions/SetSupervisionUrl.vue b/ui/web/src/components/actions/SetSupervisionUrl.vue
index e50316bf844f57775adb8712865f78adcae997ea..33b6767bd093b4d9d4ff7ecb2d358615d9bb4994 100644 (file)
--- a/ui/web/src/components/actions/SetSupervisionUrl.vue
+++ b/ui/web/src/components/actions/SetSupervisionUrl.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance, reactive } from 'vue'
+import { defineProps, getCurrentInstance, reactive } from 'vue'
 import Button from '@/components/buttons/Button.vue'
 
 const props = defineProps<{

diff --git a/ui/web/src/components/actions/StartTransaction.vue b/ui/web/src/components/actions/StartTransaction.vue
index 5e83983f34512ab1057d65f98a069bafc3c1200d..b887357bf81761ee33e76c9bcde418b224dde7eb 100644 (file)
--- a/ui/web/src/components/actions/StartTransaction.vue
+++ b/ui/web/src/components/actions/StartTransaction.vue
@@ -30,7 +30,7 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance, reactive } from 'vue'
+import { defineProps, getCurrentInstance, reactive } from 'vue'
 import Button from '@/components/buttons/Button.vue'
 
 const props = defineProps<{

diff --git a/ui/web/src/components/buttons/ReloadButton.vue b/ui/web/src/components/buttons/ReloadButton.vue
index 2fa291af8ae536ceaf4adcfb486482bda08f637e..3ff4bc89915ca838c9b87ee255bcc53a59ecaadb 100644 (file)
--- a/ui/web/src/components/buttons/ReloadButton.vue
+++ b/ui/web/src/components/buttons/ReloadButton.vue
@@ -5,6 +5,7 @@
 </template>
 
 <script setup lang="ts">
+import { defineProps } from 'vue'
 import FlatButton from '@/components/buttons/FlatButton.vue'
 
 defineProps<{

diff --git a/ui/web/src/components/charging-stations/CSConnector.vue b/ui/web/src/components/charging-stations/CSConnector.vue
index 7c31ae988e1f64b6363361ab7b870c44219b4b8e..cb03fbca9f77bc3ae29e58ebe1561039796c9ad7 100644 (file)
--- a/ui/web/src/components/charging-stations/CSConnector.vue
+++ b/ui/web/src/components/charging-stations/CSConnector.vue
@@ -27,7 +27,7 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance } from 'vue'
+import { defineProps, getCurrentInstance } from 'vue'
 import { useToast } from 'vue-toast-notification'
 import Button from '@/components/buttons/Button.vue'
 import type { ConnectorStatus, Status } from '@/types'

diff --git a/ui/web/src/components/charging-stations/CSData.vue b/ui/web/src/components/charging-stations/CSData.vue
index 4cd878baaceb6f86034cb1a98f8b3c293f26d8d6..22ed784f2ac94255b3b35ab0d8df7e44cbada873 100644 (file)
--- a/ui/web/src/components/charging-stations/CSData.vue
+++ b/ui/web/src/components/charging-stations/CSData.vue
@@ -67,7 +67,7 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance } from 'vue'
+import { defineProps, getCurrentInstance } from 'vue'
 import { useToast } from 'vue-toast-notification'
 import CSConnector from '@/components/charging-stations/CSConnector.vue'
 import Button from '@/components/buttons/Button.vue'
@@ -195,6 +195,7 @@ const deleteChargingStation = (): void => {
   flex-direction: row;
   justify-content: center;
   align-items: center;
+  border: solid 0.25px black;
 }
 
 .connectors-table__row:nth-of-type(even) {

diff --git a/ui/web/src/components/charging-stations/CSTable.vue b/ui/web/src/components/charging-stations/CSTable.vue
index cc826287e2384f7600d1494ca8a5e18f4917f950..49d576e51d0bb510b52c0741b87e165e9872cf95 100644 (file)
--- a/ui/web/src/components/charging-stations/CSTable.vue
+++ b/ui/web/src/components/charging-stations/CSTable.vue
@@ -29,6 +29,7 @@
 </template>
 
 <script setup lang="ts">
+import { defineProps } from 'vue'
 import CSData from '@/components/charging-stations/CSData.vue'
 import type { ChargingStationData } from '@/types'
 
@@ -71,6 +72,7 @@ defineProps<{
   flex-direction: row;
   justify-content: center;
   align-items: center;
+  border: solid 0.5px black;
 }
 
 .cs-table__row:nth-of-type(even) {
@@ -79,7 +81,7 @@ defineProps<{
 
 .cs-table__column {
   height: fit-content;
-  width: calc(65% / 10);
+  width: calc(60% / 10);
   text-align: center;
 }
 
@@ -89,6 +91,6 @@ defineProps<{
 
 .cs-table__connectors-column {
   height: fit-content;
-  width: 35%;
+  width: 40%;
 }
 </style>