Новые изменения

This commit is contained in:
Web-serfer 2026-04-08 21:11:36 +05:00
parent 32bcc76021
commit c39b0c0821
9 changed files with 512 additions and 362 deletions

View file

@ -5,6 +5,8 @@ import PageHero from '@components/base/PageHero.astro';
import BlogCategories from '@components/blog/BlogCategories.astro';
import BlogCard from '@components/blog/BlogCard.astro';
import BlogPagination from '@components/blog/BlogPagination.astro';
import Pagination from '@components/base/Pagination.astro';
import CTA from '@components/base/CTA.astro';
import SearchModal from '@components/base/SearchModal.astro';
import { blogPosts, categories } from '@data/blogData';
@ -64,24 +66,21 @@ const paginatedPosts = blogPosts.slice(startIndex, endIndex);
</div>
<!-- Пагинация -->
<BlogPagination currentPage={currentPage} totalPages={totalPages} />
<Pagination
currentPage={currentPage}
totalPages={totalPages}
baseUrl="/blog"
/>
</div>
</section>
<!-- CTA-блок -->
<section class="blog-cta">
<div class="site-container">
<div class="cta-content">
<h2 class="cta-title">Нужна консультация юриста?</h2>
<p class="cta-text">
Не нашли ответ на свой вопрос? Запишитесь на бесплатную консультацию — мы поможем разобраться в вашей ситуации
</p>
<button class="cta-button" id="consultation-btn" data-modal-target="consultation-modal">
Записаться на консультацию
</button>
</div>
</div>
</section>
<CTA
icon="consult"
title="Нужна консультация юриста?"
description="Не нашли ответ на свой вопрос? Запишитесь на бесплатную консультацию — мы поможем разобраться в вашей ситуации"
btnText="Записаться на консультацию"
/>
<SearchModal />
</Layout>
@ -102,66 +101,6 @@ const paginatedPosts = blogPosts.slice(startIndex, endIndex);
transition: opacity 0.3s ease, transform 0.3s ease;
}
/* ===== CTA ===== */
.blog-cta {
padding: 5rem 0;
background: linear-gradient(135deg, #0a2540 0%, #1e3a5f 100%);
position: relative;
overflow: hidden;
}
.blog-cta::before {
content: '';
position: absolute;
bottom: -30%;
left: -10%;
width: 500px;
height: 500px;
background: radial-gradient(circle, rgba(212, 175, 55, 0.1) 0%, transparent 70%);
border-radius: 50%;
}
.cta-content {
position: relative;
z-index: 1;
text-align: center;
max-width: 600px;
margin: 0 auto;
}
.cta-title {
font-size: clamp(1.75rem, 4vw, 2.5rem);
font-weight: 800;
color: #ffffff;
margin: 0 0 1rem;
letter-spacing: -0.02em;
}
.cta-text {
color: rgba(255, 255, 255, 0.75);
font-size: 1.1rem;
line-height: 1.6;
margin: 0 0 2rem;
}
.cta-button {
background: linear-gradient(135deg, #d4af37 0%, #eac26e 100%);
color: #1e293b;
border: none;
padding: 1rem 2.5rem;
border-radius: 0.75rem;
font-size: 1.1rem;
font-weight: 700;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}
.cta-button:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px rgba(212, 175, 55, 0.4);
}
/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
.blog-grid {

View file

@ -5,6 +5,8 @@ import PageHero from '@components/base/PageHero.astro';
import BlogCategories from '@components/blog/BlogCategories.astro';
import BlogCard from '@components/blog/BlogCard.astro';
import BlogPagination from '@components/blog/BlogPagination.astro';
import Pagination from '@components/base/Pagination.astro';
import CTA from '@components/base/CTA.astro';
import SearchModal from '@components/base/SearchModal.astro';
import { blogPosts, categories } from '@data/blogData';
@ -65,24 +67,21 @@ const paginatedPosts = blogPosts.slice(startIndex, endIndex);
</div>
<!-- Пагинация -->
<BlogPagination currentPage={currentPage} totalPages={totalPages} />
<Pagination
currentPage={currentPage}
totalPages={totalPages}
baseUrl="/blog"
/>
</div>
</section>
<!-- CTA-блок -->
<section class="blog-cta">
<div class="site-container">
<div class="cta-content">
<h2 class="cta-title">Нужна консультация юриста?</h2>
<p class="cta-text">
Не нашли ответ на свой вопрос? Запишитесь на бесплатную консультацию — мы поможем разобраться в вашей ситуации
</p>
<button class="cta-button" id="consultation-btn" data-modal-target="consultation-modal">
Записаться на консультацию
</button>
</div>
</div>
</section>
<CTA
icon="consult"
title="Нужна консультация юриста?"
description="Не нашли ответ на свой вопрос? Запишитесь на бесплатную консультацию — мы поможем разобраться в вашей ситуации"
btnText="Записаться на консультацию"
/>
<SearchModal />
</Layout>
@ -103,66 +102,6 @@ const paginatedPosts = blogPosts.slice(startIndex, endIndex);
transition: opacity 0.3s ease, transform 0.3s ease;
}
/* ===== CTA ===== */
.blog-cta {
padding: 5rem 0;
background: linear-gradient(135deg, #0a2540 0%, #1e3a5f 100%);
position: relative;
overflow: hidden;
}
.blog-cta::before {
content: '';
position: absolute;
bottom: -30%;
left: -10%;
width: 500px;
height: 500px;
background: radial-gradient(circle, rgba(212, 175, 55, 0.1) 0%, transparent 70%);
border-radius: 50%;
}
.cta-content {
position: relative;
z-index: 1;
text-align: center;
max-width: 600px;
margin: 0 auto;
}
.cta-title {
font-size: clamp(1.75rem, 4vw, 2.5rem);
font-weight: 800;
color: #ffffff;
margin: 0 0 1rem;
letter-spacing: -0.02em;
}
.cta-text {
color: rgba(255, 255, 255, 0.75);
font-size: 1.1rem;
line-height: 1.6;
margin: 0 0 2rem;
}
.cta-button {
background: linear-gradient(135deg, #d4af37 0%, #eac26e 100%);
color: #1e293b;
border: none;
padding: 1rem 2.5rem;
border-radius: 0.75rem;
font-size: 1.1rem;
font-weight: 700;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}
.cta-button:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px rgba(212, 175, 55, 0.4);
}
/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
.blog-grid {

View file

@ -2,6 +2,7 @@
import Layout from '@layouts/Layout.astro';
import { SITE_URL, COMPANY } from '@constants';
import PageHero from '@components/base/PageHero.astro';
import CTA from '@components/base/CTA.astro';
// Логика авторизации (пока статичная переменная)
const isAuthorized = false; // Измените на true, чтобы увидеть форму
@ -174,21 +175,12 @@ const isAuthorized = false; // Измените на true, чтобы увиде
</section>
<!-- CTA-блок -->
<section class="contacts-cta">
<div class="site-container">
<div class="cta-content">
<h2 class="cta-title animate-on-scroll" data-animation="fade-up">
Нужна срочная помощь?
</h2>
<p class="cta-text animate-on-scroll" data-animation="fade-up" data-delay="100">
Запишитесь на бесплатную консультацию прямо сейчас — мы перезвоним в течение 15 минут
</p>
<button class="cta-button animate-on-scroll" data-animation="fade-up" data-delay="200" id="consultation-btn" data-modal-target="consultation-modal">
Записаться на консультацию
</button>
</div>
</div>
</section>
<CTA
icon="phone"
title="Нужна срочная помощь?"
description="Запишитесь на бесплатную консультацию прямо сейчас — мы перезвоним в течение 15 минут"
btnText="Записаться на консультацию"
/>
</Layout>
<style>
@ -357,14 +349,6 @@ const isAuthorized = false; // Измените на true, чтобы увиде
.form-privacy { font-size: 0.8rem; color: #94a3b8; text-align: center; }
.privacy-link { color: #d4af37; text-decoration: underline; }
/* ===== CTA & MAP ===== */
.contacts-cta { padding: 5rem 0; background: linear-gradient(135deg, #0a2540 0%, #1e3a5f 100%); position: relative; overflow: hidden; }
.cta-content { position: relative; z-index: 1; text-align: center; max-width: 600px; margin: 0 auto; }
.cta-title { font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 800; color: #ffffff; margin: 0 0 1rem; }
.cta-text { color: rgba(255, 255, 255, 0.75); font-size: 1.1rem; margin: 0 0 2rem; }
.cta-button { background: linear-gradient(135deg, #d4af37 0%, #eac26e 100%); color: #1e293b; border: none; padding: 1rem 2.5rem; border-radius: 0.75rem; font-size: 1.1rem; font-weight: 700; cursor: pointer; transition: all 0.3s ease; }
.cta-button:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(212, 175, 55, 0.4); }
/* ===== ANIMATIONS ===== */
.animate-on-scroll { opacity: 0; will-change: opacity, transform; }
[data-animation="fade-up"] { transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s ease; }

View file

@ -2,9 +2,19 @@
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import PageHero from '@components/base/PageHero.astro';
import CTA from '@components/base/CTA.astro';
import Pagination from '@components/base/Pagination.astro';
import ReviewCard from '@components/reviews/ReviewCard.astro';
import VotingSummary from '@components/reviews/VotingSummary.astro';
import { reviewsData, votingSummary } from '@data/reviewsData';
const REVIEWS_PER_PAGE = 6;
const currentPage = 1;
const totalPages = Math.ceil(reviewsData.length / REVIEWS_PER_PAGE);
const startIndex = 0;
const endIndex = REVIEWS_PER_PAGE;
const paginatedReviews = reviewsData.slice(startIndex, endIndex);
---
<Layout
@ -44,7 +54,7 @@ import { reviewsData, votingSummary } from '@data/reviewsData';
<!-- Сетка отзывов -->
<div class="reviews-grid">
{reviewsData.map((review) => (
{paginatedReviews.map((review) => (
<ReviewCard
name={review.name}
car={review.car}
@ -59,16 +69,23 @@ import { reviewsData, votingSummary } from '@data/reviewsData';
))}
</div>
<!-- Пагинация -->
{totalPages > 1 && (
<Pagination
currentPage={currentPage}
totalPages={totalPages}
baseUrl="/reviews"
/>
)}
<!-- CTA блок -->
<div class="cta-section animate-on-scroll" data-animation="fade-up" data-delay="300">
<h2 class="cta-title">Хотите оставить отзыв?</h2>
<p class="cta-text">
Поделитесь своим опытом работы с нами. Ваш отзыв поможет другим водителям принять правильное решение.
</p>
<a href="/contacts" class="cta-button">
Оставить отзыв
</a>
</div>
<CTA
icon="chat"
title="Хотите оставить отзыв?"
description="Поделитесь своим опытом работы с нами. Ваш отзыв поможет другим водителям принять правильное решение."
btnText="Оставить отзыв"
btnHref="/contacts"
/>
</div>
</section>
</Layout>

View file

@ -2,6 +2,8 @@
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import CTA from "@components/base/CTA.astro";
import Pagination from "@components/base/Pagination.astro";
import ServiceCategories from "@components/services/ServiceCategories.astro";
---
@ -30,4 +32,15 @@ import ServiceCategories from "@components/services/ServiceCategories.astro";
bgImage="/images/home/bg_hero.avif"
/>
<ServiceCategories />
<Pagination
currentPage={1}
totalPages={2}
baseUrl="/services"
/>
<CTA
icon="consult"
title="Нужна юридическая помощь?"
description="Не нашли нужную услугу? Позвоните — разберём вашу ситуацию бесплатно. Первая консультация в подарок."
btnText="Связаться с нами"
/>
</Layout>