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

This commit is contained in:
Web-serfer 2026-04-29 03:25:37 +05:00
parent 9122756a58
commit 1838fd302d
14 changed files with 88 additions and 79 deletions

View file

@ -33,22 +33,17 @@
7. **Язык общения**
- Всё общение с пользователем происходит на русском языке
8. **Проверка изменений**
- После внесения изменений в код не требуется запускать сервер разработки для проверки
- Пользователь самостоятельно запускает сервер и проверяет изменения
9. **Проверка типов данных**
8 **Проверка типов данных**
- Проверять проект на ошибки типизации через команду `bun run tsc --noEmit -p frontend/tsconfig.json`
- Не производить сборку проекта без моего разрешения
- В проекте не должно быть типов any
- Все интерфейсы компонентов прописывать в файле globalInterfaces.ts
- При работе с PocketBase использовать актуальные сигнатуры методов из файла `D:\Verstka\production\astro_minivan\frontend\node_modules\pocketbase\dist\pocketbase.es.d.ts`
10. **Плагин @astrojs/sitemap**
9 **Плагин @astrojs/sitemap**
- Обязательно к установке в проект пакета @astrojs/sitemap
- Обязательно к созданию в проекте файла .nvmrc
11. **Замена хоста при развертывании проекта**
- Обязательно нужно изменить http://localhost:3000/ в шаблонах писем на реальный
## Технические правила (Astro)

View file

