Новое измнений в код

This commit is contained in:
Web-serfer 2026-03-31 17:31:46 +05:00
parent f4efa8f66e
commit 5a06dfdb22
2 changed files with 172 additions and 167 deletions

View file

@ -14,7 +14,7 @@ const yearDeclension = getYearDeclension(yearsOfPractice);
---
<section
class="group relative w-full min-h-screen flex items-center overflow-hidden bg-[var(--color-navy)]"
class="group relative w-full min-h-[50vh] md:min-h-screen flex items-center overflow-hidden bg-[var(--color-navy)]"
>
<!-- 1. ФОНОВОЕ ИЗОБРАЖЕНИЕ с эффектом проявления -->
<div class="absolute inset-0 z-0">

View file

@ -5,12 +5,12 @@ import { CONTACT_CONSTANTS } from "@constants/constants.ts";
const { pathname } = Astro.url;
// Проверка авторизации будет на клиенте
const navLinks = [
{ name: "Главная", href: "/" },
{ name: "Главная", href: "/", active: pathname === "/" },
{
name: "Услуги",
href: "/services",
active: pathname.startsWith("/services"),
children: [
{
name: "Административные дела",
@ -37,10 +37,10 @@ const navLinks = [
{ name: "Дела СВО", href: "/services/svo", icon: "🛡️" },
],
},
{ name: "Кейсы", href: "/cases" },
{ name: "Блог", href: "/blog" },
{ name: "О Бюро", href: "/about" },
{ name: "Контакты", href: "/contacts" },
{ name: "Кейсы", href: "/cases", active: pathname === "/cases" },
{ name: "Блог", href: "/blog", active: pathname === "/blog" },
{ name: "О Бюро", href: "/about", active: pathname === "/about" },
{ name: "Контакты", href: "/contacts", active: pathname === "/contacts" },
];
const rawLinks = navLinks.filter((link) => {
@ -187,9 +187,26 @@ const rawLinks = navLinks.filter((link) => {
}
</nav>
<div class="flex items-center gap-6">
<!-- Блок авторизации - показывается/скрывается через JS -->
<div id="auth-block" class="hidden xl:flex items-center gap-3">
<div class="flex items-center gap-4 lg:gap-6">
<!-- Иконка телефона для мобильных (видна только на мобильных < md) -->
<a
href={`tel:${CONTACT_CONSTANTS.phone.replace(/[()\s-]/g, '')}`}
class="md:hidden w-10 h-10 rounded-full bg-[#bf9b58]/20 border border-[#bf9b58]/50 flex items-center justify-center hover:bg-[#bf9b58]/30 transition-colors group"
title="Позвонить"
aria-label="Позвонить"
>
<svg
class="w-5 h-5 text-[#bf9b58] group-hover:text-white transition-colors"
fill="currentColor"
viewBox="0 0 24 24"
>
<path d="M6.62 10.79a15.91 15.91 0 006.59 6.59l2.2-2.2a1 1 0 011.11-.27 11.72 11.72 0 003.64.59 1 1 0 011 1V20a1 1 0 01-1 1A17 17 0 013 7a1 1 0 011-1h3.5a1 1 0 011 1 11.72 11.72 0 00.59 3.64 1 1 0 01-.27 1.11z"/>
</svg>
</a>
<!-- Блок авторизации - скрыт на мобильных (< md), показывается на md и выше -->
<!-- ВАЖНО: hidden по умолчанию, скрипт управляет видимостью внутренних блоков, но не трогает hidden у контейнера -->
<div id="auth-block" class="hidden md:flex items-center gap-3">
<!-- Кнопки для авторизованного пользователя -->
<div id="auth-user-block" class="hidden items-center gap-3">
<a
@ -221,7 +238,7 @@ const rawLinks = navLinks.filter((link) => {
</div>
<!-- Блок для неавторизованного -->
<div id="auth-guest-block" class="flex flex-col items-end">
<div id="auth-guest-block" class="hidden flex-col items-end">
<button
data-consultation-modal
class="flex items-center gap-2 text-white font-bold text-lg hover:text-[#bf9b58] transition-colors cursor-pointer"
@ -253,7 +270,7 @@ const rawLinks = navLinks.filter((link) => {
</div>
</div>
<!-- ИЗМЕНЕНИЕ: Кнопка-бургер. Увеличена область (w-12 h-12), добавлен rounded-full -->
<!-- Кнопка-бургер -->
<button
id="menu-toggle"
class="lg:hidden relative w-12 h-12 rounded-full border border-transparent flex items-center justify-center z-[1000] cursor-pointer transition-all duration-300"
@ -283,7 +300,6 @@ const rawLinks = navLinks.filter((link) => {
<MobileMenu links={rawLinks} />
<style>
/* Шапка становится прозрачной, чтобы просвечивал темный оверлей из меню */
:global(body.menu-open) #main-header {
background-color: transparent !important;
backdrop-filter: none !important;
@ -291,16 +307,15 @@ const rawLinks = navLinks.filter((link) => {
border-color: transparent !important;
}
/* ИЗМЕНЕНИЕ: Стили для активной кнопки (круглая подложка) */
#menu-toggle[aria-expanded="true"] {
background-color: #151b26; /* Темный фон под крестиком */
border-color: rgba(255, 255, 255, 0.1); /* Легкая граница */
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); /* Тень для объема */
background-color: #151b26;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}
.burger-line {
position: absolute;
width: 26px; /* Немного уменьшили ширину линий, чтобы они лучше вписывались в круг */
width: 26px;
height: 2px;
background-color: white;
border-radius: 2px;
@ -318,11 +333,10 @@ const rawLinks = navLinks.filter((link) => {
transform: translateY(8px);
}
/* Крестик */
#menu-toggle[aria-expanded="true"] .line-1 {
transform: translateY(0) rotate(45deg);
background-color: #bf9b58; /* Делаем крестик золотым */
width: 22px; /* Аккуратный крестик */
background-color: #bf9b58;
width: 22px;
}
#menu-toggle[aria-expanded="true"] .line-2 {
@ -357,14 +371,12 @@ const rawLinks = navLinks.filter((link) => {
updateScrollProgress();
}
// Проверка авторизации
const checkAuth = async () => {
const authBlock = document.getElementById("auth-block");
const authUserBlock = document.getElementById("auth-user-block");
const authGuestBlock = document.getElementById("auth-guest-block");
const userInitialEl = document.getElementById("user-initial");
if (!authBlock || !authUserBlock || !authGuestBlock) return;
if (!authUserBlock || !authGuestBlock) return;
try {
const response = await fetch('/api/auth/me', {
@ -375,19 +387,16 @@ const rawLinks = navLinks.filter((link) => {
const data = await response.json();
if (data.authenticated) {
authBlock.classList.remove("hidden");
authUserBlock.classList.remove("hidden");
authUserBlock.classList.add("flex");
authGuestBlock.classList.add("hidden");
authGuestBlock.classList.remove("flex");
// Отображаем первую букву имени пользователя
if (userInitialEl && data.user?.name) {
const firstLetter = data.user.name.trim().charAt(0).toUpperCase();
userInitialEl.textContent = firstLetter;
}
} else {
authBlock.classList.remove("hidden");
authUserBlock.classList.add("hidden");
authUserBlock.classList.remove("flex");
authGuestBlock.classList.remove("hidden");
@ -395,7 +404,6 @@ const rawLinks = navLinks.filter((link) => {
}
} catch (error) {
console.error('[Header] Ошибка проверки авторизации:', error);
authBlock.classList.remove("hidden");
authUserBlock.classList.add("hidden");
authGuestBlock.classList.remove("hidden");
authGuestBlock.classList.add("flex");
@ -404,7 +412,6 @@ const rawLinks = navLinks.filter((link) => {
checkAuth();
// Кнопка выхода
const logoutBtn = document.getElementById("logout-btn");
if (logoutBtn) {
logoutBtn.classList.add("cursor-pointer");
@ -418,9 +425,7 @@ const rawLinks = navLinks.filter((link) => {
});
if (response.ok) {
// Удаляем куку на клиенте
document.cookie = 'pb_auth=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
// Перенаправляем на главную
window.location.href = '/';
}
} catch (error) {