add tabs

apps/frontend/src/views/DonateView.vue

@@ -1,80 +1,88 @@
 <template>
-  <MetaHead>
-    <title>Поддержите развитие НаСвязи</title>
-    <meta name="description" content="" />
-  </MetaHead>
+  <LayoutWithTabs>
+    <template #footer>
+      <footer class="py-4 border-t text-center text-sm hidden sm:block">
+        <p>НаСвязи © 2024</p>
+      </footer>
+    </template>
 
-  <section class="max-w-2xl mx-auto py-8 px-4 text-center">
-    <h1 class="text-2xl font-bold mb-4">Поддержите развитие НаСвязи</h1>
-    <p class="text-gray-600 mb-6">
-      Мы делаем всё, чтобы НаСвязи оставался удобным и полезным. Вы можете помочь нам, поддержав
-      проект на Бусти.
-    </p>
+    <MetaHead>
+      <title>Поддержите развитие НаСвязи</title>
+      <meta name="description" content="" />
+    </MetaHead>
 
-    <!-- Ссылка на Бусти -->
-    <div class="mb-8">
-      <a
-        href="https://boosty.to/hereconnect/donate"
-        target="_blank"
-        rel="noopener noreferrer"
-        class="inline-block bg-orange-500 text-white font-semibold py-3 px-6 rounded-lg shadow hover:bg-orange-600 transition duration-300"
-      >
-        Поддержать через Бусти
-      </a>
-    </div>
+    <section class="max-w-2xl mx-auto py-8 px-4 text-center">
+      <h1 class="text-2xl font-bold mb-4">Поддержите развитие НаСвязи</h1>
+      <p class="text-gray-600 mb-6">
+        Мы делаем всё, чтобы НаСвязи оставался удобным и полезным. Вы можете помочь нам, поддержав
+        проект на Бусти.
+      </p>
 
-    <!-- Рассказать друзьям -->
-    <div class="mb-8">
-      <h2 class="text-xl font-semibold mb-4">Рассказать друзьям</h2>
-      <p class="text-gray-600 mb-4">Поделитесь ссылкой на НаСвязи:</p>
-      <div class="flex justify-center gap-6">
-        <!-- Telegram -->
+      <!-- Ссылка на Бусти -->
+      <div class="mb-8">
         <a
-          :href="telegramShareUrl"
+          href="https://boosty.to/hereconnect/donate"
           target="_blank"
           rel="noopener noreferrer"
-          class="p-button-rounded p-button-text p-button-lg inline-flex items-center justify-center"
+          class="inline-block bg-orange-500 text-white font-semibold py-3 px-6 rounded-lg shadow hover:bg-orange-600 transition duration-300"
         >
-          <i class="pi pi-telegram !text-3xl text-blue-500"></i>
-        </a>
-
-        <!-- WhatsApp -->
-        <a
-          :href="whatsappShareUrl"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="p-button-rounded p-button-text p-button-lg inline-flex items-center justify-center"
-        >
-          <i class="pi pi-whatsapp !text-3xl text-green-500"></i>
+          Поддержать через Бусти
         </a>
       </div>
-    </div>
 
-    <!-- Обратная связь -->
-    <!--    <div>-->
-    <!--      <h2 class="text-xl font-semibold mb-4">Оставить отзыв или идею</h2>-->
-    <!--      <p class="text-gray-600 mb-4">Мы рады любым предложениям и обратной связи.</p>-->
-    <!--      <form @submit.prevent="sendFeedback">-->
-    <!--        <div class="mb-4">-->
-    <!--          <InputText v-model="email" class="w-full" placeholder="Ваш email" />-->
-    <!--        </div>-->
-    <!--        <div class="mb-4">-->
-    <!--          <Textarea-->
-    <!--            v-model="message"-->
-    <!--            rows="4"-->
-    <!--            class="w-full"-->
-    <!--            placeholder="Ваше сообщение"-->
-    <!--          ></Textarea>-->
-    <!--        </div>-->
-    <!--        <Button-->
-    <!--          label="Отправить"-->
-    <!--          class="p-button-md"-->
-    <!--          :disabled="!email.trim() || !message.trim()"-->
-    <!--        />-->
-    <!--      </form>-->
-    <!--      <p v-if="success" class="text-green-500 mt-4">Спасибо за ваше сообщение!</p>-->
-    <!--    </div>-->
-  </section>
+      <!-- Рассказать друзьям -->
+      <div class="mb-8">
+        <h2 class="text-xl font-semibold mb-4">Рассказать друзьям</h2>
+        <p class="text-gray-600 mb-4">Поделитесь ссылкой на НаСвязи:</p>
+        <div class="flex justify-center gap-6">
+          <!-- Telegram -->
+          <a
+            :href="telegramShareUrl"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="p-button-rounded p-button-text p-button-lg inline-flex items-center justify-center"
+          >
+            <i class="pi pi-telegram !text-3xl text-blue-500"></i>
+          </a>
+
+          <!-- WhatsApp -->
+          <a
+            :href="whatsappShareUrl"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="p-button-rounded p-button-text p-button-lg inline-flex items-center justify-center"
+          >
+            <i class="pi pi-whatsapp !text-3xl text-green-500"></i>
+          </a>
+        </div>
+      </div>
+
+      <!-- Обратная связь -->
+      <!--    <div>-->
+      <!--      <h2 class="text-xl font-semibold mb-4">Оставить отзыв или идею</h2>-->
+      <!--      <p class="text-gray-600 mb-4">Мы рады любым предложениям и обратной связи.</p>-->
+      <!--      <form @submit.prevent="sendFeedback">-->
+      <!--        <div class="mb-4">-->
+      <!--          <InputText v-model="email" class="w-full" placeholder="Ваш email" />-->
+      <!--        </div>-->
+      <!--        <div class="mb-4">-->
+      <!--          <Textarea-->
+      <!--            v-model="message"-->
+      <!--            rows="4"-->
+      <!--            class="w-full"-->
+      <!--            placeholder="Ваше сообщение"-->
+      <!--          ></Textarea>-->
+      <!--        </div>-->
+      <!--        <Button-->
+      <!--          label="Отправить"-->
+      <!--          class="p-button-md"-->
+      <!--          :disabled="!email.trim() || !message.trim()"-->
+      <!--        />-->
+      <!--      </form>-->
+      <!--      <p v-if="success" class="text-green-500 mt-4">Спасибо за ваше сообщение!</p>-->
+      <!--    </div>-->
+    </section>
+  </LayoutWithTabs>
 </template>
 
 <script setup lang="ts">