From 96d0ba3e0abf650e27840a3a21a526a3da47f17b Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 14 Aug 2023 15:18:59 +0200
Subject: [PATCH] refs 5987 fix media queries

---
 src/components/ui/CardDescriptor.vue       |  3 +--
 src/components/ui/CardList.vue             | 11 +++++++----
 src/pages/Ticket/Card/TicketDescriptor.vue |  2 +-
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index dfc92344b..d5dd9b371 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -193,14 +193,13 @@ body.body--light {
 </style>
 
 <style lang="scss" scoped>
-$descriptor--light: rgb(87 86 86 / 6%);
 body.body--light {
     .descriptor {
         .subtitle {
             color: $gray;
         }
         .list-box {
-            background-color: $descriptor--light;
+            background-color: $lighter-gray;
         }
     }
 }
diff --git a/src/components/ui/CardList.vue b/src/components/ui/CardList.vue
index b63c8d08c..75e609eb5 100644
--- a/src/components/ui/CardList.vue
+++ b/src/components/ui/CardList.vue
@@ -109,21 +109,24 @@ body.body--light {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     row-gap: 10px;
-    column-gap: 10vw;
     margin-right: 10px;
 }
-
 .actions {
     display: flex;
     flex-direction: column;
     justify-content: center;
 }
-@media (min-width: 1024px) and (max-width: 1100px) {
+@media screen and (min-width: $breakpoint-lg) {
+    .list-items {
+        column-gap: 10vw;
+    }
+}
+@media screen and (min-width: $breakpoint-sm) {
     .list-items {
         column-gap: 5vw;
     }
 }
-@media (max-width: 600px) {
+@media (max-width: $breakpoint-xs) {
     .list-items {
         grid-template-columns: 1fr;
         grid-gap: 5px;
diff --git a/src/pages/Ticket/Card/TicketDescriptor.vue b/src/pages/Ticket/Card/TicketDescriptor.vue
index 4380b9f07..89565f486 100644
--- a/src/pages/Ticket/Card/TicketDescriptor.vue
+++ b/src/pages/Ticket/Card/TicketDescriptor.vue
@@ -88,7 +88,7 @@ const setData = (entity) =>
         <template #body="{ entity }">
             <VnLv v-if="entity.ticketState" :label="t('ticket.card.state')">
                 <template #value>
-                    <QBadge :color="entity.ticketState.state.classColor ?? 'primary'">
+                    <QBadge :color="entity.ticketState.state.classColor">
                         {{ entity.ticketState.state.name }}
                     </QBadge>
                 </template>