src/css/app.scss

@@ -130,4 +130,4 @@ input::-webkit-inner-spin-button {
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
-}
+}

src/i18n/en/index.js

@@ -499,6 +499,7 @@ export default {
             request: 'Request',
             weight: 'Weight',
             goTo: 'Go to',
+            summaryAmount: 'Summary',
         },
     },
     claim: {

src/i18n/es/index.js

@@ -498,6 +498,7 @@ export default {
             request: 'Petición de compra',
             weight: 'Peso',
             goTo: 'Ir a',
+            summaryAmount: 'Resumen',
         },
     },
     claim: {

src/pages/Ticket/Card/TicketSummary.vue

@@ -131,22 +131,6 @@ async function changeState(value) {
             </QBtnDropdown>
         </template>
         <template #body>
-            <QCard class="vn-max">
-                <div class="taxes">
-                    <VnLv
-                        :label="t('ticket.summary.subtotal')"
-                        :value="toCurrency(ticket.totalWithoutVat)"
-                    />
-                    <VnLv
-                        :label="t('ticket.summary.vat')"
-                        :value="toCurrency(ticket.totalWithVat - ticket.totalWithoutVat)"
-                    />
-                    <VnLv
-                        :label="t('ticket.summary.total')"
-                        :value="toCurrency(ticket.totalWithVat)"
-                    />
-                </div>
-            </QCard>
             <QCard class="vn-one">
                 <VnTitle
                     :url="ticketUrl + 'basic-data/step-one'"
@@ -236,7 +220,7 @@ async function changeState(value) {
                     :value="formattedAddress()"
                 />
             </QCard>
-            <QCard class="vn-one">
+            <QCard class="vn-one" v-if="ticket.notes.length">
                 <VnTitle
                     :url="ticketUrl + 'observation'"
                     :text="t('ticket.pageTitles.notes')"
@@ -258,6 +242,23 @@ async function changeState(value) {
                     </template>
                 </VnLv>
             </QCard>
+            <QCard class="vn-one">
+                <VnTitle :text="t('ticket.summary.summaryAmount')" />
+                <div class="bodyCard">
+                    <VnLv
+                        :label="t('ticket.summary.subtotal')"
+                        :value="toCurrency(ticket.totalWithoutVat)"
+                    />
+                    <VnLv
+                        :label="t('ticket.summary.vat')"
+                        :value="toCurrency(ticket.totalWithVat - ticket.totalWithoutVat)"
+                    />
+                    <VnLv
+                        :label="t('ticket.summary.total')"
+                        :value="toCurrency(ticket.totalWithVat)"
+                    />
+                </div>
+            </QCard>
             <QCard class="vn-max">
                 <VnTitle
                     :url="ticketUrl + 'sale'"
@@ -448,21 +449,10 @@ async function changeState(value) {
 .notes {
     width: max-content;
 }
-.cardSummary .summaryBody > .q-card > .taxes {
-    border: 2px solid gray;
-    padding: 0;
-    > .vn-label-value {
-        text-align: right;
-        display: flex;
-        flex-direction: row;
-        margin-top: 5px;
-        justify-content: flex-end;
-        padding-right: 20px;
+
+.q-card.q-card--dark.q-dark.vn-one {
+    & > .bodyCard {
+        padding: 1%;
     }
 }
-
-.cardSummary .summaryBody > .q-card:has(.taxes) {
-    margin-top: 2px;
-    padding: 0;
-}
 </style>