Новые правки в Header
This commit is contained in:
parent
95333dbb8c
commit
a2985e736c
1 changed files with 39 additions and 28 deletions
|
|
@ -47,6 +47,7 @@ import { COMPANY } from "@constants";
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="mobile-actions">
|
||||||
<a href={`tel:${COMPANY.phoneClean}`} class="mobile-phone-btn" aria-label="Позонить: {COMPANY.phone}">
|
<a href={`tel:${COMPANY.phoneClean}`} class="mobile-phone-btn" aria-label="Позонить: {COMPANY.phone}">
|
||||||
<svg
|
<svg
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
|
@ -72,6 +73,7 @@ import { COMPANY } from "@constants";
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 2. Линия прогресса (теперь под контейнером, с высоким z-index) -->
|
<!-- 2. Линия прогресса (теперь под контейнером, с высоким z-index) -->
|
||||||
<div class="header-progress-container animate-load" data-delay="300">
|
<div class="header-progress-container animate-load" data-delay="300">
|
||||||
|
|
@ -252,6 +254,12 @@ import { COMPANY } from "@constants";
|
||||||
transform: scale(0.95);
|
transform: scale(0.95);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mobile-actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
/* Скрытие гамбургера при открытом меню */
|
/* Скрытие гамбургера при открытом меню */
|
||||||
.burger-btn.active {
|
.burger-btn.active {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
|
@ -259,6 +267,11 @@ import { COMPANY } from "@constants";
|
||||||
}
|
}
|
||||||
|
|
||||||
/* --- АНИМАЦИИ ПРИ ЗАГРУЗКЕ --- */
|
/* --- АНИМАЦИИ ПРИ ЗАГРУЗКЕ --- */
|
||||||
|
@media (min-width: 993px) {
|
||||||
|
.mobile-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
.animate-load {
|
.animate-load {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY(-20px);
|
transform: translateY(-20px);
|
||||||
|
|
@ -306,7 +319,7 @@ import { COMPANY } from "@constants";
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.header-right {
|
.header-right {
|
||||||
gap: 1.25rem;
|
gap: 0.5rem;
|
||||||
}
|
}
|
||||||
.header-phone {
|
.header-phone {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
@ -323,6 +336,9 @@ import { COMPANY } from "@constants";
|
||||||
.header-phone {
|
.header-phone {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
.mobile-phone-btn {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
|
|
@ -337,7 +353,6 @@ import { COMPANY } from "@constants";
|
||||||
// Проверка авторизации и отображение правильного меню
|
// Проверка авторизации и отображение правильного меню
|
||||||
function initAuth() {
|
function initAuth() {
|
||||||
const authSection = document.getElementById('auth-section');
|
const authSection = document.getElementById('auth-section');
|
||||||
const phoneEl = document.getElementById('header-phone');
|
|
||||||
if (!authSection) return;
|
if (!authSection) return;
|
||||||
|
|
||||||
const token = localStorage.getItem('auth_token');
|
const token = localStorage.getItem('auth_token');
|
||||||
|
|
@ -349,7 +364,6 @@ import { COMPANY } from "@constants";
|
||||||
const firstLetter = (user.name || user.email || 'U').charAt(0).toUpperCase();
|
const firstLetter = (user.name || user.email || 'U').charAt(0).toUpperCase();
|
||||||
|
|
||||||
// Скрываем телефон, показываем аватар и кнопку выхода
|
// Скрываем телефон, показываем аватар и кнопку выхода
|
||||||
if (phoneEl) phoneEl.style.display = 'none';
|
|
||||||
const displayName = user.name || user.email || 'Пользователь';
|
const displayName = user.name || user.email || 'Пользователь';
|
||||||
|
|
||||||
authSection.innerHTML = `
|
authSection.innerHTML = `
|
||||||
|
|
@ -384,9 +398,6 @@ import { COMPANY } from "@constants";
|
||||||
|
|
||||||
function showPhone() {
|
function showPhone() {
|
||||||
const authSection = document.getElementById('auth-section');
|
const authSection = document.getElementById('auth-section');
|
||||||
const phoneEl = document.getElementById('header-phone');
|
|
||||||
|
|
||||||
if (phoneEl) phoneEl.style.display = 'flex';
|
|
||||||
if (authSection) authSection.innerHTML = '';
|
if (authSection) authSection.innerHTML = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue