Added map

app.vue

@@ -10,7 +10,9 @@ useSeoMeta({
     <main>
       <about-company></about-company>
       <services></services>
+      <map-view></map-view>
     </main>
+    <k-footer></k-footer>
   </div>
 </template>
 

components/k-footer.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<footer class="">
+  <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>
+    </div>
+  </div>
+</footer>
+</template>
+
+<style scoped lang="postcss">
+
+</style>

components/map-view.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<iframe
+  class="h-96 w-full"
+  src="https://yandex.ru/map-widget/v1/-/CDH7FS3m"
+></iframe>
+</template>
+
+<style scoped lang="postcss">
+
+</style>

components/services/service.vue

@@ -10,18 +10,18 @@ defineProps<{
   <div class="py-4 px-6 text-center flex-grow">
     {{ name }}
   </div>
-  <div
+<!--  <div-->
-    class="px-4 flex items-center justify-center"
+<!--    class="px-4 flex items-center justify-center"-->
-    :class="{
+<!--    :class="{-->
-      'bg-yellow-400': type === 'indoor',
+<!--      'bg-yellow-400': type === 'indoor',-->
-      'bg-lime-500': type === 'outdoor'
+<!--      'bg-lime-500': type === 'outdoor'-->
-    }"
+<!--    }"-->
-  >
+<!--  >-->
-    <Icon
+<!--    <Icon-->
-      :name="type === 'indoor' ? 'bi:house' : 'bi:tree'"
+<!--      :name="type === 'indoor' ? 'bi:house' : 'bi:tree'"-->
-      class="text-white"
+<!--      class="text-white"-->
-    ></Icon>
+<!--    ></Icon>-->
-  </div>
+<!--  </div>-->
 </div>
 </template>
 

components/services/services.vue

@@ -45,34 +45,6 @@ const outdoorServices = [
   { name: 'Покос травы', type: 'outdoor' },
   { name: 'Уход за газоном', type: 'outdoor' }
 ]
-
-function mulberry32(a) {
-  return function() {
-    let t = a += 0x6D2B79F5;
-    t = Math.imul(t ^ t >>> 15, t | 1);
-    t ^= t + Math.imul(t ^ t >>> 7, t | 61);
-    return ((t ^ t >>> 14) >>> 0) / 4294967296;
-  }
-}
-
-const getRand = mulberry32((Math.random()*2**32)>>>0)
-
-function shuffle(array) {
-  let currentIndex = array.length;
-
-  // While there remain elements to shuffle...
-  while (currentIndex != 0) {
-    // Pick a remaining element...
-    let randomIndex = Math.floor(getRand() * currentIndex);
-    currentIndex--;
-
-    // And swap it with the current element.
-    [array[currentIndex], array[randomIndex]] = [
-      array[randomIndex], array[currentIndex]];
-  }
-}
-
-shuffle(outdoorServices)
 </script>
 
 <template>
@@ -88,12 +60,12 @@ shuffle(outdoorServices)
     ></service>
   </div>
 
-  <div class="col-w mx-auto px-4 md:px-16 gap-2 services__grid">
+  <div class="col-w mx-auto px-4 md:px-16 mb-16 gap-2 services__grid">
     <service
-        v-for="s in outdoorServices"
+      v-for="s in outdoorServices"
-        :key="s.name"
+      :key="s.name"
-        :name="s.name"
+      :name="s.name"
-        :type="s.type"
+      :type="s.type"
     ></service>
   </div>
 </section>