opti1337/quantumbot-landing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Никита Круглицкий 2025-02-05 21:11:15 +03:00
parent f809f468e1
commit 692edc978d
16 changed files with 1657 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app.config.ts
View File

@ -2,9 +2,9 @@ export default defineAppConfig({
instagramUrl: 'https://www.instagram.com/samatk7/?igsh=Mm9keGxnbXBrdGQ4',
telegramUrl: 'https://t.me/+vOQDGC3VoUJmY2Qy',
whatsappUrl: 'https://api.whatsapp.com/send/?phone=7077407714&text&type=phone_number&app_absent=0',
phoneNumber: '+7 (705) 400 20 66',
phoneNumber: '+7 747 399 05 82',
email: 'support@quantumbot.kz',
appUrl: 'https://app.quantumbot.kz',
videoUrl: 'https://www.youtube.com/embed/dQw4w9WgXcQ?si=dZCL9UFbyboiQzSl',
videoUrl: 'https://www.youtube.com/embed/qngK9wsEAxg',
baseUrl: import.meta.env.URL || 'https://quantumbot.kz',
})

2
app.vue
View File

@ -5,7 +5,9 @@
<HomepageHero />
<HomepageResults />
<HomepageHowItWorks />
<HomepageAnalytics />
<HomepageTariff />
<HomepageReferralProgram />
<HomepageReviews />
<HomepageFaq />
<HomepageAnyQuestions />

21
components/app-header.vue
View File

@ -2,7 +2,8 @@
<header class="header">
<div class="container">
<div class="header__inner">
<NuxtImg src="/logo.svg" alt="one2one" class="header__logo" draggable="false" />
<NuxtImg src="/logo.svg" alt="one2one" class="header__logo desktop-only" draggable="false" />
<NuxtImg src="/logo-compact.svg" alt="one2one" class="header__logo mobile-only" draggable="false" />
<hr class="header__divider desktop-only">
@ -26,6 +27,10 @@
<hr class="header__divider">
<PhoneNumber />
<UiButton :href="app.appUrl" rel="noopener noreferrer" class="header__sign-in">
Войти
</UiButton>
</div>
</div>
</header>
@ -101,5 +106,19 @@ const app = useAppConfig()
gap: 16px;
}
}
&__sign-in {
height: 40px;
padding-block: 9px;
margin-left: 24px;
@include mobile {
@include font(12px, 500, 15px);
height: 32px;
padding: 7.5px 15px;
margin-left: 12px;
}
}
}
</style>

123
components/homepage/analytics.vue Normal file
View File

@ -0,0 +1,123 @@
<template>
<HomepageSection
class="analytics"
title="Аналитика продаж "
description="на Kaspi.kz"
>
<div class="analytics__inner">
<NuxtImg class="analytics__background desktop-only" src="/analytics-bg.png" height="763px" format="webp" draggable="false" />
<div class="analytics__content">
<div class="analytics__header">
<NuxtImg class="mobile-only" src="/analytics-bg.png" height="76px" format="webp" draggable="false" />
<div class="analytics__title">
Получите полную картину по продажам на Kaspi.kz с помощью нашего сервиса! Наша аналитика – на 100% точная
</div>
</div>
<div class="analytics__list-title">
Что вы узнаете?
</div>
<ul class="analytics__list">
<li>Выручка – анализ доходности по категориям и товарам</li>
<li>Средний чек – оценка покупательской способности</li>
<li>Количество заказов – динамика продаж за выбранный период</li>
<li>Популярные категории – какие товары продаются лучше всего</li>
<li>Конкуренция – число продавцов в каждом товаре</li>
</ul>
</div>
</div>
</HomepageSection>
</template>
<script setup>
const app = useAppConfig()
const img = useImage()
</script>
<style lang="scss">
.analytics {
&__inner {
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
height: 400px;
padding: 24px 100px;
border-radius: 12px;
background-color: $color-gray-200;
@include mobile {
padding: 16px;
height: unset;
}
}
&__background {
position: absolute;
max-height: unset;
max-width: unset;
left: 0;
top: 50%;
transform: translateY(-50%);
}
&__content {
width: 610px;
margin-left: auto;
@include mobile {
width: unset;
}
}
&__header {
display: flex;
align-items: center;
gap: 24px;
margin-bottom: 24px;
@include mobile {
align-items: flex-start;
}
}
&__title {
@include font(20px, 500, 28px);
@include mobile {
@include font(14px, 500, 20px);
}
}
&__list-title {
@include font(16px, 700, 29px);
color: $color-gray-700;
@include mobile {
@include font(12px, 400, 22px);
}
}
&__list {
@include font(16px, 400, 29px);
color: $color-gray-700;
@include mobile {
@include font(12px, 400, 22px);
}
}
&__action {
margin-top: 24px;
@include mobile {
width: 100%;
}
}
}
</style>