@ -28,7 +28,7 @@ const delay = typeof dataDelay === 'number' ? dataDelay : parseInt(String(dataDe
data-delay={delay}
>
<div class="lock-icon-container">
<svg class="w-8 h-8 md:w-10 md:h-10 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg class="text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
</svg>
</div>
@ -64,8 +64,8 @@ const delay = typeof dataDelay === 'number' ? dataDelay : parseInt(String(dataDe
}
.lock-icon-container {
width: 4rem;
height: 4rem;
width: 3rem;
height: 3rem;
background: linear-gradient(135deg, rgba(37, 99, 235, 0.2) 0%, rgba(30, 64, 175, 0.3) 100%);
border-radius: 50%;
display: flex;
@ -78,8 +78,20 @@ const delay = typeof dataDelay === 'number' ? dataDelay : parseInt(String(dataDe
@media (min-width: 768px) {
.lock-icon-container {
width: 5rem;
height: 5rem;
width: 4rem;
height: 4rem;
}
}
.lock-icon-container svg {
width: 1.5rem;
height: 1.5rem;
}
@media (min-width: 768px) {
.lock-icon-container svg {
width: 2rem;
height: 2rem;
}
}

View file

@ -207,5 +207,4 @@ const iconPaths: Record<string, string> = {
};
setupAnimations();
document.addEventListener('astro:page-load', setupAnimations);
</script>

View file

@ -145,7 +145,6 @@ const { categories, activeCategory = 'Все', currentPage = 1 } = Astro.props;
<script>
// Клиентская логика фильтрации
document.addEventListener('DOMContentLoaded', initFilter);
document.addEventListener('astro:page-load', initFilter);
function initFilter() {
const links = document.querySelectorAll('.category-btn');

View file

@ -281,9 +281,4 @@ const colors = ['bg-gradient-1', 'bg-gradient-2', 'bg-gradient-3', 'bg-gradient-
setupSlider();
setupAnimations();
document.addEventListener('astro:page-load', () => {
setupSlider();
setupAnimations();
});
</script>

View file

@ -105,8 +105,8 @@ export default function ReviewFormContainer() {
<Show when={isAuthenticated()} fallback={
<div class="mx-auto w-full max-w-[700px]">
<div class="bg-gradient-to-br from-slate-50 to-slate-100 rounded-2xl border border-slate-200 p-6 md:p-12 text-center">
<div class="w-16 md:w-20 mx-auto mb-4 md:mb-6 rounded-full flex items-center justify-center bg-gradient-to-br from-blue-500/20 to-blue-900/30">
<svg class="w-8 md:w-10 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="w-10 h-10 md:w-16 md:h-16 mx-auto mb-4 md:mb-6 rounded-full flex items-center justify-center" style="background: linear-gradient(135deg, rgba(37, 99, 235, 0.2) 0%, rgba(30, 64, 175, 0.3) 100%);">
<svg class="w-5 md:w-8 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
</svg>
</div>

View file

@ -1,7 +1,6 @@
---
import "@styles/global.css";
import { SITE_TITLE_SUFFIX } from "@constants";
import { ClientRouter } from 'astro:transitions';
import Header from "@components/layout/header/Header.astro";
import Footer from "@components/layout/footer/Footer.astro";
@ -35,7 +34,6 @@ const { title, description, canonicalLink, breadcrumbs } = Astro.props;
<link rel="sitemap" href="/sitemap-index.xml" />
<!-- Yandex верификация -->
<meta name="yandex-verification" content="be3edfd138348e43" />
<ClientRouter />
</head>
<body>
<Toast />
@ -66,26 +64,6 @@ const { title, description, canonicalLink, breadcrumbs } = Astro.props;
</style>
<script>
// Сохраняем позицию скролла перед переходом
document.addEventListener('astro:before-preparation', (e) => {
sessionStorage.setItem('scrollPosition', String(window.scrollY));
});
// Восстанавливаем позицию скролла после перехода с плавной анимацией
document.addEventListener('astro:after-swap', () => {
const savedPosition = sessionStorage.getItem('scrollPosition');
if (savedPosition) {
const targetScroll = parseInt(savedPosition);
setTimeout(() => {
window.scrollTo({
top: targetScroll,
behavior: 'auto'
});
}, 50);
sessionStorage.removeItem('scrollPosition');
}
});
// Клиентский скрипт для открытия модального окна
document.addEventListener("DOMContentLoaded", () => {
const btn = document.getElementById("consultation-btn");
@ -98,17 +76,4 @@ const { title, description, canonicalLink, breadcrumbs } = Astro.props;
);
});
});
// Для Astro View Transitions
document.addEventListener("astro:page-load", () => {
const btn = document.getElementById("consultation-btn");
btn?.addEventListener("click", () => {
window.dispatchEvent(
new CustomEvent("open-modal", {
detail: "consultation-modal",
}),
);
});
});
</script>

View file

@ -167,5 +167,37 @@ const formatDate = (date: string) => {
};
setupAnimations();
document.addEventListener('astro:page-load', setupAnimations);
setupFilter();
function setupFilter() {
const buttons = document.querySelectorAll('.category-btn');
const cards = document.querySelectorAll('.blog-card-wrapper');
buttons.forEach((btn) => {
btn.addEventListener('click', (e) => {
e.preventDefault();
const category = btn.getAttribute('data-category');
buttons.forEach(b => b.classList.remove('active'));
btn.classList.add('active');
cards.forEach((card) => {
const cardCategory = card.getAttribute('data-category');
const el = card as HTMLElement;
if (category === 'Все' || cardCategory === category) {
el.style.display = '';
el.style.opacity = '0';
el.style.transform = 'translateY(20px)';
requestAnimationFrame(() => {
el.style.transition = 'opacity 0.4s ease, transform 0.4s ease';
el.style.opacity = '1';
el.style.transform = 'translateY(0)';
});
} else {
el.style.display = 'none';
}
});
});
});
}
</script>

View file

@ -168,5 +168,4 @@ const formatDate = (date: string) => {
};
setupAnimations();
document.addEventListener('astro:page-load', setupAnimations);
</script>

View file

@ -183,8 +183,4 @@ const formatDate = (date: string) => {
setupAnimations();
setupFilter();
document.addEventListener('astro:page-load', () => {
setupAnimations();
setupFilter();
});
</script>

View file

@ -148,6 +148,38 @@ const formatDate = (date: string) => {
});
};
const setupFilter = () => {
const buttons = document.querySelectorAll('.category-btn');
const cards = document.querySelectorAll('.blog-card-wrapper');
buttons.forEach((btn) => {
btn.addEventListener('click', (e) => {
e.preventDefault();
const category = btn.getAttribute('data-category');
buttons.forEach(b => b.classList.remove('active'));
btn.classList.add('active');
cards.forEach((card) => {
const cardCategory = card.getAttribute('data-category');
const el = card as HTMLElement;
if (category === 'Все' || cardCategory === category) {
el.style.display = '';
el.style.opacity = '0';
el.style.transform = 'translateY(20px)';
requestAnimationFrame(() => {
el.style.transition = 'opacity 0.4s ease, transform 0.4s ease';
el.style.opacity = '1';
el.style.transform = 'translateY(0)';
});
} else {
el.style.display = 'none';
}
});
});
});
};
setupAnimations();
document.addEventListener('astro:page-load', setupAnimations);
setupFilter();
</script>

View file

@ -344,10 +344,4 @@ const isAuthorized = false; // Измените на true, чтобы увиде
// Инициализация
setupAnimations();
setupForm();
// Для поддержки Astro transitions
document.addEventListener('astro:page-load', () => {
setupAnimations();
setupForm();
});
</script>

View file

@ -181,8 +181,4 @@ const categories = getCategories();
};
setupFilter();
document.addEventListener('astro:page-load', () => {
setupFilter();
});
</script>

View file

@ -195,9 +195,4 @@ import ReviewsList from '@components/reviews/ReviewsList.astro';
// Запуск
setupAnimations();
// Для поддержки View Transitions в Astro
document.addEventListener('astro:page-load', () => {
setupAnimations();
});
</script>