Адаптивная вёрстка
Делает интерфейс адаптивным для мобильных, планшетов и десктопа.
СкиллРазработано в iiuniversitetCodexНаш материалНужен терминалПроверка не требуется
- Что делает
- Делает интерфейс адаптивным для мобильных, планшетов и десктопа.
- Когда брать
- Когда вы просите: «адаптируй под мобильные» или «адаптивная вёрстка».
- Пример запроса
- $responsive-layout адаптируй под мобильные
Как включить
- Скачайте архив и распакуйте его.
- Положите папку
responsive-layoutв~/.agents/skills/. - Вызовите скилл командой
$responsive-layoutили найдите его через/skills.
Текст
---
name: responsive-layout
description: "Делает интерфейс адаптивным для мобильных, планшетов и десктопа. Используй, когда пользователь просит: «адаптируй под мобильные» или «адаптивная вёрстка». Не используй для задач вне этой темы."
---
Адаптивная вёрстка
Делает интерфейс адаптивным для мобильных, планшетов и десктопа.
Перед началом
Прочитай AGENTS.md и README, определи стек, команды сборки и тестов. Работай в текущей ветке, не трогай несвязанные файлы.
Порядок работы
- Проверить брейкпоинты.
- Переписать сетку на flex/grid.
- Исправить переполнения.
- Проверить на ширине 375px.
- Проверь результат по правилам ниже и кратко опиши, что сделано.
Формат результата
Diff стилей + скриншоты.
Правила
- Используй существующие компоненты и токены проекта.
- Проверяй вёрстку на мобильной ширине.
- Не добавляй новые зависимости без необходимости.
Пример вызова
$responsive-layout адаптируй под мобильные
Разработано в iiuniversitet — https://iiuniversitet.ru/?utm_source=bonus&utm_medium=skill&utm_campaign=katalog&utm_content=responsive-layout
Автор: iiuniversitet. Каталог скиллов iiuniversitet.