diff --git a/docs/TZ.md b/docs/TZ.md index ce629c6..b753842 100644 --- a/docs/TZ.md +++ b/docs/TZ.md @@ -4,7 +4,7 @@ | | | |---|---| -| Версия ТЗ | 0.58 | +| Версия ТЗ | 0.59 | | Дата | 2026-10-09 | | Статус | На обсуждении | @@ -171,6 +171,9 @@ приоритету, топ-5); сайдбар — сводка по статусам и активные проекты с прогрессом. - Пустые секции дашборда не показываются; при отсутствии и активных, и проектов — нейтральное пустое состояние. +- Карточки стека раскладываются **сеткой по три в ряд** (0.59): на узких экранах — + две и одна (ломающиеся точки 1080 и 720px), карточки разной высоты выравниваются + по верху, а не растягиваются в ряду; скелетон загрузки повторяет ту же сетку. ### 3.8. Проекты @@ -633,7 +636,13 @@ (углы холста скруглены, за ними — ничего). До 0.54 знак был в рамке-чипе, в 0.54 рамку сняли с подрезкой `viewBox` по глифу — знак занимал всю отведённую коробку, но в шапке и на экране входа выглядел «голым»; с 0.56 знак подан на - холсте. + холсте. Попап расширения показывает лого из своего `public/` (у упакованного + расширения свой корень — ссылка на фронт не работает), поэтому с 0.59 копию + обновляет тот же `tools/rasterize_icons.sh`: одна команда на правку логотипа. +- **Заголовок-ссылка в карточке — не классом `card-title`** (0.59): `card-title` — + имя шапки карточки в ките (`header.card-title`, у него `padding: 15px 15px 0`); + тот же класс на вложенной ссылке давал вторые 15px, и текст заголовка уезжал + вправо от остального содержимого. Ссылка стека носит собственный `card-link`. ## 4. Нефункциональные требования diff --git a/extension/public/logo.svg b/extension/public/logo.svg index 312698a..16067d8 100644 --- a/extension/public/logo.svg +++ b/extension/public/logo.svg @@ -1,6 +1,9 @@ GNexus Tasks — три строки задач - + diff --git a/frontend/src/views/StackView.vue b/frontend/src/views/StackView.vue index 6692ac2..1017fdc 100644 --- a/frontend/src/views/StackView.vue +++ b/frontend/src/views/StackView.vue @@ -251,7 +251,9 @@

{{ snippet(task) }}

@@ -365,9 +367,6 @@ } .stack-skeleton { margin-bottom: 1rem; - display: flex; - flex-direction: column; - gap: 0.75rem; } /* карточка-скелет: как реальная карточка стека — тянется на ширину */ .stack-skeleton .card { @@ -386,20 +385,44 @@ display: flex; gap: 6px; } -.task-list { - display: flex; - flex-direction: column; +/* Карточки стека — по три в ряд (0.59); скелетон повторяет ту же сетку, + чтобы загрузка не дёргала раскладку. */ +.task-list, +.stack-skeleton { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; + /* карточки разной высоты — каждая по своему содержимому, а не растянута + под самую высокую в ряду */ + align-items: start; +} +.task-list > .card, +.stack-skeleton > .card { + /* сетка ужимает карточку — длинные слова/ссылки в заголовке переносятся, + а не расширяют трек */ + min-width: 0; +} +@media (max-width: 1080px) { + .task-list, + .stack-skeleton { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} +@media (max-width: 720px) { + .task-list, + .stack-skeleton { + grid-template-columns: minmax(0, 1fr); + } } /* воздух под «Всё спокойно», чтобы пустая страница не слипалась к низу */ .stack-empty { margin-bottom: 3rem; } -.card-title { +.card-link { color: inherit; text-decoration: none; } -.card-title:hover { +.card-link:hover { color: var(--accent, #7aa2f7); } .snippet { @@ -413,6 +436,7 @@ } .task-meta { display: flex; + flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-bottom: 0.75rem; diff --git a/tools/rasterize_icons.sh b/tools/rasterize_icons.sh index a56e05e..cc1d938 100755 --- a/tools/rasterize_icons.sh +++ b/tools/rasterize_icons.sh @@ -6,6 +6,10 @@ # frontend/public/icons/maskable-512.png purpose "maskable" # extension/public/icons/icon-{16,32,48,128}.png иконки расширения # +# Сюда же копируется само лого в public/ расширения (попап показывает его из +# своего public — у упакованного расширения свой корень, симлинк не переживёт +# сборку ZIP): копия обновляется этим же скриптом, чтобы не отстать от лого. +# # Нужен ImageMagick с rsvg (проверка: magick -list format | grep SVG → RSVG). # Фон #16161E впечатываем в PNG: прозрачность iOS рисует чёрным (углы холста # скруглены, за ними — ничего), а maskable на Android обрезается по кругу. @@ -30,4 +34,7 @@ raster 512 frontend/public/icons/maskable-512.png $((512 * SAFE / 100)) for s in 16 32 48 128; do raster "$s" "extension/public/icons/icon-$s.png"; done -command ls -l frontend/public/icons/*.png extension/public/icons/*.png +# лого попапа расширения — копия источника (см. шапку скрипта) +cp "$LOGO" extension/public/logo.svg + +command ls -l frontend/public/icons/*.png extension/public/icons/*.png extension/public/logo.svg