Интерфейс v1.1.3: профиль и компактные настройки

2026-08-24 17:59:41 +03:00
parent 6e31889f11
commit 73f95d5e7e
11 changed files with 103 additions and 18 deletions
@@ -1,6 +1,6 @@
 # ADR-024: Айдентика «Скобы», интерфейс и язык

-Уточнён [ADR-075](075-no-zoom-app-feel.md) (масштабирование запрещено, размеры шрифтов прежние), [ADR-067](067-version-in-sidebar-foot.md) (версия и время коммита в подвале сайдбара), [ADR-076](076-ios-input-accessory-is-system.md) (строка сообщения — `textarea`) и [ADR-077](077-message-alignment-by-pointer.md) (стороны сообщений зависят от способа ввода).
+Уточнён [ADR-075](075-no-zoom-app-feel.md) (масштабирование запрещено, размеры шрифтов прежние), [ADR-067](067-version-in-sidebar-foot.md) (версия и время коммита в подвале сайдбара), [ADR-076](076-ios-input-accessory-is-system.md) (строка сообщения — `textarea`), [ADR-077](077-message-alignment-by-pointer.md) (стороны сообщений зависят от способа ввода) и [ADR-079](079-profile-glyph-and-settings-layout.md) (фиксированная пиктограмма профиля и компоновка настроек).

 ## Контекст

@@ -1,5 +1,7 @@
 # ADR-067: Версия и время коммита в подвале сайдбара

+Уточнён [ADR-079](079-profile-glyph-and-settings-layout.md): кнопка «ты: @nick» стала локальной пиктограммой профиля с `@nick`; версия осталась отдельной строкой рядом.
+
 Доводит до интерфейса [ADR-074](074-version-and-commit-time.md): сервер отдаёт `version` и `commitAt`, а где их показывать, там не решено.

 ## Контекст
@@ -0,0 +1,24 @@
+# ADR-079: Пиктограмма профиля и компоновка настроек
+
+Уточняет [ADR-024](024-identity-and-ui.md): аватаров по-прежнему нет, но переходу в настройки нужна однозначная пиктограмма. Уточняет [ADR-067](067-version-in-sidebar-foot.md): состав кнопки профиля меняется, версия остаётся рядом с ней.
+
+## Контекст
+
+В подвале сайдбара переход в настройки обозначен точкой и текстом «ты: @nick». Точка не объясняет действие, а слово «ты» занимает место у ника. Использовать эмодзи нельзя: его вид зависит от платформы. Подключать библиотеку ради одной пиктограммы противоречит устройству клиента.
+
+Экран настроек ограничен одной колонкой 460 px и на десктопе остаётся длинной узкой лентой. Формы внутри неё дополнительно ограничены 360 px, поэтому поля смены пароля и удаления аккаунта короче соседних кнопок.
+
+## Решение
+
+- Кнопка настроек в подвале состоит из локального `profile.svg` и `@nick`. Её доступное имя — «настройки: @nick».
+- Пиктограмма фиксированная, не пользовательская: это указатель на профиль, а не аватар. Круглая голова делает назначение узнаваемым, угловатые открытые плечи, viewBox 64, один штрих 7 px и цвет `ink` связывают её со «Скобами». Человека внутрь фирменного знака не помещаем.
+- Ассет хранится в клиенте и входит в офлайн-оболочку. Зависимостей и сборки не появляется.
+- До ширины 959 px настройки идут одной колонкой в прежнем порядке. От 960 px блок идентичности занимает всю ширину, ниже стоят две равные колонки с промежутком 32 px: уведомления, установка, устройства и история слева; смена пароля, выход и удаление аккаунта справа.
+- Ширина двух колонок вместе — не больше 752 px. Поля и обычные кнопки занимают полную ширину своей колонки и сохраняют общую минимальную высоту 44 px.
+- Новая компоновка относится только к `#/settings`. Карточка контакта и участники, использующие тот же базовый класс узкого содержимого, не меняются.
+
+## Следствия
+
+- В подвале остаются только пиктограмма, ник и независимая строка версии; длинный ник по-прежнему обрезается многоточием.
+- На телефоне порядок и одноколоночная компоновка настроек сохраняются. На широком десктопе путь чтения делится на повседневные настройки слева и действия с доступом к аккаунту справа.
+- Смена `app.css`, модулей и состава оболочки требует новой версии service worker.
@@ -10,6 +10,8 @@

 Wordmark — слово `bare` строчными рядом со знаком, тем же шрифтом, что интерфейс. «Bare» с заглавной — только в тексте.

+Пиктограмма профиля — не вариант знака и не аватар. Это отдельный фиксированный `profile.svg`: круглая голова и открытые угловатые плечи, тот же viewBox 64, один цвет `ink` и штрих 7. Внутрь фирменного знака человека не помещать (ADR-079).
+
 ## Цвет

 | имя   | значение                     | роль |
@@ -42,6 +44,7 @@ font-family: ui-monospace, "SF Mono", Menlo, Consolas, "DejaVu Sans Mono", monos
 ## Компоновка

 - Десктоп: сайдбар 224 px с правой границей `line`, шапка 64 px, отступы контента 32 px.
