SHA256
- styles/main.css: роли цветов (по умолчанию «Индиго»), шкала отступов/скруглений/шрифтов, цвета отношений для обеих тем; жёсткие цвета в стилях заменены на роли. - Палитра: пресеты и личные правки, «Оформление» Авто/День/Ночь, долгое нажатие — редактор цветов с экспортом/импортом. - Каналы: пузыри постов автора, плашки дней, строка «Написать в канал…», «О канале», создание канала с адресом из названия; лента открывается на свежих постах. - Чаты: плоский список, чипы-фильтры, пузыри, плашки дней; нижняя панель скрыта в переписке. - Корневые разделы — единая шапка; профиль и чужой профиль — общая карточка; настройки, кошелёк, сеансы — меню-списки. - Нижняя панель: иконки без подписей, бейджи на иконках. - confirmDialog вместо window.confirm/alert; на телефоне диалоги — шторки снизу. - docs/UI-Design/ISSUES-for-dev.md — найденные ошибки сервера/UI. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
37 lines
2.1 KiB
CSS
37 lines
2.1 KiB
CSS
/* Меню-список: группа строк «название / подсказка / ›» — для переходов по разделам
|
||
* (кошелёк, настройки разработчика и т. п.). Для действий без перехода — обычные кнопки. */
|
||
.nav-list { display: grid; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); background: var(--surface); overflow: hidden; }
|
||
.nav-list__title { margin: var(--space-2) 0 var(--space-1); color: var(--text-secondary); font-size: var(--text-xs); line-height: var(--leading-xs); font-weight: var(--weight-bold); }
|
||
.nav-row {
|
||
width: 100%;
|
||
min-height: 56px;
|
||
padding: 10px 40px 10px 14px;
|
||
position: relative;
|
||
display: grid;
|
||
align-content: center;
|
||
gap: 2px;
|
||
border: 0;
|
||
border-top: 1px solid var(--border-subtle);
|
||
border-radius: 0;
|
||
color: var(--text-primary);
|
||
background: transparent;
|
||
font: inherit;
|
||
text-align: left;
|
||
cursor: pointer;
|
||
}
|
||
.nav-row:first-child { border-top: 0; }
|
||
.nav-row::after { content: '›'; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--text-secondary); font-size: 22px; line-height: 1; }
|
||
.nav-row:hover { background: var(--surface-selected); }
|
||
.nav-row:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
|
||
.nav-row__label { font-size: var(--text-md); line-height: var(--leading-md); font-weight: var(--weight-medium); }
|
||
.nav-row__hint { color: var(--text-secondary); font-size: var(--text-xs); line-height: var(--leading-xs); }
|
||
.nav-row--danger .nav-row__label { color: var(--danger); }
|
||
.nav-row--danger::after { content: none; }
|
||
.nav-row__label.is-empty { color: var(--text-secondary); font-weight: 400; }
|
||
|
||
.nav-list > .nav-row.profile-param-item { margin: 0; border-radius: 0; background: transparent; box-shadow: none; }
|
||
.nav-list > .nav-row.profile-param-item:hover { background: var(--surface-selected); }
|
||
|
||
.language-row::after { content: none; }
|
||
.language-row[aria-checked='true']::after { content: '✓'; color: var(--accent); font-size: 18px; font-weight: var(--weight-bold); }
|