6
components/homepage/how-it-works.vue
View File

@ -67,8 +67,8 @@
/>
<ul class="how-it-works-demo__list">
<li>Ознакомьтесь с интерфейсом приложения для ПК</li>
<li>Оцените удобство мобильного интерфейса</li>
<li>Оцените интерфейс приложения для ПК и мобильных девайсов</li>
<li>Ознакомьтесь с примером добавления товара на предзаказ</li>
<li>Просмотрите пример добавления товаров и управления ими через приложение</li>
</ul>
@ -148,7 +148,7 @@ const app = useAppConfig()
@include desktop {
display: grid;
justify-items: flex-start;
grid-template-columns: 485px 1fr;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr auto 1fr;
grid-template-areas:
'title video'

138
components/homepage/referral-program.vue Normal file
View File

@ -0,0 +1,138 @@
<template>
<div class="referral-program">
<div class="container">
<div class="referral-program__inner">
<div class="referral-program__header">
<NuxtImg class="mobile-only" src="/referral-program-bg-mobile.png" height="80px" format="webp" draggable="false" />
<div class="referral-program__title">
Реферальная программа
</div>
</div>
<p class="referral-program__description">
Получайте вознаграждение за каждое пополнение пользователей,<br>
которые зарегистрируются и воспользуется нашим сервисом
</p>
<ul class="referral-program__list">
<li>Получите свою уникальную ссылку в личном кабинете</li>
<li>Поделитесь ею с друзьями, коллегами или в соцсетях</li>
<li>Зарабатывайте. Больше друзей – больше бонусов!</li>
</ul>
</div>
</div>
</div>
</template>
<script setup>
const app = useAppConfig()
const img = useImage()
const desktopBg = computed(() => {
return `url('${img('/referral-program-bg.png', { height: '375px', format: 'webp' })}')`
})
</script>
<style lang="scss">
.referral-program {
&__inner {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding: 16px 100px;
border-radius: 12px;
height: 407px;
color: $color-white;
@include desktop {
background-image: v-bind(desktopBg), linear-gradient(260.36deg, #21DAC2 0%, #008574 86.86%);
background-repeat: no-repeat;
background-position: center right 100px, center;
}
@include mobile {
background-color: $color-green-400;
background-image: none;
padding: 16px;
height: unset;
}
}
&__header {
display: flex;
align-items: center;
gap: 16px;
}
&__title {
@include font(32px, 700, 45px);
@include mobile {
@include font(20px, 700, 28px);
}
}
&__description {
@include font(18px, 400, 32px);
margin-top: 24px;
@include mobile {
@include font(12px, 400, 22px);
margin-top: 16px;
}
}
&__list {
@include font(15px, 600, 15px);
list-style: none;
margin-top: 24px;
padding-left: 0;
@include mobile {
@include font(12px, 600, 15px);
margin-top: 16px;
}
li {
position: relative;
display: flex;
align-items: center;
gap: 16px;
counter-increment: referral-program-item;
&:not(:last-child) {
margin-bottom: 21px;
&::after {
content: '';
position: absolute;
left: 16px;
top: 36px;
height: 13px;
border-left: 1px dashed $color-lime;
}
}
&::before {
@include font(16px, 600, 32px);
display: block;
content: counter(referral-program-item);
height: 32px;
width: 32px;
flex-shrink: 0;
text-align: center;
background-color: $color-lime;
color: $color-black;
border-radius: 8px;
}
}
}
}
</style>

2
components/homepage/reviews.vue
View File

@ -40,7 +40,7 @@
<Splide ref="splideEl" class="reviews__carousel" :options="splideOptions">
<SplideSlide v-for="i in 6" :key="i">
<NuxtImg class="reviews__review" :src="`/reviews/${i}.png`" height="416" format="webp" />
<NuxtImg class="reviews__review" :src="`/reviews/${i}.png`" height="416" format="webp" draggable="false" />
</SplideSlide>
</Splide>

8
components/homepage/tariff.vue
View File

@ -6,7 +6,7 @@
>
<div class="tariff__inner">
<div class="tariff__header">
<NuxtImg class="mobile-only" src="/price-bg.png" height="35px" format="webp" />
<NuxtImg class="mobile-only" src="/price-bg.png" height="35px" format="webp" draggable="false" />
<div class="tariff__price">
30 000 ₸ / месяц
@ -14,9 +14,9 @@
</div>
<ul class="tariff__list">
<li>Безлимитное количество товаров</li>
<li>Поддержка 24/7</li>
<li>Высокая скорость обновления цен</li>
<li>Дэмпинг</li>
<li>100% точная аналитика</li>
<li>Предзаказ</li>
</ul>
<UiButton class="tariff__action" :href="app.appUrl" rel="noopener noreferrer">

12
nuxt.config.ts
View File

@ -17,6 +17,7 @@ const baseUrl = import.meta.env.URL || 'https://quantumbot.kz'
export default defineNuxtConfig({
devtools: { enabled: true },
ssr: false,
pages: false,
app: {
head: {
@ -111,8 +112,19 @@ export default defineNuxtConfig({
},
},
],
'@nuxt/scripts',
],
$production: {
scripts: {
registry: {
metaPixel: {
id: '997724358913843',
},
},
},
},
googleFonts: {
families: {
Onest: [300, 400, 500, 600, 700, 800, 900],

1
package.json
View File

@ -28,6 +28,7 @@
"@iconify/tools": "^4.0.7",
"@nuxt/devtools": "latest",
"@nuxt/image": "^1.8.1",
"@nuxt/scripts": "0.9.5",
"@nuxtjs/google-fonts": "^3.2.0",
"@types/lodash-es": "^4.17.12",
"@types/uuid": "^10.0.0",

BIN
public/analytics-bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 184 KiB

4
public/logo-compact.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="17" height="18" viewBox="0 0 17 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.6049 11.8724H11.1544V17.323H16.6049V11.8724Z" fill="#008574"/>
<path d="M5.70055 0.968018C2.69015 0.968018 0.25 3.40817 0.25 6.41858V11.8692C0.25 14.8796 2.69015 17.3197 5.70055 17.3197L11.1511 11.8692H5.70055V6.41858H11.1511V11.8692L16.6016 6.41858C16.6016 3.40817 14.1615 0.968018 11.1511 0.968018H5.70055Z" fill="#008574"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 443 B

BIN
public/referral-program-bg-mobile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
public/referral-program-bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 172 KiB

2
styles/variables/color.scss
View File

@ -10,3 +10,5 @@ $color-green-500: #056e62;
$color-white: #FFFFFF;
$color-black: #021d54;
$color-lime: #E0FF5F;

1350
yarn.lock
View File

File diff suppressed because it is too large Load Diff