adilovcode/oriyo_next
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update: use language-hook for home page

Browse Source
This commit is contained in:
BunyodL 2025-04-26 19:32:41 +05:00
parent 6810f1c844
commit 2e22b4a513
11 changed files with 152 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/shared/language/context/language-provider.tsx
View File

@ -37,7 +37,6 @@ export const LanguageContext = createContext<LanguageContextType | undefined>(
export function LanguageProvider({ children }: { children: ReactNode }) { export function LanguageProvider({ children }: { children: ReactNode }) {
// Default to Russian, but check localStorage on client // Default to Russian, but check localStorage on client
const [language, setLanguageState] = useState<Language>('ru'); const [language, setLanguageState] = useState<Language>('ru');
const [isLoaded, setIsLoaded] = useState(false);
useEffect(() => { useEffect(() => {
// Check if we're in the browser // Check if we're in the browser
@ -46,7 +45,6 @@ export function LanguageProvider({ children }: { children: ReactNode }) {
if (savedLanguage && languages[savedLanguage]) { if (savedLanguage && languages[savedLanguage]) {
setLanguageState(savedLanguage); setLanguageState(savedLanguage);
} }
setIsLoaded(true);
} }
}, []); }, []);

42
src/widgets/about-section.tsx
View File

@ -1,30 +1,27 @@
'use client';
import { Users } from 'lucide-react'; import { Users } from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import AboutCounter from '@/shared/components/about-counter'; import AboutCounter from '@/shared/components/about-counter';
import { useLanguage } from '@/shared/language';
export const AboutSection = () => { export const AboutSection = () => {
const { t } = useLanguage();
return ( return (
<section id='about' className='py-16'> <section id='about' className='py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='grid items-center gap-12 md:grid-cols-2'> <div className='grid items-center gap-12 md:grid-cols-2'>
<div data-aos='fade-right'> <div>
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<Users className='h-6 w-6 text-red-600' /> <Users className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-6 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-6 text-3xl font-bold tracking-tight sm:text-4xl'>
О нашей компании {t('home.about.title')}
</h2> </h2>
<p className='mb-6 text-gray-600'> <p className='mb-6 text-gray-600'>{t('home.about.description1')}</p>
Наша сеть заправок является одной из ведущих в Таджикистане. Мы <p className='mb-6 text-gray-600'>{t('home.about.description2')}</p>
предоставляем качественное топливо и высокий уровень обслуживания
для наших клиентов уже более 15 лет.
</p>
<p className='mb-6 text-gray-600'>
Мы постоянно развиваемся, открывая новые станции и улучшая сервис
на существующих. Наша цель - сделать заправку автомобиля
максимально удобной и быстрой для каждого клиента.
</p>
<AboutCounter /> <AboutCounter />
<div className='space-y-4'> <div className='space-y-4'>
@ -33,9 +30,11 @@ export const AboutSection = () => {
<span className='text-xs text-white'>✓</span> <span className='text-xs text-white'>✓</span>
</div> </div>
<div className='ml-3'> <div className='ml-3'>
<h3 className='text-lg font-medium'>Качественное топливо</h3> <h3 className='text-lg font-medium'>
{t('home.about.features.quality.title')}
</h3>
<p className='text-gray-600'> <p className='text-gray-600'>
Мы гарантируем высокое качество нашего топлива {t('home.about.features.quality.description')}
</p> </p>
</div> </div>
</div> </div>
@ -45,10 +44,10 @@ export const AboutSection = () => {
</div> </div>
<div className='ml-3'> <div className='ml-3'>
<h3 className='text-lg font-medium'> <h3 className='text-lg font-medium'>
Современное оборудование {t('home.about.features.equipment.title')}
</h3> </h3>
<p className='text-gray-600'> <p className='text-gray-600'>
Все наши станции оснащены современным оборудованием {t('home.about.features.equipment.description')}
</p> </p>
</div> </div>
</div> </div>
@ -58,19 +57,16 @@ export const AboutSection = () => {
</div> </div>
<div className='ml-3'> <div className='ml-3'>
<h3 className='text-lg font-medium'> <h3 className='text-lg font-medium'>
Профессиональный персонал {t('home.about.features.staff.title')}
</h3> </h3>
<p className='text-gray-600'> <p className='text-gray-600'>
Наши сотрудники - профессионалы своего дела {t('home.about.features.staff.description')}
</p> </p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div <div className='relative h-[400px] overflow-hidden rounded-xl shadow-xl'>
data-aos='fade-up'
className='relative h-[400px] overflow-hidden rounded-xl shadow-xl'
>
<Image <Image
src='/placeholder.svg?height=400&width=600' src='/placeholder.svg?height=400&width=600'
alt='About our company' alt='About our company'

32
src/widgets/charity-section.tsx
View File

@ -1,17 +1,19 @@
'use client';
import { ChevronRight, Heart } from 'lucide-react'; import { ChevronRight, Heart } from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const CharitySection = () => { export const CharitySection = () => {
const { t } = useLanguage();
return ( return (
<section id='charity' className='py-16'> <section id='charity' className='py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='grid items-center gap-12 md:grid-cols-2'> <div className='grid items-center gap-12 md:grid-cols-2'>
<div <div className='relative order-2 h-[400px] overflow-hidden rounded-xl shadow-xl md:order-1'>
data-aos='zoom-in'
className='relative order-2 h-[400px] overflow-hidden rounded-xl shadow-xl md:order-1'
>
<Image <Image
src='/placeholder.svg?height=400&width=600' src='/placeholder.svg?height=400&width=600'
alt='Charity Foundation' alt='Charity Foundation'
@ -24,36 +26,32 @@ export const CharitySection = () => {
<Heart className='h-6 w-6 text-red-600' /> <Heart className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-6 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-6 text-3xl font-bold tracking-tight sm:text-4xl'>
Благотворительный фонд {t('home.charity.title')}
</h2> </h2>
<p className='mb-6 text-gray-600'> <p className='mb-6 text-gray-600'>
Наш благотворительный фонд был создан для поддержки социально {t('home.charity.description')}
значимых проектов в Таджикистане. Мы стремимся внести свой вклад в
развитие общества и помочь тем, кто в этом нуждается.
</p>
<p className='mb-6 text-gray-600'>
Основные направления деятельности нашего фонда:
</p> </p>
<p className='mb-6 text-gray-600'>{t('home.charity.directions')}</p>
<ul className='mb-6 space-y-2'> <ul className='mb-6 space-y-2'>
<li className='flex items-center'> <li className='flex items-center'>
<ChevronRight className='mr-2 h-5 w-5 text-red-600' /> <ChevronRight className='mr-2 h-5 w-5 text-red-600' />
<span>Поддержка образовательных программ</span> <span>{t('home.charity.education')}</span>
</li> </li>
<li className='flex items-center'> <li className='flex items-center'>
<ChevronRight className='mr-2 h-5 w-5 text-red-600' /> <ChevronRight className='mr-2 h-5 w-5 text-red-600' />
<span>Помощь детям из малообеспеченных семей</span> <span>{t('home.charity.children')}</span>
</li> </li>
<li className='flex items-center'> <li className='flex items-center'>
<ChevronRight className='mr-2 h-5 w-5 text-red-600' /> <ChevronRight className='mr-2 h-5 w-5 text-red-600' />
<span>Экологические инициативы</span> <span>{t('home.charity.ecology')}</span>
</li> </li>
<li className='flex items-center'> <li className='flex items-center'>
<ChevronRight className='mr-2 h-5 w-5 text-red-600' /> <ChevronRight className='mr-2 h-5 w-5 text-red-600' />
<span>Поддержка спортивных мероприятий</span> <span>{t('home.charity.sports')}</span>
</li> </li>
</ul> </ul>
<Button className='bg-red-600 hover:bg-red-700'> <Button className='bg-red-600 hover:bg-red-700'>
Подробнее о фонде {t('home.charity.learnMore')}
</Button> </Button>
</div> </div>
</div> </div>

25
src/widgets/cta-section.tsx
View File

@ -1,21 +1,28 @@
'use client';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const CtaSection = () => { export const CtaSection = () => {
const { t } = useLanguage();
return ( return (
<section className='bg-red-600 py-16 text-white'> <section className='bg-red-600 py-16 text-white'>
<div className='container mx-auto'> <div className='container'>
<div className='flex flex-col items-center text-center'> <div className='flex flex-col items-center text-center'>
<h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>
Присоединяйтесь к нам {t('home.cta.title')}
</h2> </h2>
<p className='mb-8 max-w-2xl'> <p className='mb-8 max-w-2xl'>{t('home.cta.description')}</p>
Станьте частью нашей сети. Получайте специальные предложения, бонусы
и скидки.
</p>
<div className='flex flex-col gap-4 sm:flex-row'> <div className='flex flex-col gap-4 sm:flex-row'>
<Button variant='outline'>Скачать приложение</Button> <Button
<Button variant='secondary'> variant='outline'
Получить карту лояльности className='border-white text-white hover:bg-white/10'
>
{t('common.buttons.downloadApp')}
</Button>
<Button className='bg-white text-red-600 hover:bg-gray-100'>
{t('common.buttons.getLoyaltyCard')}
</Button> </Button>
</div> </div>
</div> </div>

65
src/widgets/footer.tsx
View File

@ -1,22 +1,24 @@
'use client';
import { Fuel, Mail, MapPin, Phone } from 'lucide-react'; import { Fuel, Mail, MapPin, Phone } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const Footer = () => { export const Footer = () => {
const { t } = useLanguage();
return ( return (
<footer className='bg-gray-900 py-12 text-white'> <footer className='bg-gray-900 py-12 text-white'>
<div className='container mx-auto'> <div className='container'>
<div className='grid grid-cols-1 gap-8 md:grid-cols-4'> <div className='grid grid-cols-1 gap-8 md:grid-cols-4'>
<div> <div>
<div className='mb-4 flex items-center gap-2'> <div className='mb-4 flex items-center gap-2'>
<Fuel className='h-6 w-6 text-red-500' /> <Fuel className='h-6 w-6 text-red-500' />
<span className='text-xl font-bold'>GasNetwork</span> <span className='text-xl font-bold'>GasNetwork</span>
</div> </div>
<p className='mb-4 text-gray-400'> <p className='mb-4 text-gray-400'>{t('home.hero.description')}</p>
Сеть современных заправок в Таджикистане. Качественное топливо и
отличный сервис.
</p>
<div className='flex space-x-4'> <div className='flex space-x-4'>
<a href='#' className='text-gray-400 hover:text-white'> <a href='#' className='text-gray-400 hover:text-white'>
<svg <svg
@ -59,7 +61,9 @@ export const Footer = () => {
</div> </div>
</div> </div>
<div> <div>
<h3 className='mb-4 text-lg font-semibold'>Контакты</h3> <h3 className='mb-4 text-lg font-semibold'>
{t('common.footer.contacts')}
</h3>
<div className='space-y-3'> <div className='space-y-3'>
<div className='flex items-start'> <div className='flex items-start'>
<MapPin className='mt-0.5 mr-3 h-5 w-5 text-red-500' /> <MapPin className='mt-0.5 mr-3 h-5 w-5 text-red-500' />
@ -76,76 +80,69 @@ export const Footer = () => {
</div> </div>
</div> </div>
<div> <div>
<h3 className='mb-4 text-lg font-semibold'>Навигация</h3> <h3 className='mb-4 text-lg font-semibold'>
{t('common.footer.navigation')}
</h3>
<ul className='space-y-2'> <ul className='space-y-2'>
<li> <li>
<Link <Link href='/' className='text-gray-400 hover:text-white'>
href='#stations' {t('common.navigation.home')}
className='text-gray-400 hover:text-white'
>
Наши заправки
</Link> </Link>
</li> </li>
<li> <li>
<Link href='#about' className='text-gray-400 hover:text-white'> <Link href='/about' className='text-gray-400 hover:text-white'>
О нас {t('common.navigation.about')}
</Link> </Link>
</li> </li>
<li> <li>
<Link <Link
href='#vacancies' href='/clients/loyalty'
className='text-gray-400 hover:text-white' className='text-gray-400 hover:text-white'
> >
Вакансии {t('common.navigation.clients')}
</Link> </Link>
</li> </li>
<li> <li>
<Link <Link
href='#promotions' href='/#stations'
className='text-gray-400 hover:text-white' className='text-gray-400 hover:text-white'
> >
Акции {t('common.navigation.stations')}
</Link> </Link>
</li> </li>
<li> <li>
<Link <Link
href='#partners' href='/#vacancies'
className='text-gray-400 hover:text-white' className='text-gray-400 hover:text-white'
> >
Партнеры {t('common.navigation.vacancies')}
</Link>
</li>
<li>
<Link
href='#charity'
className='text-gray-400 hover:text-white'
>
Благотворительность
</Link> </Link>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div>
<h3 className='mb-4 text-lg font-semibold'>Подписка</h3> <h3 className='mb-4 text-lg font-semibold'>
{t('common.footer.subscribe')}
</h3>
<p className='mb-4 text-gray-400'> <p className='mb-4 text-gray-400'>
Подпишитесь на нашу рассылку, чтобы получать новости и специальные {t('common.footer.subscribeText')}
предложения.
</p> </p>
<form className='space-y-2'> <form className='space-y-2'>
<input <input
type='email' type='email'
placeholder='Ваш email' placeholder={t('common.footer.yourEmail')}
className='w-full rounded-md border border-gray-700 bg-gray-800 px-4 py-2 text-white' className='w-full rounded-md border border-gray-700 bg-gray-800 px-4 py-2 text-white'
/> />
<Button className='w-full bg-red-600 hover:bg-red-700'> <Button className='w-full bg-red-600 hover:bg-red-700'>
Подписаться {t('common.footer.subscribe')}
</Button> </Button>
</form> </form>
</div> </div>
</div> </div>
<div className='mt-8 border-t border-gray-800 pt-8 text-center text-gray-400'> <div className='mt-8 border-t border-gray-800 pt-8 text-center text-gray-400'>
<p> <p>
&copy; {new Date().getFullYear()} GasNetwork. Все права защищены. &copy; {new Date().getFullYear()} GasNetwork.{' '}
{t('common.footer.rights')}
</p> </p>
</div> </div>
</div> </div>

11
src/widgets/header/ui/index.tsx
View File

@ -1,6 +1,10 @@
'use client';
import { UserCircle } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import { Logo } from '@/shared/assets/logo'; import { Logo } from '@/shared/assets/logo';
import { useLanguage } from '@/shared/language';
import { LanguageSwitcher } from '@/shared/language/ui/language-switcher'; import { LanguageSwitcher } from '@/shared/language/ui/language-switcher';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
@ -8,6 +12,8 @@ import { DesktopNav } from './desktop-nav';
import { MobileNav } from './mobile-nav'; import { MobileNav } from './mobile-nav';
export function Header() { export function Header() {
const { t } = useLanguage();
return ( return (
<header className='sticky top-0 z-40 w-full border-b bg-white'> <header className='sticky top-0 z-40 w-full border-b bg-white'>
<div className='container mx-auto flex h-16 items-center justify-between p-4'> <div className='container mx-auto flex h-16 items-center justify-between p-4'>
@ -18,7 +24,10 @@ export function Header() {
<div className='flex items-center gap-6'> <div className='flex items-center gap-6'>
<LanguageSwitcher /> <LanguageSwitcher />
<Link href={'/login'}> <Link href={'/login'}>
<Button>Вход</Button> <Button className='flex items-center gap-2'>
<UserCircle className='size-4' />
{t('common.buttons.login')}
</Button>
</Link> </Link>
</div> </div>
</div> </div>

21
src/widgets/hero-section.tsx
View File

@ -1,9 +1,14 @@
'use client';
import { MapPin } from 'lucide-react'; import { MapPin } from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const HeroSection = () => { export const HeroSection = () => {
const { t } = useLanguage();
return ( return (
<section className='relative'> <section className='relative'>
<div className='relative h-[500px] w-full overflow-hidden'> <div className='relative h-[500px] w-full overflow-hidden'>
@ -16,22 +21,24 @@ export const HeroSection = () => {
priority priority
/> />
<div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30'> <div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30'>
<div className='container mx-auto'> <div className='container'>
<div className='max-w-lg space-y-4 text-white'> <div className='max-w-lg space-y-4 text-white'>
<h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl'> <h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl'>
Сеть современных заправок в Таджикистане {t('home.hero.title')}
</h1> </h1>
<p className='text-lg text-gray-200'> <p className='text-lg text-gray-200'>
Качественное топливо, удобное расположение и отличный сервис для {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'> <Button className='bg-red-600 hover:bg-red-700'>
Найти заправку <MapPin className='ml-2 h-4 w-4' /> {t('common.buttons.findStation')}{' '}
<MapPin className='ml-2 h-4 w-4' />
</Button> </Button>
<Button variant='outline' <Button
variant='outline'
className='border-white text-white hover:bg-white/10'
> >
Узнать больше {t('common.buttons.learnMore')}
</Button> </Button>
</div> </div>
</div> </div>

20
src/widgets/map-section.tsx
View File

@ -1,34 +1,36 @@
'use client';
import { ChevronRight, MapPin } from 'lucide-react'; import { ChevronRight, MapPin } from 'lucide-react';
import { GasStationMap } from '@/features/map'; import { GasStationMap } from '@/features/map';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const MapSection = () => { export const MapSection = () => {
const { t } = useLanguage();
return ( return (
<section id='stations' className='bg-gray-50 py-16'> <section id='stations' className='bg-gray-50 py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='mb-12 flex flex-col items-center justify-center text-center'> <div className='mb-12 flex flex-col items-center justify-center text-center'>
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<MapPin className='h-6 w-6 text-red-600' /> <MapPin className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>
Наши заправки {t('home.stations.title')}
</h2> </h2>
<p className='max-w-2xl text-gray-600'> <p className='max-w-2xl text-gray-600'>
Найдите ближайшую к вам заправку нашей сети. Мы расположены в {t('home.stations.description')}
удобных местах по всему Таджикистану.
</p> </p>
</div> </div>
<div <div className='h-[500px] overflow-hidden rounded-xl border shadow-lg'>
data-aos='fade-up'
className='h-[500px] overflow-hidden rounded-xl border shadow-lg'
>
<GasStationMap /> <GasStationMap />
</div> </div>
<div className='mt-8 flex justify-center'> <div className='mt-8 flex justify-center'>
<Button className='bg-red-600 hover:bg-red-700'> <Button className='bg-red-600 hover:bg-red-700'>
Показать все заправки <ChevronRight className='ml-2 h-4 w-4' /> {t('home.stations.showAll')}{' '}
<ChevronRight className='ml-2 h-4 w-4' />
</Button> </Button>
</div> </div>
</div> </div>

22
src/widgets/partners-section.tsx
View File

@ -1,22 +1,26 @@
'use client';
import { Handshake } from 'lucide-react'; import { Handshake } from 'lucide-react';
import Image from 'next/image'; import Image from 'next/image';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const PartnersSection = () => { export const PartnersSection = () => {
const { t } = useLanguage();
return ( return (
<section id='partners' className='bg-gray-50 py-16'> <section id='partners' className='bg-gray-50 py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='mb-12 flex flex-col items-center justify-center text-center'> <div className='mb-12 flex flex-col items-center justify-center text-center'>
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<Handshake className='h-6 w-6 text-red-600' /> <Handshake className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>
Наши партнеры {t('home.partners.title')}
</h2> </h2>
<p className='max-w-2xl text-gray-600'> <p className='max-w-2xl text-gray-600'>
Мы сотрудничаем с ведущими компаниями для предоставления лучших {t('home.partners.description')}
услуг нашим клиентам.
</p> </p>
</div> </div>
@ -25,7 +29,6 @@ export const PartnersSection = () => {
<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 rounded-lg bg-white p-6 shadow-md transition-transform hover:scale-105'
data-aos='flip-up'
> >
<Image <Image
src={`/placeholder.svg?height=80&width=160&text=Partner ${partner}`} src={`/placeholder.svg?height=80&width=160&text=Partner ${partner}`}
@ -39,13 +42,14 @@ export const PartnersSection = () => {
</div> </div>
<div className='mt-12 text-center'> <div className='mt-12 text-center'>
<h3 className='mb-4 text-xl font-bold'>Станьте нашим партнером</h3> <h3 className='mb-4 text-xl font-bold'>
{t('home.partners.becomePartner')}
</h3>
<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')}
Свяжитесь с нами для обсуждения возможностей.
</p> </p>
<Button className='bg-red-600 hover:bg-red-700'> <Button className='bg-red-600 hover:bg-red-700'>
Связаться с нами {t('common.buttons.contactUs')}
</Button> </Button>
</div> </div>
</div> </div>

15
src/widgets/promotions-section.tsx
View File

@ -1,28 +1,33 @@
'use client';
import { ArrowRight, Gift } from 'lucide-react'; import { ArrowRight, Gift } from 'lucide-react';
import PromotionSlider from '@/shared/components/promotion-slider'; import PromotionSlider from '@/shared/components/promotion-slider';
import { useLanguage } from '@/shared/language';
import { Button } from '@/shared/shadcn-ui/button'; import { Button } from '@/shared/shadcn-ui/button';
export const PromotionsSection = () => { export const PromotionsSection = () => {
const { t } = useLanguage();
return ( return (
<section id='promotions' className='bg-gray-50 py-16'> <section id='promotions' className='bg-gray-50 py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='mb-12 flex flex-col items-center justify-center text-center'> <div className='mb-12 flex flex-col items-center justify-center text-center'>
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<Gift className='h-6 w-6 text-red-600' /> <Gift className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>
Актуальные акции {t('home.promotions.title')}
</h2> </h2>
<p className='max-w-2xl text-gray-600'> <p className='max-w-2xl text-gray-600'>
Специальные предложения и акции для наших клиентов. Заправляйтесь {t('home.promotions.description')}
выгодно!
</p> </p>
</div> </div>
<PromotionSlider /> <PromotionSlider />
<div className='mt-8 flex justify-center'> <div className='mt-8 flex justify-center'>
<Button className='bg-red-600 hover:bg-red-700'> <Button className='bg-red-600 hover:bg-red-700'>
Все акции <ArrowRight className='ml-2 h-4 w-4' /> {t('home.promotions.viewAll')}{' '}
<ArrowRight className='ml-2 h-4 w-4' />
</Button> </Button>
</div> </div>
</div> </div>

22
src/widgets/vacancies-section.tsx
View File

@ -1,5 +1,8 @@
'use client';
import { ArrowRight, Briefcase } from 'lucide-react'; import { ArrowRight, Briefcase } from 'lucide-react';
import { useLanguage } from '@/shared/language';
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 { import {
@ -10,19 +13,20 @@ import {
} from '@/shared/shadcn-ui/tabs'; } from '@/shared/shadcn-ui/tabs';
export const VacanciesSection = () => { export const VacanciesSection = () => {
const { t } = useLanguage();
return ( return (
<section id='vacancies' className='py-16'> <section id='vacancies' className='py-16'>
<div className='container mx-auto'> <div className='container'>
<div className='mb-12 flex flex-col items-center justify-center text-center'> <div className='mb-12 flex flex-col items-center justify-center text-center'>
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'> <div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
<Briefcase className='h-6 w-6 text-red-600' /> <Briefcase className='h-6 w-6 text-red-600' />
</div> </div>
<h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'> <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>
Вакансии {t('home.vacancies.title')}
</h2> </h2>
<p className='max-w-2xl text-gray-600'> <p className='max-w-2xl text-gray-600'>
Присоединяйтесь к нашей команде профессионалов. Мы предлагаем {t('home.vacancies.description')}
стабильную работу и возможности для роста.
</p> </p>
</div> </div>
@ -42,7 +46,6 @@ export const VacanciesSection = () => {
<Card <Card
key={index} key={index}
className='overflow-hidden transition-all hover:shadow-md' className='overflow-hidden transition-all hover:shadow-md'
data-aos={index % 2 === 0 ? 'fade-right' : 'fade-left'}
> >
<CardContent className='p-0'> <CardContent className='p-0'>
<div className='p-6'> <div className='p-6'>
@ -62,7 +65,7 @@ export const VacanciesSection = () => {
</div> </div>
</div> </div>
<Button variant='outline' size='sm'> <Button variant='outline' size='sm'>
Подробнее {t('common.buttons.readMore')}
</Button> </Button>
</div> </div>
</div> </div>
@ -98,7 +101,7 @@ export const VacanciesSection = () => {
</div> </div>
</div> </div>
<Button variant='outline' size='sm'> <Button variant='outline' size='sm'>
Подробнее {t('common.buttons.readMore')}
</Button> </Button>
</div> </div>
</div> </div>
@ -131,7 +134,7 @@ export const VacanciesSection = () => {
</div> </div>
</div> </div>
<Button variant='outline' size='sm'> <Button variant='outline' size='sm'>
Подробнее {t('common.buttons.readMore')}
</Button> </Button>
</div> </div>
</div> </div>
@ -144,7 +147,8 @@ export const VacanciesSection = () => {
<div className='mt-8 flex justify-center'> <div className='mt-8 flex justify-center'>
<Button className='bg-red-600 hover:bg-red-700'> <Button className='bg-red-600 hover:bg-red-700'>
Отправить резюме <ArrowRight className='ml-2 h-4 w-4' /> {t('home.vacancies.sendResume')}{' '}
<ArrowRight className='ml-2 h-4 w-4' />
</Button> </Button>
</div> </div>
</div> </div>