+- Настройки: одна колонка до 959 px; от 960 px идентичность во всю ширину и две равные колонки шириной до 360 px с промежутком 32 px. Поля и кнопки внутри колонок одной ширины (ADR-079).
 - Мобильный: шапка 56 px, отступы 20 px, ввод с min-height 44 px. Нижнее поле подвала и строки ввода считается с `env(safe-area-inset-bottom)`: под системную полосу iPhone они не заходят. При открытой экранной клавиатуре её прямоугольник уже защищает край, поэтому обычные `20px + safe-area` строки ввода заменяются компактными 6 px (ADR-076).
 - Сообщения — поток, автор и время над текстом; на телефоне и планшете свои — у правого края, чужие — у левого, на десктопе все — у левого; ширина блока не больше `min(640px, 85%)` (ADR-077).
 - Ввод — рамка 1 px ink, без скруглений, `>` цветом mark слева.
@@ -5,4 +5,4 @@
 - Блокировка собеседника и персональные инвайты — если общего инвайт-кода и лимитов (ADR-019, ADR-021) окажется мало.
 - Подписи сообщений вторым ключом — если потребуется защита от сговора участника комнаты с сервером (ADR-016).

-Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей. ADR-064 и ADR-069 — попытки убрать системную панель ввода iOS, ADR-065 — сторона сообщений в ленте, ADR-066 — серверный «перец», ADR-067…075 — версия в подвале, самообновление PWA, строка ввода, запрет масштабирования, код причины отказа пушей. ADR-076 фиксирует системное ограничение панели iOS и возврат к `textarea`, ADR-077 — стороны сообщений отдельно для touch и десктопа, ADR-078 — выбор между личным чатом и новой комнатой.
+Закрыто ADR-015…024: регистрация, контакты, лимиты, смена пароля, идентификация устройств, язык интерфейса, айдентика, доверие к ключам, протокол, схема базы, деплой, правила пушей. ADR-064 и ADR-069 — попытки убрать системную панель ввода iOS, ADR-065 — сторона сообщений в ленте, ADR-066 — серверный «перец», ADR-067…075 — версия в подвале, самообновление PWA, строка ввода, запрет масштабирования, код причины отказа пушей. ADR-076 фиксирует системное ограничение панели iOS и возврат к `textarea`, ADR-077 — стороны сообщений отдельно для touch и десктопа, ADR-078 — выбор между личным чатом и новой комнатой, ADR-079 — пиктограмма профиля и двухколоночные настройки.
@@ -24,9 +24,9 @@

 ## Список чатов (сайдбар)

-Секции «каналы» и «личные», как в моке. Активный чат — инверсия (ink на bone). Непрочитанные — число цветом `mark` справа. Порядок — по `lastId` по убыванию. Внизу — «ты: @nick», по нажатию — настройки. Над секциями — строка `+ новый чат`.
+Секции «каналы» и «личные», как в моке. Активный чат — инверсия (ink на bone). Непрочитанные — число цветом `mark` справа. Порядок — по `lastId` по убыванию. Внизу — локальная пиктограмма профиля и `@nick`, по нажатию — настройки. Пиктограмма фиксированная и не является аватаром (ADR-079). Над секциями — строка `+ новый чат`.

-В подвале рядом с «ты: @nick» — версия и время коммита из `GET /api/config`: `версия · дд.мм чч:мм`, время в местной зоне, цветом `stone`, размером подписи. Не кнопка, но выделяется: её копируют. Времени нет — остаётся версия; конфигурации ещё нет — строки нет. В сайдбаре 224 px рядом они не помещаются: версия занимает вторую строку и стоит справа; на мобильном, где сайдбар во всю ширину, обе стоят в одной строке. Ник, которому не хватило места, обрезается многоточием (ADR-067).
+В подвале рядом с кнопкой профиля — версия и время коммита из `GET /api/config`: `версия · дд.мм чч:мм`, время в местной зоне, цветом `stone`, размером подписи. Не кнопка, но выделяется: её копируют. Времени нет — остаётся версия; конфигурации ещё нет — строки нет. В сайдбаре 224 px рядом они не помещаются: версия занимает вторую строку и стоит справа; на мобильном, где сайдбар во всю ширину, обе стоят в одной строке. Ник, которому не хватило места, обрезается многоточием (ADR-067, ADR-079).

 Версия — серверная. Оболочка в браузере бывает старше: она приезжает из кэша, а обновление применяется отдельно и ждёт пустых полей (ADR-068).

@@ -70,6 +70,8 @@

 ## Настройки (`#/settings`)

+До 959 px разделы идут одной колонкой. От 960 px блок с собственной идентичностью занимает всю ширину, а остальные разделы делятся на две равные колонки: уведомления, установка, устройства и история слева; смена пароля, выход и удаление аккаунта справа. Поля и обычные кнопки занимают полную ширину колонки и имеют одинаковую минимальную высоту 44 px (ADR-079).
+
 - «ты: @nick», свой отпечаток.
 - «уведомления»: состояние (`включены` / `выключены` / `запрещены в браузере`), кнопка «включить» или «выключить». `запрещены в браузере` — разрешение отклонено или уведомлений в браузере нет вовсе; кнопки в этом состоянии нет (ADR-046). На iOS вне PWA — состояние `выключены` и вместо кнопки текст про установку, тот же, что в баннере.
 - «установить приложение»: кнопка «установить», если есть `beforeinstallprompt`; на iOS вне PWA — инструкция «поделиться → на экран «домой»». Устанавливать нечего — раздела нет.