redi/astro_avtourist
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Новые изменения в проекте

Browse source
This commit is contained in:
Web-serfer 2026-04-23 21:00:30 +05:00
parent 92778a126b
commit 107b7f461f
11 changed files with 546 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

66
frontend/src/components/cases/CaseSidebar.astro Normal file
View file

@ -0,0 +1,66 @@
---
import AdBanner from "@components/base/AdBanner.astro";
import { EXPERIENCE_YEARS } from '@constants';
interface Props {
category: string;
duration: string;
result: string;
}
const { category, duration, result } = Astro.props;
---
<div class="case-sidebar__card">
<h3 class="case-sidebar__title">Детали кейса</h3>
<div class="case-sidebar__info">
<div class="case-sidebar__row">
<span>Категория</span>
<strong>{category}</strong>
</div>
<div class="case-sidebar__row">
<span>Срок ведения</span>
<strong>{duration}</strong>
</div>
<div class="case-sidebar__row">
<span>Результат</span>
<strong class="success">{result}</strong>
</div>
</div>
</div>
<div class="case-sidebar__card case-sidebar__card--lawyer">
<div class="case-sidebar__lawyer-avatar">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
<circle cx="12" cy="7" r="4"/>
</svg>
</div>
<h3>Автоюрист Сургут</h3>
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
<strong>500+</strong>
<span>выигранных дел</span>
</div>
</div>
<a href="/services" class="case-sidebar__lawyer-link">
Все услуги
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M5 12h14"/>
<path d="m12 5 7 7-7 7"/>
</svg>
</a>
</div>
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="470"
className="ad-banner--vertical"
/>
</div>

10
frontend/src/components/cases/CasesList.astro
View file

