3 <thead id="cs-table__head">
4 <tr class="cs-table__row">
5 <th scope="col" class="cs-table__action-col">Action</th>
6 <th scope="col" class="cs-table__connector-col">Connector</th>
7 <th scope="col" class="cs-table__status-col">Status</th>
8 <th scope="col" class="cs-table__name-col">Name</th>
9 <th scope="col" class="cs-table__model-col">Model</th>
10 <th scope="col" class="cs-table__vendor-col">Vendor</th>
11 <th scope="col" class="cs-table__firmware-col">Firmware Version</th>
14 <tbody id="cs-table__body">
16 v-for="chargingStation in chargingStations"
17 :key="chargingStation.hashId"
18 :charging-station="chargingStation"
25 <script setup lang="ts">
26 import CSData from './CSData.vue';
27 import { ChargingStationData } from '@/type/ChargingStationType';
29 const props = defineProps<{
30 chargingStations: ChargingStationData[];
39 background-color: white;
45 flex-direction: column;
46 overflow: auto hidden;
47 border-collapse: collapse;
54 /* flex-direction: column;
55 justify-content: space-evenly; */
58 /* box-sizing: border-box; */
67 /* overflow: visible scroll; */
68 overflow: visible overlay;
75 /* display: inline-block; */
77 /* align-content: stretch; */
78 /* align-items: baseline; */
80 #cs-table__head .cs-table__row {
81 background-color: rgb(194, 188, 188);
83 .cs-table__row:nth-of-type(even) {
84 background-color: rgb(223, 217, 217);
87 .cs-table__action-col,
88 .cs-table__connector-col,
89 .cs-table__status-col,
92 .cs-table__vendor-col,
93 .cs-table__firmware-col {
97 /* background-color: red; */
100 /* display: table-cell;
101 vertical-align: middle; */
103 .cs-table__action-col {
104 /* min-width: 200px; */
106 .cs-table__connector-col {
107 /* min-width: 120px; */
109 .cs-table__status-col {
110 /* min-width: 120px; */
112 .cs-table__name-col {
113 /* min-width: 120px; */
115 .cs-table__model-col {
116 /* min-width: 120px; */
118 .cs-table__vendor-col {
119 /* min-width: 120px; */
121 .cs-table__firmware-col {
122 /* min-width: 120px; */