Added map
This commit is contained in:
2
app.vue
2
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>
|
||||
|
||||
|
||||
17
components/k-footer.vue
Normal file
17
components/k-footer.vue
Normal file
@@ -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>
|
||||
14
components/map-view.vue
Normal file
14
components/map-view.vue
Normal file
@@ -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>
|
||||
@@ -10,18 +10,18 @@ defineProps<{
|
||||
<div class="py-4 px-6 text-center flex-grow">
|
||||
{{ name }}
|
||||
</div>
|
||||
<div
|
||||
class="px-4 flex items-center justify-center"
|
||||
:class="{
|
||||
'bg-yellow-400': type === 'indoor',
|
||||
'bg-lime-500': type === 'outdoor'
|
||||
}"
|
||||
>
|
||||
<Icon
|
||||
:name="type === 'indoor' ? 'bi:house' : 'bi:tree'"
|
||||
class="text-white"
|
||||
></Icon>
|
||||
</div>
|
||||
<!-- <div-->
|
||||
<!-- class="px-4 flex items-center justify-center"-->
|
||||
<!-- :class="{-->
|
||||
<!-- 'bg-yellow-400': type === 'indoor',-->
|
||||
<!-- 'bg-lime-500': type === 'outdoor'-->
|
||||
<!-- }"-->
|
||||
<!-- >-->
|
||||
<!-- <Icon-->
|
||||
<!-- :name="type === 'indoor' ? 'bi:house' : 'bi:tree'"-->
|
||||
<!-- class="text-white"-->
|
||||
<!-- ></Icon>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -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"
|
||||
:key="s.name"
|
||||
:name="s.name"
|
||||
:type="s.type"
|
||||
v-for="s in outdoorServices"
|
||||
:key="s.name"
|
||||
:name="s.name"
|
||||
:type="s.type"
|
||||
></service>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user