Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| f29cf9c45f | |||
| 4e05e1dd82 |
215
src/app/page.tsx
215
src/app/page.tsx
@@ -2,12 +2,12 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -15,151 +15,86 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="bounce-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmall"
|
||||
background="blurBottom"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="flat"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Nikita Platonov"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Design", id: "skills" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Nikita Platonov"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Платонов Никита"
|
||||
description="Студент и разработчик современных, адаптивных и уникальных веб-сайтов. Создаю решения, которые выделяются в цифровом пространстве."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13339.jpg", alt: "professional man portrait"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg", alt: "professional man portrait"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-curly-girl_1398-662.jpg", alt: "professional man portrait"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/middle-age-hoary-man-wearing-casual-sweater-glasses-isolated-yellow-background-smiling-friendly-offering-handshake-as-greeting-welcoming-successful-business_839833-30926.jpg", alt: "Middle age hoary man wearing casual sweater and glasses"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/nice-meet-you-smiling-caucasian-man-stretch-hand-handshake-greeting-you-say-hello-introduce-himself-with-friendly-smile-standing-white-background_176420-45289.jpg", alt: "Smiling caucasian man stretch hand for handshake"},
|
||||
]}
|
||||
avatarText="Присоединяйся к моим проектам"
|
||||
buttons={[
|
||||
{
|
||||
text: "Связаться со мной", href: "#contact"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "React"},
|
||||
{
|
||||
type: "text", text: "Next.js"},
|
||||
{
|
||||
type: "text", text: "TypeScript"},
|
||||
{
|
||||
type: "text", text: "Node.js"},
|
||||
{
|
||||
type: "text", text: "Tailwind CSS"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Никита Платонов"
|
||||
description="Дизайнер веб-сайтов. Создаю визуально впечатляющие и современные цифровые решения, фокусируясь на эстетике и функциональности."
|
||||
avatars={[]}
|
||||
buttons={[
|
||||
{ text: "Связаться", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Обо мне"
|
||||
description="Я Никита, студент, увлеченный созданием уникального веб-опыта. Мой подход сочетает передовые технологии и эстетичный дизайн, чтобы каждый проект был не просто сайтом, а инструментом для успеха."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Уникальные решения", description: "Пишу чистый код, ориентированный на задачи клиента."},
|
||||
{
|
||||
title: "Современный стек", description: "Использую Next.js, React и современные инструменты разработки."},
|
||||
{
|
||||
title: "Адаптивность", description: "Сайты, которые идеально смотрятся на всех устройствах."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/focus-businessman-making-eye-contact-working-his-table-office_662251-1418.jpg"
|
||||
imageAlt="modern office developer"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
heading={[
|
||||
{ type: 'text', content: "Обо мне и " },
|
||||
{ type: 'image', src: "http://img.b2bpic.net/free-photo/designer-desk-workspace_23-2148439366.jpg", alt: "Design workspace" },
|
||||
{ type: 'text', content: " моем подходе" }
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
ariaLabel="About section"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="skills" data-section="skills">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "1", value: "10+", description: "Завершенных проектов"},
|
||||
{
|
||||
id: "2", value: "2 года", description: "Опыта в разработке"},
|
||||
{
|
||||
id: "3", value: "500+", description: "Часов кодинга"},
|
||||
]}
|
||||
title="Технический стек"
|
||||
description="Мои профессиональные навыки в цифрах."
|
||||
/>
|
||||
</div>
|
||||
<div id="skills" data-section="skills">
|
||||
<MetricCardFourteen
|
||||
title="Мой процесс дизайна"
|
||||
tag="Website Design Focus"
|
||||
metrics={[
|
||||
{ id: "1", value: "2 года", description: "Опыта в дизайне" },
|
||||
{ id: "2", value: "UI/UX", description: "Ориентированность" },
|
||||
{ id: "3", value: "100%", description: "Внимание к деталям" },
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Связаться со мной"
|
||||
description="Готов обсудить ваш проект или сотрудничество."
|
||||
inputs={[
|
||||
{
|
||||
name: "name", type: "text", placeholder: "Ваше имя", required: true,
|
||||
},
|
||||
{
|
||||
name: "email", type: "email", placeholder: "Ваш Email", required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Опишите вашу задачу...", rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-digital-network-flow_84443-74097.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
title="Связь"
|
||||
description="Давайте обсудим ваш следующий проект через Telegram или VK."
|
||||
tag="Get in Touch"
|
||||
background={{ variant: "gradient-bars" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Навигация", items: [
|
||||
{
|
||||
label: "Главная", href: "#hero"},
|
||||
{
|
||||
label: "Обо мне", href: "#about"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Соцсети", items: [
|
||||
{
|
||||
label: "Telegram", href: "#"},
|
||||
{
|
||||
label: "VK", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Платонов Никита"
|
||||
bottomRightText="Все права защищены"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Навигация", items: [{ label: "Главная", href: "#hero" }, { label: "Обо мне", href: "#about" }] },
|
||||
{ title: "Соцсети", items: [{ label: "Telegram", href: "#" }, { label: "VK", href: "#" }] },
|
||||
]}
|
||||
bottomLeftText="© 2024 Nikita Platonov"
|
||||
bottomRightText="Designed with precision"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user