@ -69,7 +69,7 @@ const categoriesList = [
<!-- Список кейсов -->
<div class="cases-list">
{paginatedCases.map((caseItem: Case, index: number) => (
<article class="case-card animate-on-scroll" data-animation="slide-up" data-delay={index * 100 + 300} data-category={caseItem.category}>
<a href={caseItem.href} class="case-card animate-on-scroll" data-animation="slide-up" data-delay={index * 100 + 300} data-category={caseItem.category}>
<div class="case-card__inner">
<!-- Верхняя часть -->
<div class="case-card__header">
@ -130,15 +130,15 @@ const categoriesList = [
</div>
<!-- Кнопка -->
<a href={caseItem.href} class="case-card__link">
<span class="case-card__link">
<span>Подробнее о деле</span>
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"/>
<path d="m12 5 7 7-7 7"/>
</svg>
</a>
</span>
</div>
</article>
</a>
))}
</div>
@ -302,7 +302,7 @@ const categoriesList = [
}
.case-card {
display: flex;
display: block;
text-decoration: none;
color: inherit;
cursor: pointer;

361
frontend/src/layouts/CaseLayout.astro Normal file
View file

@ -0,0 +1,361 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import CaseSidebar from '@components/cases/CaseSidebar.astro';
import RelatedCases from "@components/cases/RelatedCases.astro";
interface Props {
title: string;
description: string;
canonicalPath: string;
badgeText: string;
titleWhite: string;
titleGold: string;
heroDescription: string;
currentCaseId: number;
category: string;
duration: string;
result: string;
}
const {
title,
description,
canonicalPath,
badgeText,
titleWhite,
titleGold,
heroDescription,
currentCaseId,
category,
duration,
result
} = Astro.props;
const breadcrumbs = [
{ label: 'Главная', href: '/' },
{ label: 'Кейсы', href: '/cases' },
{ label: badgeText.replace('КЕЙС #', 'Кейс ') }
];
---
<Layout
title={title}
description={description}
canonicalLink={`${SITE_URL}${canonicalPath}`}
breadcrumbs={breadcrumbs}
>
<PageHero
badgeText={badgeText}
titleWhite={titleWhite}
titleGold={titleGold}
description={heroDescription}
btnText="Получить консультацию"
modalTarget="consultation-modal"
layout="with-image"
sideImage="/images/cases/casesImg.avif"
sideImageAlt="Автоюрист Сургут"
experienceBadge={{
number: "95%",
text: "УСПЕШНЫХ ДЕЛ"
}}
bgImage="/images/cases/casesBg.avif"
icon="briefcase"
/>
<div class="case-detail-page">
<section class="case-content">
<div class="site-container">
<div class="case-grid">
<article class="case-article">
<slot />
</article>
<aside class="case-sidebar">
<CaseSidebar
category={category}
duration={duration}
result={result}
/>
</aside>
</div>
</div>
</section>
</div>
<RelatedCases
title="Другие кейсы"
subtitle="ПОХОЖИЕ ДЕЛА"
currentCaseId={currentCaseId}
/>
</Layout>
<style is:global>
.case-detail-page {
font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.case-content {
padding: 5rem 0;
background: #f8fafc;
}
.case-grid {
display: grid;
grid-template-columns: 1fr 380px;
gap: 3rem;
}
.case-block {
background: #ffffff;
border-radius: 16px;
padding: 2.5rem;
margin-bottom: 2rem;
border: 1px solid #e2e8f0;
}
.case-block:last-child {
margin-bottom: 0;
}
.case-block--accent {
background: linear-gradient(135deg, #0a2540, #1e3050);
border: none;
}
.case-block--accent .case-block__title {
color: #eac26e;
}
.case-block--accent .case-block__content {
color: rgba(255, 255, 255, 0.85);
}
.case-block--accent p {
color: rgba(255, 255, 255, 0.85);
}
.case-block__title {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 1.35rem;
font-weight: 700;
color: #0a2540;
margin: 0 0 1.5rem 0;
}
.case-block__icon {
font-size: 1.5rem;
}
.case-block__content p {
color: #475569;
font-size: 1rem;
line-height: 1.7;
margin: 0 0 1rem 0;
}
.case-block__content p:last-child {
margin-bottom: 0;
}
.case-list {
list-style: none;
padding: 0;
margin: 1rem 0;
}
.case-list li {
position: relative;
padding-left: 1.5rem;
margin-bottom: 0.75rem;
color: #475569;
}
.case-list li::before {
content: '•';
position: absolute;
left: 0;
color: #eac26e;
font-weight: bold;
}
.case-steps {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.case-step {
display: flex;
gap: 1.5rem;
align-items: flex-start;
}
.case-step__number {
width: 48px;
height: 48px;
background: rgba(234, 194, 110, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.1rem;
font-weight: 900;
color: #eac26e;
flex-shrink: 0;
}
.case-step__content h3 {
color: #ffffff;
font-size: 1.1rem;
font-weight: 700;
margin: 0 0 0.5rem 0;
}
.case-step__content p {
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
line-height: 1.6;
margin: 0;
}
.case-verdict {
background: rgba(234, 194, 110, 0.08);
border: 1px solid rgba(234, 194, 110, 0.2);
border-radius: 12px;
padding: 2rem;
}
.case-verdict__badge {
display: inline-flex;
align-items: center;
gap: 0.5rem;
background: #22c55e;
color: #ffffff;
padding: 0.5rem 1rem;
border-radius: 6px;
font-size: 0.9rem;
font-weight: 700;
margin-bottom: 1.5rem;
}
.case-verdict__badge svg {
width: 18px;
height: 18px;
}
.case-verdict p {
color: #0a2540;
font-size: 1rem;
line-height: 1.7;
margin: 0 0 1rem 0;
}
.case-sidebar {
position: sticky;
top: 100px;
height: fit-content;
display: flex;
flex-direction: column;
}
@media (max-width: 1024px) {
.case-grid {
grid-template-columns: 1fr;
}
.case-sidebar {
position: static;
display: grid;
grid-template-columns: 1fr;
gap: 1rem;
}
}
@media (max-width: 768px) {
.case-detail-page {
padding: 0;
}
.case-content {
padding: 2rem 0;
}
.case-grid {
gap: 1.5rem;
}
.case-block {
padding: 1.5rem;
border-radius: 12px;
border-left: none;
border-right: none;
}
.case-block__title {
justify-content: center;
}
.case-block__content {
text-align: center;
}
.case-step {
flex-direction: column;
align-items: center;
text-align: center;
gap: 0.75rem;
}
.case-sidebar {
grid-template-columns: 1fr;
}
}
@media (max-width: 480px) {
.case-block {
padding: 1.25rem;
}
.case-block__title {
font-size: 1.15rem;
}
.case-block__content p {
font-size: 0.9rem;
}
.case-step {
flex-direction: column;
text-align: center;
gap: 0.75rem;
}
.case-step__number {
width: 40px;
height: 40px;
font-size: 0.9rem;
}
.case-step__content h3 {
font-size: 1rem;
}
.case-step__content p {
font-size: 0.85rem;
}
.case-verdict {
padding: 1.25rem;
}
.case-verdict__badge {
font-size: 0.8rem;
display: flex;
justify-content: center;
}
}
</style>

95
frontend/src/pages/cases/casco-damage-claim.astro Normal file
View file

@ -0,0 +1,95 @@
---
import CaseLayout from '@layouts/CaseLayout.astro';
---
<CaseLayout
title="Взыскание ущерба с виновника ДТП по КАСКО — автоюрист Сургут"
description="Страховая по КАСКО выплатила не полную сумму. Разницу взыскали напрямую с виновника аварии через суд."
canonicalPath="/cases/casco-damage-claim"
badgeText="КЕЙС #7"
titleWhite="Взыскание ущерба"
titleGold="с виновника ДТП по КАСКО"
heroDescription="Страховая по КАСКО выплатила не полную сумму. Благодаря грамотной стратегии удалось взыскать разницу с виновника."
currentCaseId={7}
category="Страховые споры"
duration="4 месяца"
result="Взыскано 280 000 ₽"
>
<div class="case-block" slot="situation">
<p>
Наш клиент стал участником серьёзного ДТП, в котором виновником
был признан другой водитель. Автомобиль клиента получил значительные
повреждения.
</p>
<p>
<strong>Страховая компания по КАСКО выплатила 320 000 ₽,
однако реальная стоимость ущерба составила 600 000 ₽.</strong>
</p>
<p>
Виновник ДТП отказался добровольно возмещать разницу, ссылаясь
на то, что у него есть ОСАГО и все претензии нужно предъявлять
страховым компаниям.
</p>
</div>
<div class="case-steps" slot="steps">
<div class="case-step">
<div class="case-step__number">01</div>
<div class="case-step__content">
<h3>Оценка ущерба</h3>
<p>
Провели независимую экспертизу, которая установила
реальную стоимость ущерба в 600 000 ₽.
</p>
</div>
</div>
<div class="case-step">
<div class="case-step__number">02</div>
<div class="case-step__content">
<h3>Претензия виновнику</h3>
<p>
Направили досудебную претензию виновнику ДТП с
требованием возместить разницу в 280 000 ₽.
</p>
</div>
</div>
<div class="case-step">
<div class="case-step__number">03</div>
<div class="case-step__content">
<h3>Подготовка иска</h3>
<p>
Подготовили исковое заявление в суд с приложением
экспертных заключений и документов.
</p>
</div>
</div>
<div class="case-step">
<div class="case-step__number">04</div>
<div class="case-step__content">
<h3>Судебное представительство</h3>
<p>
Представили интересы клиента в суде. Виновник пытался
оспорить сумму ущерба, но суд встал на нашу сторону.
</p>
</div>
</div>
</div>
<div class="case-verdict" slot="verdict">
<div class="case-verdict__badge">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
<path d="M20 6L9 17l-5-5"/>
</svg>
Взыскано 280 000 ₽
</div>
<p>
Суд полностью удовлетворил исковые требования. С виновника ДТП
взыскана разница между выплатой КАСКО и реальным ущербом —
<strong>280 000 ₽</strong>.
</p>
<p>
Дополнительно взысканы судебные расходы и расходы на
представительство в суде.
</p>
</div>
</CaseLayout>

6
frontend/src/pages/cases/driving-license-return-12-8.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -170,7 +170,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -190,7 +190,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

6
frontend/src/pages/cases/dti-innocence-proof.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -168,7 +168,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -188,7 +188,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

8
frontend/src/pages/cases/dtp-innocence-proof.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -90,7 +90,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-step">
<div class="case-step__number">03</div>
<div class="case-step__content">
<h3>Автот<EFBFBD><EFBFBD>хническая экспертиза</h3>
<h3>Автотехническая экспертиза</h3>
<p>
Провели независимую экспертизу, которая установила
невозможность определения виновника по представленным материалам.
@ -167,7 +167,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -187,7 +187,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

6
frontend/src/pages/cases/health-damage-claim.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -164,7 +164,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -184,7 +184,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

6
frontend/src/pages/cases/license-return-camera.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -168,7 +168,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -188,7 +188,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

6
frontend/src/pages/cases/osago-claim-450k.astro
View file

@ -1,6 +1,6 @@
---
import Layout from '@layouts/Layout.astro';
import { SITE_URL } from '@constants';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from "@components/base/PageHero.astro";
import RelatedCases from "@components/cases/RelatedCases.astro";
import AdBanner from "@components/base/AdBanner.astro";
@ -167,7 +167,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
<div class="case-sidebar__lawyer-stats">
<div class="case-sidebar__lawyer-stat">
<strong>12+</strong>
<strong>{EXPERIENCE_YEARS}</strong>
<span>лет опыта</span>
</div>
<div class="case-sidebar__lawyer-stat">
@ -187,7 +187,7 @@ import AdBanner from "@components/base/AdBanner.astro";
<div class="case-sidebar__card case-sidebar__card--ad">
<AdBanner
width="300"
height="640"
height="470"
className="ad-banner--vertical"
/>
</div>

1
frontend/src/pages/cases/page/[page].astro
View file

@ -3,7 +3,6 @@ import Layout from '@layouts/Layout.astro';
import { SITE_URL, EXPERIENCE_YEARS } from '@constants';
import PageHero from '@components/base/PageHero.astro';
import CasesList from '@components/cases/CasesList.astro';
import CTA from '@components/base/CTA.astro';
export const prerender = false;