SHA256
qandClaude Opus 5.5
2e62616b46
Палитра «Сияние» по умолчанию, новые роли цветов. Лента канала: плоские записи, ряд действий с равным шагом иконок, дата у записи. Обсуждение со строкой ввода, личный чат, шторки. Вход и регистрация: стартовый экран (надпись «СИЯНИЕ», сияние мандалы), настройки входа со статусами серверов, статус логина в одну строку, вход с другого устройства (код, таймер, шаги), сохранение ключей с переключателями. Корневые разделы – заголовок по центру; фильтр чатов – переключатель; уведомления – список как в чатах; фото – просмотр на весь экран. Общее: один зазор под шапкой (--page-top-gap), переключатели высотой с поле ввода, второстепенные кнопки по одной роли (в том числе на экранах устройств и серверов), иконки только из ui-icon.js, полоса прокрутки скрыта, среднее тире в текстах интерфейса. Что нужно от сервера и разработчика – docs/UI-Design/UI-v4-for-dev.md. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
48 lines
1.6 KiB
JavaScript
48 lines
1.6 KiB
JavaScript
import { navigate } from '../router.js';
|
|
|
|
function escapeHtml(text) {
|
|
return String(text || '')
|
|
.replaceAll('&', '&')
|
|
.replaceAll('<', '<')
|
|
.replaceAll('>', '>')
|
|
.replaceAll('"', '"')
|
|
.replaceAll("'", ''');
|
|
}
|
|
|
|
export function openAuthRequiredModal({
|
|
title = 'Нужен вход',
|
|
text = 'Эта часть доступна после входа.',
|
|
} = {}) {
|
|
const root = document.getElementById('modal-root');
|
|
if (!(root instanceof HTMLElement)) {
|
|
window.alert(`${title}\n\n${text}`);
|
|
return;
|
|
}
|
|
root.innerHTML = `
|
|
<div class="modal" id="auth-required-modal">
|
|
<div class="modal-card stack">
|
|
<h3 class="modal-title">${escapeHtml(title)}</h3>
|
|
<p class="meta-muted" style="white-space: pre-wrap; line-height: 1.45;">${escapeHtml(text)}</p>
|
|
<div class="form-actions-grid">
|
|
<button class="secondary-btn" type="button" id="auth-required-login">Войти</button>
|
|
<button class="primary-btn" type="button" id="auth-required-register">Зарегистрироваться</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const close = () => { root.innerHTML = ''; };
|
|
root.querySelector('#auth-required-login')?.addEventListener('click', () => {
|
|
close();
|
|
navigate('login-view');
|
|
});
|
|
root.querySelector('#auth-required-register')?.addEventListener('click', () => {
|
|
close();
|
|
navigate('register-view');
|
|
});
|
|
root.querySelector('#auth-required-modal')?.addEventListener('click', (event) => {
|
|
if (event.target?.id === 'auth-required-modal') close();
|
|
});
|
|
}
|
|
|