replace ElementPlus to PrimeVue, update TheWelcome

2024-11-14 15:26:44 +02:00
parent c17f39298c
commit 660f7e18d9
15 changed files with 1051 additions and 581 deletions
@@ -0,0 +1,44 @@
+<template>
+  <section class="py-8 text-center">
+    <h2 class="text-2xl font-semibold">Примеры использования</h2>
+    <div class="grid gap-6 mt-6 md:grid-cols-3 md:gap-8">
+      <!-- Пример 1 -->
+      <div class="grid items-center grid-rows-[auto,1fr] md:subgrid">
+        <p class="row-start-1 mb-2">
+          Автомобиль: получайте уведомления о проблемах с парковкой или фарами.
+        </p>
+        <img
+          src="@/assets/examples/car-200x200.jpg"
+          width="200"
+          height="200"
+          alt="Автомобиль"
+          class="mx-auto rounded-lg row-start-2"
+        />
+      </div>
+      <!-- Пример 2 -->
+      <div class="grid items-center grid-rows-[auto,1fr] md:subgrid">
+        <p class="row-start-1 mb-2">Питомец: помогите вернуть потерявшегося питомца.</p>
+        <img
+          src="@/assets/examples/dog-200x200.jpg"
+          width="200"
+          height="200"
+          alt="Питомец"
+          class="mx-auto rounded-lg row-start-2"
+        />
+      </div>
+      <!-- Пример 3 -->
+      <div class="grid items-center grid-rows-[auto,1fr] md:subgrid">
+        <p class="row-start-1 mb-2">Квартира: оставляйте инструкции для курьеров или соседей.</p>
+        <img
+          src="@/assets/examples/door-200x200.jpg"
+          width="200"
+          height="200"
+          alt="Квартира"
+          class="mx-auto rounded-lg row-start-2"
+        />
+      </div>
+    </div>
+  </section>
+</template>
+
+<script setup lang="ts"></script>