Skip to content

Commit dbe5cb5

Browse files
hmbanan666hmbanan666
authored
feat: new blocks (#183)
1 parent 1b7573b commit dbe5cb5

13 files changed

Lines changed: 166 additions & 46 deletions

‎apps/webinar/app/components/Countdown.vue‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<template>
2+
<div class="bg-accented">
3+
<UPageSection
4+
title="Получить готовый план"
5+
description="И ответы на все свои вопросы, от поиска помещения до первого заработка. Мероприятие будет доступно через:"
6+
headline="Не забудь!"
7+
orientation="horizontal"
8+
:ui="{
9+
title: 'text-center',
10+
description: 'text-center',
11+
headline: 'py-2 px-4 mx-auto w-fit bg-secondary text-white rounded-md motion-preset-oscillate-sm',
12+
}"
13+
>
14+
<template #body>
15+
<div class="flex flex-col items-center">
16+
<CountdownTimer />
17+
18+
<UButton
19+
to="https://t.me/SLFranchiseBot"
20+
variant="solid"
21+
size="xl"
22+
label="Зарегистрироваться"
23+
icon="i-lucide-calendar-plus"
24+
class="mt-12 w-full justify-center"
25+
/>
26+
<p class="px-6 mt-2 text-center text-sm">
27+
И сразу получить подарок: гайд по документообороту по открытию заведения в сфере общепита
28+
</p>
29+
</div>
30+
</template>
31+
</UPageSection>
32+
</div>
33+
</template>

‎apps/webinar/app/components/CountdownTimer.vue‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<template>
2+
<div class="flex flex-row gap-2">
3+
<CountdownTimerItem :value="state.days" label="Дней" />
4+
<CountdownTimerItem :value="state.hours" label="Часов" />
5+
<CountdownTimerItem :value="state.minutes" label="Минут" />
6+
<CountdownTimerItem :value="state.seconds" label="Секунд" />
7+
</div>
8+
</template>
9+
10+
<script setup lang="ts">
11+
const target = ref(new Date('2025-10-25T00:00:00'))
12+
13+
const state = ref({
14+
days: 0,
15+
hours: 0,
16+
minutes: 0,
17+
seconds: 0,
18+
})
19+
20+
onMounted(() => {
21+
const interval = setInterval(() => {
22+
const now = new Date()
23+
const diff = target.value.getTime() - now.getTime()
24+
state.value = {
25+
days: Math.floor(diff / 86400000),
26+
hours: Math.floor((diff % 86400000) / 3600000),
27+
minutes: Math.floor((diff % 3600000) / 60000),
28+
seconds: Math.floor((diff % 60000) / 1000),
29+
}
30+
}, 1000)
31+
32+
onBeforeUnmount(() => clearInterval(interval))
33+
})
34+
</script>

‎apps/webinar/app/components/CountdownTimerItem.vue‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<template>
2+
<div class="px-2 md:px-5 py-4 min-w-18 md:min-w-24 bg-default rounded-lg flex flex-col items-center">
3+
<h3 class="text-3xl font-bold">
4+
{{ value }}
5+
</h3>
6+
<span class="text-sm text-muted">
7+
{{ label }}
8+
</span>
9+
</div>
10+
</template>
11+
12+
<script setup lang="ts">
13+
defineProps<{ value: number, label: string }>()
14+
</script>

‎apps/webinar/app/components/Header.vue‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<template>
2+
<UContainer class="mt-10 flex flex-col md:flex-row gap-y-6 items-center justify-between">
3+
<HeaderLogo />
4+
5+
<div class="shrink-0">
6+
<div class="flex flex-row gap-2">
7+
<UColorModeButton size="xl" />
8+
<UButton
9+
to="https://t.me/SLFranchiseBot"
10+
size="xl"
11+
color="neutral"
12+
variant="ghost"
13+
icon="simple-icons:telegram"
14+
/>
15+
<UButton
16+
to="https://vk.com/franshizasushi"
17+
size="xl"
18+
color="neutral"
19+
variant="ghost"
20+
icon="simple-icons:vk"
21+
/>
22+
</div>
23+
</div>
24+
</UContainer>
25+
</template>

‎apps/webinar/app/components/HeaderLogo.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,6 @@
22
<img
33
src="/sushi-main-logo.png"
44
alt=""
5-
class="mx-auto h-20 w-auto motion-preset-pop"
5+
class="h-12 w-fit motion-preset-pop"
66
>
77
</template>

