Compare commits

..

5 Commits

7 changed files with 54 additions and 38 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

View File

@ -1,11 +1,12 @@
'use client'; 'use client';
import { ChevronLeft, ChevronRight } from 'lucide-react'; import { ChevronLeft, ChevronRight} from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
import { Card, CardContent } from '@/shared/shadcn-ui/card'; import { Card, CardContent } from '@/shared/shadcn-ui/card';
import Link from 'next/link';
const promotions = [ const promotions = [
{ {
@ -106,13 +107,15 @@ export default function PromotionSlider() {
<span className='text-xs text-gray-500'> <span className='text-xs text-gray-500'>
Действует до: {promo.validUntil} Действует до: {promo.validUntil}
</span> </span>
<Link href='#'>
<Button <Button
variant='outline' variant='outline'
size='sm' size='sm'
className='border-red-600 text-red-600 hover:bg-red-50' className='border-red-600 text-red-600 hover:bg-red-50'
> >
Подробнее Подробнее
</Button> </Button>
</Link>
</div> </div>
</CardContent> </CardContent>
</Card> </Card>

View File

@ -74,18 +74,22 @@ export function CompanyTimeline() {
data-aos='zoom-in-down' data-aos='zoom-in-down'
> >
<div className='mb-2 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-2 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<Calendar className='h-5 w-5 text-red-600' /> <Calendar className='size-5 text-red-600' />
</div> </div>
<h3 className='text-xl font-bold'>{event.year}</h3> <h3 className='text-xl font-bold'>{event.year}</h3>
<h4 className='mb-2 text-lg font-semibold'>{event.title}</h4> <h4 className='mb-2 text-lg font-semibold'>{event.title}</h4>
</div> </div>
<div <div
className={`${index % 2 === 0 ? 'md:pl-10' : 'md:order-first md:pr-10 md:text-right'}`} className={
index % 2 === 0
? 'md:pl-10'
: 'md:order-first md:pr-10 md:text-right'
}
> >
<Card <Card
className='overflow-hidden transition-all hover:shadow-md' className='overflow-hidden transition-all hover:shadow-md'
data-aos={index % 2 === 0 ? 'fade-left' : 'fade-right'} data-aos={'fade-up'}
> >
<CardContent className='p-4'> <CardContent className='p-4'>
<p className='text-gray-600'>{event.description}</p> <p className='text-gray-600'>{event.description}</p>
@ -94,8 +98,8 @@ export function CompanyTimeline() {
</div> </div>
</div> </div>
<div className='absolute top-5 left-1/2 -ml-3 hidden h-6 w-6 items-center justify-center rounded-full bg-red-600 md:flex'> <div className='absolute top-5 left-1/2 -ml-3 hidden size-6 items-center justify-center rounded-full bg-red-600 md:flex'>
<div className='h-3 w-3 rounded-full bg-white'></div> <div className='size-3 rounded-full bg-white'></div>
</div> </div>
</div> </div>
))} ))}
@ -105,16 +109,18 @@ export function CompanyTimeline() {
<div className='mt-8 text-center'> <div className='mt-8 text-center'>
<Button <Button
variant='outline' variant='outline'
onClick={() => setExpanded(!expanded)} onClick={() => {
setExpanded(!expanded);
}}
className='inline-flex items-center' className='inline-flex items-center'
> >
{expanded ? ( {expanded ? (
<> <>
Свернуть <ChevronUp className='ml-2 h-4 w-4' /> Свернуть <ChevronUp className='ml-2 size-4' />
</> </>
) : ( ) : (
<> <>
Показать больше <ChevronDown className='ml-2 h-4 w-4' /> Показать больше <ChevronDown className='ml-2 size-4' />
</> </>
)} )}
</Button> </Button>

View File

@ -2,6 +2,7 @@
import { useLanguage } from '@/shared/language'; import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
import Link from 'next/link';
export const CtaSection = () => { export const CtaSection = () => {
const { t } = useLanguage(); const { t } = useLanguage();
@ -15,9 +16,11 @@ export const CtaSection = () => {
</h2> </h2>
<p className='mb-8 max-w-2xl'>{t('home.cta.description')}</p> <p className='mb-8 max-w-2xl'>{t('home.cta.description')}</p>
<div className='flex flex-col gap-4 sm:flex-row'> <div className='flex flex-col gap-4 sm:flex-row'>
<Button variant='secondary'> <Link href='#'>
{t('common.buttons.purchaseCardAtGasStations')} <Button variant='secondary'>
</Button> {t('common.buttons.purchaseCardAtGasStations')}
</Button>
</Link>
</div> </div>
</div> </div>
</div> </div>

View File

@ -42,7 +42,7 @@ export function DesktopNav() {
<ul className='grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]'> <ul className='grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]'>
<li className='row-span-4'> <li className='row-span-4'>
<NavigationMenuLink asChild> <NavigationMenuLink asChild>
<a <Link
className='flex h-full w-full flex-col justify-end rounded-md bg-gradient-to-b from-red-500 to-red-700 p-6 no-underline outline-none select-none focus:shadow-md' className='flex h-full w-full flex-col justify-end rounded-md bg-gradient-to-b from-red-500 to-red-700 p-6 no-underline outline-none select-none focus:shadow-md'
href='/clients' href='/clients'
> >
@ -53,21 +53,15 @@ export function DesktopNav() {
Специальные предложения, программы лояльности и удобные Специальные предложения, программы лояльности и удобные
способы оплаты для наших клиентов способы оплаты для наших клиентов
</p> </p>
</a> </Link>
</NavigationMenuLink> </NavigationMenuLink>
</li> </li>
<ListItem href='/clients/loyalty' title='Программа лояльности'> <ListItem href='/clients/loyalty' title='Программа лояльности'>
Накапливайте баллы и получайте скидки на топливо и услуги Накапливайте баллы и получайте скидки на топливо и услуги
</ListItem> </ListItem>
<ListItem href='/clients/fuel-card' title='Топливная карта'>
Удобный способ оплаты топлива для физических и юридических лиц
</ListItem>
<ListItem href='/clients/certificates' title='Сертификаты'> <ListItem href='/clients/certificates' title='Сертификаты'>
Подарочные сертификаты на топливо и услуги нашей сети Подарочные сертификаты на топливо и услуги нашей сети
</ListItem> </ListItem>
<ListItem href='/clients/payment' title='Способы оплаты'>
Различные способы оплаты на наших заправочных станциях
</ListItem>
</ul> </ul>
</NavigationMenuContent> </NavigationMenuContent>
</NavigationMenuItem> </NavigationMenuItem>

View File

@ -6,6 +6,7 @@ import '../../src/app/globals.css'
import { useLanguage } from '@/shared/language'; import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
import Link from 'next/link';
export const HeroSection = () => { export const HeroSection = () => {
const { t } = useLanguage(); const { t } = useLanguage();
@ -33,14 +34,18 @@ export const HeroSection = () => {
{t('home.hero.description')} {t('home.hero.description')}
</p> </p>
<div className='flex gap-4'> <div className='flex gap-4'>
<Button className='bg-red-600 hover:bg-red-700'> <Link href='#'>
{t('common.buttons.findStation')}{' '} <Button className='bg-red-600 hover:bg-red-700'>
<MapPin className='ml-2 h-4 w-4' /> {t('common.buttons.findStation')}{' '}
</Button> <MapPin className='ml-2 h-4 w-4' />
<Button variant='outline' className='animate-pulse' </Button>
> </Link>
{t('common.buttons.learnMore')} <Link href='#'>
</Button> <Button variant='outline' className='animate-pulse'
>
{t('common.buttons.learnMore')}
</Button>
</Link>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,9 +2,11 @@
import { Handshake } from 'lucide-react'; import { Handshake } from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import png from './7fe1595f25e868852247248389bc2b3ac910bf94.png'
import { useLanguage } from '@/shared/language'; import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
import Link from 'next/link';
export const PartnersSection = () => { export const PartnersSection = () => {
const { t } = useLanguage(); const { t } = useLanguage();
@ -28,7 +30,7 @@ export const PartnersSection = () => {
{[1, 2, 3, 4, 5, 6, 7, 8].map((partner) => ( {[1, 2, 3, 4, 5, 6, 7, 8].map((partner) => (
<div <div
key={partner} key={partner}
className='flex h-32 items-center justify-center rounded-lg bg-white p-6 shadow-md transition-transform hover:scale-105' className='flex h-32 items-center justify-center flex-col gap-0.5 rounded-lg bg-white p-6 shadow-md transition-transform hover:scale-105'
data-aos='flip-left' data-aos='flip-left'
> >
<Image <Image
@ -38,6 +40,7 @@ export const PartnersSection = () => {
height={80} height={80}
className='max-h-16 w-auto' className='max-h-16 w-auto'
/> />
<h4 className='font-extralight'>Название</h4>
</div> </div>
))} ))}
</div> </div>
@ -49,9 +52,11 @@ export const PartnersSection = () => {
<p className='mx-auto mb-6 max-w-2xl text-gray-600'> <p className='mx-auto mb-6 max-w-2xl text-gray-600'>
{t('home.partners.becomePartnerText')} {t('home.partners.becomePartnerText')}
</p> </p>
<Button className='bg-red-600 hover:bg-red-700'> <Link href='#'>
{t('common.buttons.contactUs')} <Button className='bg-red-600 hover:bg-red-700'>
</Button> {t('common.buttons.contactUs')}
</Button>
</Link>
</div> </div>
</div> </div>
</section> </section>