From 74ec88c9f4bb1e8b56251a38e86209049d2553ba Mon Sep 17 00:00:00 2001
From: Anatoly Kopyl <hi@kopyl.dev>
Date: Sun, 22 Sep 2024 18:24:38 +0300
Subject: [PATCH] Contacts

---
 app.vue                 |  1 +
 components/contacts.vue | 48 +++++++++++++++++++++++++++++++++++++++++
 components/k-footer.vue |  2 +-
 components/map-view.vue |  8 -------
 4 files changed, 50 insertions(+), 9 deletions(-)
 create mode 100644 components/contacts.vue

diff --git a/app.vue b/app.vue
index 3ac596a..c08ca80 100644
--- a/app.vue
+++ b/app.vue
@@ -11,6 +11,7 @@ useSeoMeta({
       <about-company></about-company>
       <services></services>
       <clients></clients>
+      <contacts></contacts>
       <map-view></map-view>
     </main>
     <k-footer></k-footer>
diff --git a/components/contacts.vue b/components/contacts.vue
new file mode 100644
index 0000000..5ad6dd8
--- /dev/null
+++ b/components/contacts.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import PureCitySvg from "~/assets/pure-city.svg";
+</script>
+
+<template>
+  <section class="py-16 bg-slate-100">
+    <h2 class="text-4xl font-semibold col-w mx-auto mb-8 px-4 md:px-16 flex items-center gap-8">
+      <img :src="PureCitySvg" class="h-16" alt="">
+      Контакты
+    </h2>
+
+    <div class="grid gap-8 grid-flow-row sm:grid-flow-col col-w mx-auto px-4 md:px-16">
+      <div class="flex gap-2">
+        <Icon name="bi:geo-alt" class="opacity-50 mt-1 shrink-0"></Icon>
+        197372, г.&nbsp;Санкт-Петербург, ул.&nbsp;Ильюшина, д.1, кор.1, литер&nbsp;А, пом.4-Н
+      </div>
+      <div class="flex flex-col gap-2">
+        <div class="flex items-center gap-2">
+          <Icon name="bi:telephone" class="opacity-50"></Icon>
+          <a href="tel:(812) 342-90-29" class="link">(812) 342-90-29</a>
+        </div>
+        <div class="flex flex-col">
+          <div class="text-sm">Отдел продаж:</div>
+          <div class="flex items-center gap-2">
+            <Icon name="bi:envelope" class="opacity-50"></Icon>
+            <a href="mailto:pure-city@inbox.ru" class="link">pure-city@inbox.ru</a>
+          </div>
+        </div>
+        <div class="flex flex-col">
+          <div class="text-sm">Бухгалтерия:</div>
+          <div class="flex items-center gap-2">
+            <Icon name="bi:envelope" class="opacity-50"></Icon>
+            <a href="mailto:pure-city@yandex.ru" class="link">pure-city@yandex.ru</a>
+          </div>
+        </div>
+      </div>
+      <div class="text-slate-500 flex flex-col">
+        <div>ИНН 7814311311</div>
+        <div>КПП 781401001</div>
+        <div>ОГРН 1047855173255</div>
+      </div>
+    </div>
+</section>
+</template>
+
+<style scoped lang="postcss">
+
+</style>
diff --git a/components/k-footer.vue b/components/k-footer.vue
index 30caa80..6d64f11 100644
--- a/components/k-footer.vue
+++ b/components/k-footer.vue
@@ -3,7 +3,7 @@
 </script>
 
 <template>
-<footer class="bg-white">
+<footer class="bg-white border-t">
   <div class="col-w mx-auto px-4 md:px-16 py-4">
     <div class="text-center text-sm">
       Разработано в <a href="https://kopyl.dev" target="_blank" class="link">kopyl.dev</a>
diff --git a/components/map-view.vue b/components/map-view.vue
index f636ef2..87d351e 100644
--- a/components/map-view.vue
+++ b/components/map-view.vue
@@ -1,7 +1,3 @@
-<script setup lang="ts">
-
-</script>
-
 <template>
 <iframe
   class="h-96 w-full"
@@ -9,7 +5,3 @@
   src="https://yandex.ru/map-widget/v1/-/CDH7FS3m"
 ></iframe>
 </template>
-
-<style scoped lang="postcss">
-
-</style>