Interface SAV

src/assets/style.scss

@@ -1,4 +1,5 @@
+@import "bootstrap/scss/bootstrap.scss";
+
 #app {
-  @import "bootstrap/scss/bootstrap.scss";
   @import "niceAdmin.scss";
-}
+}

src/components/TicketList.vue

@@ -19,7 +19,7 @@ const grid = new Grid({
       formatter: (cell) => format(new Date(cell), 'dd/MM/yyyy HH:mm:ss')
     }, {
       name: 'Origine',
-      formatter: (cell, row) => html(`${cell} <br/> ${row.cells[3].data}`)
+      formatter: (cell, row) => html(`<span class=" fw-bold text-${row.cells[4].data.filter1Color}">${cell}</span>` + ((row.cells[3].data !== null) ?  `<br/> ${row.cells[3].data}` : ''))
 
     },
     {name: 'Origine 2', hidden: true},

src/style.css

@@ -24,4 +24,67 @@ body{
 .fade-enter-from,
 .fade-leave-to {
   opacity: 0;
-}
+}
+
+.gridjs-head {
+  padding: 10px 0 5px 0 !important;
+}
+
+.gridjs-wrapper .green {
+  color: green;
+  font-weight: bold;
+}
+
+.gridjs-wrapper .red {
+  color: red;
+  font-weight: bold;
+}
+
+.gridjs-wrapper .orange {
+  color: orange;
+  font-weight: bold;
+}
+
+.gridjs-wrapper .black {
+  color: black;
+}
+
+/*.gridjs-footer,*/
+/*.gridjs-wrapper {*/
+/*  width: 99% !important;*/
+/*}*/
+
+.gridjs-wrapper {
+  font-size: 0.95rem !important;
+  border-top: 1px solid #e5e7eb !important;
+}
+
+/*.gridjs-wrapper table td:last-child button{*/
+/*  padding: 0.375rem*/
+/*}*/
+
+/*@media (min-width: 1280px) {*/
+/*  .gridjs-wrapper table td:last-child button{*/
+/*    padding: 0.375rem 0.75rem;*/
+/*  }*/
+/*}*/
+
+tr.gridjs-tr:nth-child(odd) td {
+  background-color: #eeeded !important;
+}
+
+th.gridjs-th {
+  white-space: normal !important;
+  color: #000000 !important;
+}
+
+.gridjs-th-sort button {
+  border-width: 0;
+  color: white;
+  background-color: transparent !important;
+}
+
+
+.gridjs-wrapper tr:hover td{
+  background-color: lightblue !important;
+}