From 9719f51b7101172a1aeabcb9084f7f8e4bf34aa5 Mon Sep 17 00:00:00 2001
From: Vasilii Mikhailovskii <ti.webdev@ya.ru>
Date: Fri, 6 Dec 2024 14:48:18 +0200
Subject: [PATCH] update styles

---
 .../src/views/ManageDashboardView.vue         | 75 +++++++++----------
 .../src/views/ManageQRCodeChatView.vue        |  6 +-
 .../src/views/ManageQRCodeReadyView.vue       |  6 +-
 apps/frontend/src/views/ManageQRCodeView.vue  |  6 +-
 apps/frontend/src/views/PublicChatView.vue    |  8 +-
 apps/frontend/src/views/ReadQRCodeView.vue    |  6 +-
 6 files changed, 55 insertions(+), 52 deletions(-)

diff --git a/apps/frontend/src/views/ManageDashboardView.vue b/apps/frontend/src/views/ManageDashboardView.vue
index e4509e0..2f352b2 100644
--- a/apps/frontend/src/views/ManageDashboardView.vue
+++ b/apps/frontend/src/views/ManageDashboardView.vue
@@ -9,11 +9,11 @@
 
   <div class="flex flex-col min-h-full">
     <main class="flex-grow flex justify-center py-6 px-4 md:px-6">
-      <div>
-        <h1 class="text-2xl font-bold mb-4 text-center lg:text-left">Управление QR-кодами</h1>
-        <QueryRender :query="query">
-          <template #default="{ data }">
-            <div v-if="data.rows.length > 0" class="flex flex-col gap-5">
+      <QueryRender :query="query">
+        <template #default="{ data }">
+          <div v-if="data.rows.length > 0">
+            <h1 class="text-2xl font-bold mb-4 text-center lg:text-left">Управление QR-кодами</h1>
+            <div class="flex flex-col gap-5">
               <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
                 <QRCodeCard
                   v-for="{ doc: qrCode } in data.rows"
@@ -31,44 +31,41 @@
                 />
               </div>
             </div>
-            <div v-else class="text-center text-gray-500">
-              <p class="mb-6">Нет созданных QR-кодов. Вы можете создать их прямо сейчас!</p>
-              <Button
-                icon="pi pi-qrcode"
-                label="Создать QR‑код"
-                to="/create"
-                as="router-link"
-                class="p-button-lg"
-              />
-            </div>
-          </template>
+          </div>
+          <div v-else class="text-center text-gray-500 place-self-center">
+            <h1 class="text-2xl font-bold mb-4 text-center lg:text-left">Нет созданных QR-кодов</h1>
+            <p class="mb-6">Вы можете создать их прямо сейчас!</p>
+            <Button
+              icon="pi pi-qrcode"
+              label="Создать QR‑код"
+              to="/create"
+              as="router-link"
+              class="p-button-lg"
+            />
+          </div>
+        </template>
 
-          <template #error="{ reload }">
-            <div class="text-center text-red-500">
-              <p>Произошла ошибка при загрузке данных. Пожалуйста, попробуйте позже.</p>
-              <Button label="Повторить попытку" class="p-button mt-4" @click="reload()" />
-            </div>
-          </template>
+        <template #error="{ reload }">
+          <div class="text-center text-red-500">
+            <p>Произошла ошибка при загрузке данных. Пожалуйста, попробуйте позже.</p>
+            <Button label="Повторить попытку" class="p-button mt-4" @click="reload()" />
+          </div>
+        </template>
 
-          <template #loading>
-            <div class="text-center text-gray-500">
-              <p>Загрузка QR-кодов...</p>
-              <ProgressSpinner styleClass="mt-4" />
-            </div>
-          </template>
-        </QueryRender>
-      </div>
+        <template #loading>
+          <div class="text-center text-gray-500">
+            <p>Загрузка QR-кодов...</p>
+            <ProgressSpinner styleClass="mt-4" />
+          </div>
+        </template>
+      </QueryRender>
     </main>
     <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">
-      <p>
-        Нужен еще один?
-        <a href="/create" class="underline">Создайте QR‑код</a>.
-      </p>
-      <p class="mt-1">
-        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"
-          >поддержке</a
-        >.
-      </p>
+      Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a
+        href="/donate"
+        class="underline underline-offset-2"
+        >поддержке</a
+      >.
     </footer>
   </div>
 </template>
diff --git a/apps/frontend/src/views/ManageQRCodeChatView.vue b/apps/frontend/src/views/ManageQRCodeChatView.vue
index 87e4d67..5d5987c 100644
--- a/apps/frontend/src/views/ManageQRCodeChatView.vue
+++ b/apps/frontend/src/views/ManageQRCodeChatView.vue
@@ -26,7 +26,7 @@
 
             <p class="mt-10 text-sm text-gray-500 text-center">
               Хотите создать еще один QR‑код?
