AC mobile-native
Сделайте веб-приложение похожим на нативное на телефоне — небольшие исправления CSS и мета-тегов, которые отличают «сайт в браузере» от чего-то, что кажется установленным. Охватывает фиксированные состояния наведения, вспышки подсветки при касании, ошибку 100vh, поля ввода, которые масштабируют страницу, задержки касаний, перетаскивание для обновления, блокирующее прокрутку, контент под вырезом, долгое нажатие, выделяющее текст кнопки, карусели, которые прокручиваются в неправильном направлении, несоответствующие строки состояния и правило тестирования на реальном оборудовании. Используйте, когда веб-приложение создается или проверяется на мобильных устройствах, когда что-то «работает в Chrome, но ощущается неправильно на моем телефоне», при создании PWA, нижнего листа, карусели, полноэкранного макета или любого сенсорного взаимодействия. Для самой анимации используйте animate; для React Native используйте animate-expo.
машинный переводПоказать оригиналСкрыть оригинал«Make a web app feel native on a phone — the small CSS and meta-tag fix…»
Make a web app feel native on a phone — the small CSS and meta-tag fixes that separate "a website in a browser" from something that feels installed. Covers sticky hover states, tap highlight flashes, the 100vh bug, inputs that zoom the page, laggy taps, pull-to-refresh hijacking scroll, content under the notch, long-press selecting button text, carousels that scroll the wrong way, mismatched status bars, and the rule that you test on real hardware. Use when a web app is being built for or reviewed on mobile, when something "works in Chrome but feels wrong on my phone", when building a PWA, a bottom sheet, a carousel, a full-screen layout, or any touch interaction. For motion itself use animate; for React Native use animate-expo.
Сделайте веб-приложение похожим на нативное на телефоне — небольшие исправления CSS и мета-тегов, которые отличают «сайт в браузере» от чего-то, что кажется…
Как процесс C 60/100 · Есть пробелы — слабые места: когда включается, входы и предусловия, повторный запуск
Как улучшить
- Свои кейсы (evals/evals.json, 4–6 реальных запросов с ожидаемыми ответами): тогда полная проверка прогонит именно их, а не черновик от модели.
- spec.yaml с триггерными фразами и утверждениями — контракт поведения для CI; `skilltest init` создаст шаблон.
Находки guard · 0
✓ Критических и высоких находок нет
Просканировано файлов: 1. Улики замаскированы. Пометки в серых чипах объясняют, почему серьёзность понижена.
По спецификации Agent Skills
✓ По спецификации Agent Skills замечаний нет
Процессный рейтинг: все десять параметров 60/100
- 0Входы и предусловия. Не сказано, что нужно иметь на входе
- 0Отчётность по ходу. Скилл ничего не сообщает по ходу работы
- 20Когда включается. Не сказано, при каком запросе скилл включается
- 30Повторный запуск. Изменяющих операций: 4, без проверки текущего состояния
- 60Инструменты и файлы. Используются инструменты (bash), но во frontmatter они не объявлены
- 60Результат и критерий готовности. Формат результата описан, критерия завершения нет
- 70Стоимость исполнения. Тело инструкции 4002 токенов
- 100Шаги. Шагов: 14
- 100Ошибки и развилки. Развилок: 1, есть раздел про ошибки
- 100Согласованность. Имя и обязательные поля на месте
- medium Правила безопасности и запреты внутри скилла: их место в системном промпте, здесь они не защищают
Всё перечисленное измерено по тексту скилла, а не оценено моделью: цифры проверяемы. Вес параметра тем больше, чем чаще из-за него процесс встаёт.
Сигналы качества
- +4Описание не говорит, когда скилл НЕ применять (ложные срабатывания)
- +1Лицензия не указана
- +2Инструкции на одном языке
- +5В description 2 примера фраз-триггеров в кавычках
- +3Длина description 738 символов: достаточно сигнала, не съедает бюджет
- +4Структура: 21 заголовков
- +3Пошаговые инструкции: 14 пунктов
- +3Формат ответа описан явно
- +4Есть примеры (16 блоков кода)
База качества 70; замечания lint вычитаются, сигналы прибавляют до 100. Итог: 92.