Удалены изображения сотрудников и секция отзывов, обновлены стили и тексты в секциях о компании, контактах и примерах работ для улучшения визуального восприятия и информативности.

This commit is contained in:
albivkt
2025-07-06 23:47:40 +03:00
parent 2ca5ac4f9d
commit f53e9888b9
23 changed files with 154 additions and 72 deletions

BIN
public/images/4.1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 74 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 113 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 122 KiB

BIN
public/images/electro.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 159 KiB

BIN
public/images/kanal.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
public/images/koroche.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 111 KiB

BIN
public/images/koroche2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 467 KiB

BIN
public/images/koroche3.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 288 KiB

BIN
public/images/koroche4.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

BIN
public/images/koroche5.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 219 KiB

BIN
public/images/koroche6.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

BIN
public/images/otop.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 170 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 219 KiB

BIN
public/images/voda.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 174 KiB

View File

@ -5,7 +5,6 @@ import AboutSection from '@/components/AboutSection';
import ProjectsSection from '@/components/ProjectsSection'; import ProjectsSection from '@/components/ProjectsSection';
import WhyChooseUsSection from '@/components/WhyChooseUsSection'; import WhyChooseUsSection from '@/components/WhyChooseUsSection';
import WorkExamplesSection from '@/components/TeamSection'; import WorkExamplesSection from '@/components/TeamSection';
import ReviewsSection from '@/components/ReviewsSection';
import ContactSection from '@/components/ContactSection'; import ContactSection from '@/components/ContactSection';
import Footer from '@/components/Footer'; import Footer from '@/components/Footer';
import Image from 'next/image'; import Image from 'next/image';
@ -198,7 +197,6 @@ export default function Home() {
<ProjectsSection onCatalogClick={() => setIsCatalogModalOpen(true)} /> <ProjectsSection onCatalogClick={() => setIsCatalogModalOpen(true)} />
<WhyChooseUsSection /> <WhyChooseUsSection />
<WorkExamplesSection /> <WorkExamplesSection />
<ReviewsSection />
<ContactSection /> <ContactSection />
<Footer /> <Footer />
</main> </main>

View File

@ -88,12 +88,12 @@ const AboutSection = () => {
{features.map((feature, index) => ( {features.map((feature, index) => (
<FadeInSection key={index} delay={0.3 + index * 0.1}> <FadeInSection key={index} delay={0.3 + index * 0.1}>
<div className="flex items-start space-x-4 p-4 rounded-xl bg-white/80 backdrop-blur-sm border border-gray-200 hover:bg-white/90 hover:shadow-lg transition-all duration-300 group"> <div className="flex items-start space-x-4 p-4 rounded-xl bg-white/80 backdrop-blur-sm border border-gray-200 hover:bg-white/90 hover:shadow-lg transition-all duration-300 group">
<div className="text-2xl group-hover:scale-110 transition-transform duration-300"> <div className="text-3xl group-hover:scale-110 transition-transform duration-300">
{feature.icon} {feature.icon}
</div> </div>
<div> <div>
<h4 className="font-semibold text-gray-800 mb-1">{feature.title}</h4> <h4 className="font-bold text-gray-800 mb-2 text-xl">{feature.title}</h4>
<p className="text-gray-600 text-lg">{feature.description}</p> <p className="text-gray-600 text-xl leading-relaxed">{feature.description}</p>
</div> </div>
</div> </div>
</FadeInSection> </FadeInSection>
@ -115,13 +115,13 @@ const AboutSection = () => {
<div className="absolute inset-0 rounded-2xl bg-gradient-to-br from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div> <div className="absolute inset-0 rounded-2xl bg-gradient-to-br from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div className="relative z-10 text-center"> <div className="relative z-10 text-center">
<div className="text-3xl mb-2 group-hover:scale-110 transition-transform duration-300"> <div className="text-5xl mb-4 group-hover:scale-110 transition-transform duration-300">
{stat.icon} {stat.icon}
</div> </div>
<div className="text-3xl font-bold text-gray-800 mb-2 group-hover:text-blue-600 transition-all duration-300 drop-shadow-lg"> <div className="text-5xl font-bold text-gray-800 mb-4 group-hover:text-blue-600 transition-all duration-300 drop-shadow-lg">
{stat.number} {stat.number}
</div> </div>
<div className="text-gray-600 text-sm font-medium"> <div className="text-gray-600 text-lg font-medium leading-relaxed">
{stat.label} {stat.label}
</div> </div>
</div> </div>
@ -137,10 +137,53 @@ const AboutSection = () => {
<FadeInSection as="div" delay={0.6} className="text-center mt-16"> <FadeInSection as="div" delay={0.6} className="text-center mt-16">
<button <button
onClick={() => setIsContactModalOpen(true)} onClick={() => setIsContactModalOpen(true)}
className="inline-flex items-center space-x-2 px-6 py-3 rounded-full bg-gradient-to-r from-blue-500/20 to-purple-500/20 border border-blue-300 backdrop-blur-sm hover:scale-105 transition-transform duration-300 cursor-pointer hover:from-blue-500/30 hover:to-purple-500/30" className="group relative overflow-hidden rounded-2xl hover:scale-105 transition-all duration-500 shadow-2xl hover:shadow-3xl"
> >
<span className="text-gray-800 font-medium">Готовы начать строительство?</span> {/* Фоновое изображение */}
<div className="w-2 h-2 bg-green-400 rounded-full"></div> <div className="absolute inset-0">
<Image
src="/images/4.1.png"
alt="Строительство дома"
fill
className="object-cover"
/>
</div>
{/* Анимированный блик */}
<div className="absolute top-0 left-0 w-full h-full bg-gradient-to-r from-transparent via-white/20 to-transparent -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-700"></div>
{/* Контент кнопки */}
<div className="relative z-10 px-8 py-6 rounded-2xl backdrop-blur-sm">
<div className="flex items-center justify-center space-x-4">
{/* Иконка дома */}
<div className="flex-shrink-0 w-12 h-12 bg-white/20 rounded-full flex items-center justify-center group-hover:scale-110 transition-transform duration-300">
<svg className="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
<path d="M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z"/>
</svg>
</div>
{/* Текст */}
<div className="text-center">
<h3 className="text-xl font-bold text-white mb-1 group-hover:text-yellow-200 transition-colors duration-300 drop-shadow-lg">
Готовы начать строительство?
</h3>
<p className="text-white/90 text-sm group-hover:text-white transition-colors duration-300 drop-shadow-md">
Получите бесплатную консультацию прямо сейчас
</p>
</div>
{/* Стрелка */}
<div className="flex-shrink-0 w-8 h-8 bg-white/20 rounded-full flex items-center justify-center group-hover:translate-x-1 transition-transform duration-300">
<svg className="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</div>
</div>
{/* Декоративные элементы */}
<div className="absolute top-2 right-2 w-2 h-2 bg-yellow-400 rounded-full animate-pulse"></div>
<div className="absolute bottom-2 left-2 w-1 h-1 bg-white/60 rounded-full"></div>
</div>
</button> </button>
</FadeInSection> </FadeInSection>
</div> </div>

View File

@ -88,9 +88,12 @@ const ContactSection = () => {
<h3 className="text-xl font-bold text-gray-800 mb-2 group-hover/item:text-blue-600 transition-colors duration-300"> <h3 className="text-xl font-bold text-gray-800 mb-2 group-hover/item:text-blue-600 transition-colors duration-300">
Телефон Телефон
</h3> </h3>
<span className="text-gray-600 text-lg"> <a
будет другой href="tel:+79530132423"
</span> className="text-gray-600 text-lg hover:text-blue-600 hover:bg-blue-50 px-2 py-1 rounded-lg transition-all duration-300 cursor-pointer"
>
7 953 013 24 23
</a>
</div> </div>
</div> </div>

View File

@ -51,19 +51,36 @@ const Header = () => {
<div className="hidden md:flex items-center space-x-6 flex-shrink-0"> <div className="hidden md:flex items-center space-x-6 flex-shrink-0">
<div className="text-right"> <div className="text-right">
<a <a
href="tel:+78352329226" href="tel:+79530132423"
className="flex items-center text-white hover:text-blue-400 transition-colors group text-lg font-semibold whitespace-nowrap" className="flex items-center text-white hover:text-blue-400 transition-colors group text-lg font-semibold whitespace-nowrap"
> >
+7 8352 32 92 26 +7 953 013 24 23
</a> </a>
<div className="text-xs text-gray-300 mt-1">Пн - Вс с 8:00 до 20:00</div> <div className="text-xs text-gray-300 mt-1">Пн - Вс с 8:00 до 20:00</div>
</div> </div>
<button <button
onClick={() => setIsModalOpen(true)} onClick={() => setIsModalOpen(true)}
className="bg-gradient-to-r from-blue-500/20 to-purple-500/20 border border-white/20 backdrop-blur-sm text-white px-8 py-3.5 rounded-lg hover:from-blue-500/30 hover:to-purple-500/30 hover:border-white/40 transition-all duration-300 hover:scale-105 text-base font-semibold flex-shrink-0 flex items-center space-x-2 group" className="relative bg-gradient-to-r from-orange-500 to-red-500 text-white px-8 py-3.5 rounded-lg font-bold text-base flex-shrink-0 flex items-center space-x-2 group overflow-hidden transform hover:scale-105 transition-all duration-300 shadow-lg hover:shadow-xl animate-pulse hover:animate-none"
> >
{/* Светящийся фон */}
<div className="absolute inset-0 bg-gradient-to-r from-orange-400 to-red-400 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
{/* Анимированная граница */}
<div className="absolute inset-0 rounded-lg bg-gradient-to-r from-yellow-400 via-orange-500 to-red-500 opacity-75 blur-sm group-hover:blur-md transition-all duration-300"></div>
<div className="absolute inset-0.5 bg-gradient-to-r from-orange-500 to-red-500 rounded-lg"></div>
{/* Контент кнопки */}
<div className="relative z-10 flex items-center space-x-2">
<Phone className="w-5 h-5 group-hover:animate-bounce" /> <Phone className="w-5 h-5 group-hover:animate-bounce" />
<span>Оставить заявку</span> <span className="relative">
Оставить заявку
{/* Подчеркивание */}
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-yellow-300 group-hover:w-full transition-all duration-300"></span>
</span>
</div>
{/* Блик */}
<div className="absolute top-0 left-0 w-full h-full bg-gradient-to-r from-transparent via-white/20 to-transparent -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-700"></div>
</button> </button>
</div> </div>

View File

@ -9,51 +9,51 @@ import { Droplets, Zap, Thermometer, Wrench } from 'lucide-react';
const workExamples = [ const workExamples = [
{ {
id: 1, id: 1,
title: ом из газобетона', title: еревянный каркасный дом',
description: 'Современный двухэтажный дом площадью 120 кв.м. с чистовой отделкой', description: 'Г.Чебоксары п. Альгешево, 100 м2',
image: '/images/1q.jpeg', image: '/images/koroche.jpg',
area: '120 кв.м', area: '100 кв.м',
material: 'Газобетон', material: 'Каркасная технология',
}, },
{ {
id: 2, id: 2,
title: 'Каркасный дом', title: 'Деревянный каркасный дом',
description: 'Уютный одноэтажный дом с террасой, построен за 45 дней', description: 'г. Мариинский Посад, 80 м2',
image: '/images/2q.jpeg', image: '/images/koroche2.jpg',
area: '85 кв.м', area: '80 кв.м',
material: 'Каркасная технология', material: 'Каркасная технология',
}, },
{ {
id: 3, id: 3,
title: ом из керамических блоков', title: еревянный каркасный дом',
description: 'Энергоэффективный дом с современными инженерными системами', description: 'г. Цивильск, 80 м2',
image: '/images/3q.jpeg', image: '/images/koroche3.jpg',
area: '160 кв.м', area: '80 кв.м',
material: 'Керамические блоки', material: 'Каркасная технология',
}, },
{ {
id: 4, id: 4,
title: ом из керамзитобетона', title: еревянный каркасный дом',
description: 'Надежный и теплый дом для большой семьи', description: 'с. Комсомольское, 78 м2',
image: '/images/4q.jpeg', image: '/images/koroche4.jpg',
area: '140 кв.м', area: '78 кв.м',
material: 'Керамзитобетон', material: 'Каркасная технология',
}, },
{ {
id: 5, id: 5,
title: 'Компактный дом', title: 'Деревянный каркасный дом',
description: 'Идеальное решение для молодой семьи с оптимальной планировкой', description: 'Сосновка, 92 м2',
image: '/images/5q.jpeg', image: '/images/koroche5.jpg',
area: '95 кв.м', area: '92 кв.м',
material: 'Газобетон', material: 'Каркасная технология',
}, },
{ {
id: 6, id: 6,
title: 'Загородный дом', title: 'Деревянный каркасный дом',
description: 'Просторный дом с панорамными окнами и современным дизайном', description: 'пос. Кугеси 110 м2',
image: '/images/6q.jpeg', image: '/images/koroche6.webp',
area: '180 кв.м', area: '110 кв.м',
material: 'Кирпич', material: 'Каркасная технология',
}, },
]; ];
@ -63,28 +63,32 @@ const additionalServices = [
icon: Droplets, icon: Droplets,
title: 'Монтаж водоснабжения', title: 'Монтаж водоснабжения',
description: 'Проектирование и установка систем водоснабжения с использованием качественных материалов', description: 'Проектирование и установка систем водоснабжения с использованием качественных материалов',
features: ['Холодное и горячее водоснабжение', 'Установка счетчиков', 'Гарантия на работы'] features: ['Холодное и горячее водоснабжение', 'Установка счетчиков', 'Гарантия на работы'],
image: '/images/voda.jpeg'
}, },
{ {
id: 2, id: 2,
icon: Wrench, icon: Wrench,
title: 'Монтаж канализации', title: 'Монтаж канализации',
description: 'Полный комплекс работ по устройству канализационных систем', description: 'Полный комплекс работ по устройству канализационных систем',
features: ['Внутренняя канализация', 'Наружные сети', 'Септики и очистные сооружения'] features: ['Внутренняя канализация', 'Наружные сети', 'Септики и очистные сооружения'],
image: '/images/kanal.jpg'
}, },
{ {
id: 3, id: 3,
icon: Zap, icon: Zap,
title: 'Монтаж электрики', title: 'Монтаж электрики',
description: 'Электромонтажные работы любой сложности с соблюдением всех норм безопасности', description: 'Электромонтажные работы любой сложности с соблюдением всех норм безопасности',
features: ['Внутренняя проводка', 'Электрощиты', 'Освещение и розетки'] features: ['Внутренняя проводка', 'Электрощиты', 'Освещение и розетки'],
image: '/images/electro.jpg'
}, },
{ {
id: 4, id: 4,
icon: Thermometer, icon: Thermometer,
title: 'Монтаж отопления', title: 'Монтаж отопления',
description: 'Установка современных систем отопления для комфортного проживания', description: 'Установка современных систем отопления для комфортного проживания',
features: ['Радиаторное отопление', 'Теплые полы', 'Котельное оборудование'] features: ['Радиаторное отопление', 'Теплые полы', 'Котельное оборудование'],
image: '/images/otop.jpg'
}, },
]; ];
@ -187,33 +191,50 @@ const WorkExamplesSection = () => {
<FadeInSection <FadeInSection
key={service.id} key={service.id}
as="div" as="div"
className="group relative p-6 rounded-2xl bg-white/80 backdrop-blur-md border border-gray-200 hover:border-blue-300 hover:shadow-xl transition-all duration-500 hover:scale-105 hover:-translate-y-2" className="group relative rounded-2xl bg-white/80 backdrop-blur-md border border-gray-200 hover:border-blue-300 hover:shadow-xl transition-all duration-500 hover:scale-105 hover:-translate-y-2 overflow-hidden"
delay={0.9 + (index * 0.1)} delay={0.9 + (index * 0.1)}
> >
{/* Фон */} {/* Фон */}
<div className="absolute inset-0 rounded-2xl bg-gradient-to-br from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div> <div className="absolute inset-0 rounded-2xl bg-gradient-to-br from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div className="relative z-10 text-center"> <div className="relative z-10">
<div className="inline-flex items-center justify-center w-16 h-16 rounded-full bg-gradient-to-br from-blue-500/20 to-purple-500/20 border border-blue-200 mb-4 group-hover:scale-110 transition-transform duration-300"> {/* Изображение */}
<service.icon className="w-8 h-8 text-blue-600 group-hover:text-blue-700" /> <div className="relative h-40 w-full overflow-hidden rounded-t-2xl">
<Image
src={service.image}
alt={service.title}
fill
className="object-cover group-hover:scale-110 transition-transform duration-500"
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 25vw"
/>
{/* Градиент поверх изображения */}
<div className="absolute inset-0 bg-gradient-to-t from-gray-900/60 via-transparent to-transparent"></div>
{/* Иконка поверх изображения */}
<div className="absolute top-4 left-4 w-12 h-12 rounded-full bg-white/20 backdrop-blur-sm border border-white/30 flex items-center justify-center group-hover:scale-110 transition-transform duration-300">
<service.icon className="w-6 h-6 text-white" />
</div>
</div> </div>
<h4 className="text-lg font-bold text-gray-800 mb-3 group-hover:text-blue-600 transition-colors duration-300"> {/* Контент */}
{service.title} <div className="p-6 text-center">
</h4> <h4 className="text-xl font-bold text-gray-800 mb-4 group-hover:text-blue-600 transition-colors duration-300">
{service.title}
</h4>
<p className="text-gray-600 text-sm mb-4 leading-relaxed"> <p className="text-gray-600 text-base mb-6 leading-relaxed">
{service.description} {service.description}
</p> </p>
<ul className="space-y-2"> <ul className="space-y-3">
{service.features.map((feature, featureIndex) => ( {service.features.map((feature, featureIndex) => (
<li key={featureIndex} className="flex items-center text-xs text-gray-500"> <li key={featureIndex} className="flex items-center text-sm text-gray-500">
<div className="w-1.5 h-1.5 bg-green-400 rounded-full mr-2"></div> <div className="w-2 h-2 bg-green-400 rounded-full mr-3"></div>
{feature} {feature}
</li> </li>
))} ))}
</ul> </ul>
</div>
</div> </div>
{/* Декоративный элемент */} {/* Декоративный элемент */}
@ -229,7 +250,7 @@ const WorkExamplesSection = () => {
onClick={() => setIsCallbackModalOpen(true)} onClick={() => setIsCallbackModalOpen(true)}
className="inline-flex items-center space-x-2 px-6 py-3 rounded-full bg-gradient-to-r from-blue-500/20 to-purple-500/20 border border-blue-300 backdrop-blur-sm hover:scale-105 transition-transform duration-300 cursor-pointer hover:from-blue-500/30 hover:to-purple-500/30" className="inline-flex items-center space-x-2 px-6 py-3 rounded-full bg-gradient-to-r from-blue-500/20 to-purple-500/20 border border-blue-300 backdrop-blur-sm hover:scale-105 transition-transform duration-300 cursor-pointer hover:from-blue-500/30 hover:to-purple-500/30"
> >
<span className="text-gray-800 font-medium">Хотите увидеть свой дом в этой галерее?</span> <span className="text-gray-800 font-medium">Помощь в подборе земельного участка, юридическое сопровождение</span>
<div className="w-2 h-2 bg-green-400 rounded-full animate-pulse"></div> <div className="w-2 h-2 bg-green-400 rounded-full animate-pulse"></div>
</button> </button>
</FadeInSection> </FadeInSection>