-              <a href="/create" class="underline">Создайте его здесь</a>.
+              <a href="/create" class="underline underline-offset-2">Создайте его здесь</a>.
             </p>
             <p class="mt-1 text-sm text-gray-500 text-center">
               Сделайте НаСвязи удобнее. Мы будем рады вашей&nbsp;<RouterLink
@@ -42,9 +42,9 @@
 
     <!-- Футер -->
     <!--    <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">-->
-    <!--      <p><a href="/create" class="underline">Создайте свой QR‑код</a>.</p>-->
+    <!--      <p><a href="/create" class="underline underline-offset-2">Создайте свой QR‑код</a>.</p>-->
     <!--      <p class="mt-1">-->
-    <!--        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"-->
+    <!--        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline underline-offset-2"-->
     <!--          >поддержке</a-->
     <!--        >.-->
     <!--      </p>-->
diff --git a/apps/frontend/src/views/ManageQRCodeReadyView.vue b/apps/frontend/src/views/ManageQRCodeReadyView.vue
index ec162cd..3063eb3 100644
--- a/apps/frontend/src/views/ManageQRCodeReadyView.vue
+++ b/apps/frontend/src/views/ManageQRCodeReadyView.vue
@@ -88,10 +88,12 @@
     <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">
       <p>
         Нужен еще один?
-        <a href="/create" class="underline">Создайте QR‑код</a>.
+        <a href="/create" class="underline underline-offset-2">Создайте QR‑код</a>.
       </p>
       <p class="mt-1">
-        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"
+        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a
+          href="/donate"
+          class="underline underline-offset-2"
           >поддержке</a
         >.
       </p>
diff --git a/apps/frontend/src/views/ManageQRCodeView.vue b/apps/frontend/src/views/ManageQRCodeView.vue
index 3f1617d..3fdbd04 100644
--- a/apps/frontend/src/views/ManageQRCodeView.vue
+++ b/apps/frontend/src/views/ManageQRCodeView.vue
@@ -92,10 +92,12 @@
     <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">
       <p>
         Нужен еще один?
-        <a href="/create" class="underline">Создайте QR‑код</a>.
+        <a href="/create" class="underline underline-offset-2">Создайте QR‑код</a>.
       </p>
       <p class="mt-1">
-        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"
+        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a
+          href="/donate"
+          class="underline underline-offset-2"
           >поддержке</a
         >.
       </p>
diff --git a/apps/frontend/src/views/PublicChatView.vue b/apps/frontend/src/views/PublicChatView.vue
index f3a6611..c00e468 100644
--- a/apps/frontend/src/views/PublicChatView.vue
+++ b/apps/frontend/src/views/PublicChatView.vue
@@ -26,12 +26,12 @@
 
             <p class="mt-10 text-sm text-gray-500 text-center">
               Хотите создать собственный QR‑код?
-              <a href="/create" class="underline">Создайте его здесь</a>.
+              <a href="/create" class="underline underline-offset-2">Создайте его здесь</a>.
             </p>
             <p class="mt-1 text-sm text-gray-500 text-center">
               Сделайте НаСвязи удобнее. Мы будем рады вашей&nbsp;<RouterLink
                 to="/donate"
-                class="underline"
+                class="underline underline-offset-2"
                 >поддержке</RouterLink
               >.
             </p>
@@ -42,9 +42,9 @@
 
     <!-- Футер -->
     <!--    <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">-->
-    <!--      <p><a href="/create" class="underline">Создайте свой QR‑код</a>.</p>-->
+    <!--      <p><a href="/create" class="underline underline-offset-2">Создайте свой QR‑код</a>.</p>-->
     <!--      <p class="mt-1">-->
-    <!--        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"-->
+    <!--        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline underline-offset-2"-->
     <!--          >поддержке</a-->
     <!--        >.-->
     <!--      </p>-->
diff --git a/apps/frontend/src/views/ReadQRCodeView.vue b/apps/frontend/src/views/ReadQRCodeView.vue
index 4464d49..0da0f4c 100644
--- a/apps/frontend/src/views/ReadQRCodeView.vue
+++ b/apps/frontend/src/views/ReadQRCodeView.vue
@@ -25,10 +25,12 @@
     <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">
       <p>
         Нужен такой же?
-        <a href="/create" class="underline">Создайте свой QR‑код</a>.
+        <a href="/create" class="underline underline-offset-2">Создайте свой QR‑код</a>.
       </p>
       <p class="mt-1">
-        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"
+        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a
+          href="/donate"
+          class="underline underline-offset-2"
           >поддержке</a
         >.
       </p>