‎apps/webinar/app/components/Hero.vue‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<template>
2+
<UPageHero
3+
orientation="horizontal"
4+
title="Готовый алгоритм действий для новичков"
5+
description="Бесплатный вебинар: «Как открыть ресторан, кофейню или суши-бар с нуля и избежать ошибок». Получите пошаговую инструкцию и ответы на все вопросы, от поиска помещения до первого заработка."
6+
headline="🤔 Мечтаете о своем заведении?"
7+
:links="links"
8+
:ui="{
9+
headline: 'py-2 px-4 w-fit bg-secondary text-white rounded-md motion-preset-seesaw',
10+
links: 'motion-preset-oscillate motion-duration-2000',
11+
}"
12+
>
13+
<HeroVideo />
14+
</UPageHero>
15+
</template>
16+
17+
<script setup lang="ts">
18+
const links = ref([
19+
{
20+
label: 'Записаться',
21+
to: 'https://t.me/SLFranchiseBot',
22+
target: '_blank',
23+
trailingIcon: 'i-lucide-arrow-right',
24+
ui: {
25+
base: 'px-6 text-xl',
26+
},
27+
},
28+
])
29+
</script>

‎apps/webinar/app/components/HeroVideo.vue‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template>
2+
<video
3+
controls
4+
class="max-h-180 w-auto mx-auto rounded-xl"
5+
>
6+
<source src="https://storage.yandexcloud.net/sushi-love-test/telegram/files/BAACAgIAAxkBAAOFaMwda7U9ddiws5ZJ4oIbaeSlw0YAAvWDAAJt32BKU94XDWZ9cCg2BA.mp4" type="video/mp4">
7+
Ваш браузер не поддерживает видео
8+
</video>
9+
</template>

‎apps/webinar/app/components/InfiniteTitlesDivider.vue‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,31 @@
1111
item: 'shrink-0 basis-full md:basis-1/3 min-w-120 h-full min-h-16 flex flex-row gap-4 items-center justify-around',
1212
}"
1313
>
14-
<h4 class="text-2xl font-black uppercase">
14+
<h4 class="text-2xl text-neutral-950 font-black uppercase">
1515
{{ item }}
1616
</h4>
1717

1818
<img
1919
src="/sushi-heart.svg"
2020
alt=""
21-
class="w-10 h-auto opacity-15"
21+
class="w-10 h-auto opacity-90"
2222
>
2323
</UCarousel>
2424
</div>
2525
</template>
2626

2727
<script setup lang="ts">
28-
const items = [
28+
const items = ref<string[]>([
2929
'Вебинар Суши Love 2025',
3030
'Будем делиться опытом',
3131
'Как избежать ошибок',
3232
'На 100% бесплатно',
33-
]
33+
])
34+
35+
onMounted(() => {
36+
// add items
37+
for (let i = 0; i < 5; i++) {
38+
items.value.push(...items.value)
39+
}
40+
})
3441
</script>

‎apps/webinar/app/pages/index.vue‎

Lines changed: 8 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,6 @@
11
<template>
2-
<div class="mt-10">
3-
<HeaderLogo />
4-
</div>
5-
6-
<UPageHero
7-
orientation="horizontal"
8-
title="Мечтаете о своем заведении? Готовый алгоритм действий для новичков"
9-
description="Бесплатный вебинар: «Как открыть ресторан, кофейню или суши-бар с нуля и избежать ошибок». Получите пошаговую инструкцию и ответы на все вопросы, от поиска помещения до первого заработка."
10-
headline="Поторопись!"
11-
:links="links"
12-
:ui="{
13-
headline: 'py-2 px-4 w-fit bg-secondary text-white rounded-lg motion-preset-seesaw',
14-
}"
15-
>
16-
<video
17-
controls
18-
class="max-h-160 w-auto mx-auto rounded-xl"
19-
>
20-
<source src="https://storage.yandexcloud.net/sushi-love-test/telegram/files/BAACAgIAAxkBAAOFaMwda7U9ddiws5ZJ4oIbaeSlw0YAAvWDAAJt32BKU94XDWZ9cCg2BA.mp4" type="video/mp4">
21-
Ваш браузер не поддерживает видео
22-
</video>
23-
</UPageHero>
24-
2+
<Header />
3+
<Hero />
254
<InfiniteTitlesDivider />
265

276
<UPageSection
@@ -42,23 +21,17 @@
4221
>
4322
Тут фото?
4423
</UPageSection>
24+
25+
<Countdown />
26+
27+
<div class="mt-6">
28+
И все что-ли?
29+
</div>
4530
</template>
4631

4732
<script setup lang="ts">
4833
import type { PageFeatureProps } from '@nuxt/ui'
4934
50-
const links = ref([
51-
{
52-
label: 'Записаться',
53-
to: 'https://t.me/SLFranchiseBot',
54-
target: '_blank',
55-
trailingIcon: 'i-lucide-arrow-right',
56-
ui: {
57-
base: 'px-6 text-xl',
58-
},
59-
},
60-
])
61-
6235
const firstSectionItems: PageFeatureProps[] = [
6336
{
6437
title: 'Мечтаете открыть свое заведение',

‎apps/webinar/nuxt.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export default defineNuxtConfig({
66
},
77
css: ['~/assets/css/styles.css'],
88
routeRules: {
9-
'/**': { swr: true },
9+
'/**': { prerender: true },
1010
},
1111
ui: {
1212
colorMode: true,

0 commit comments

Comments
 (0)