iiuniversitet.ruЦентр обучения нейросетямОткрыть каталог

Адаптивная вёрстка

Делает интерфейс адаптивным для мобильных, планшетов и десктопа.

СкиллРазработано в iiuniversitetCodexНаш материалНужен терминалПроверка не требуется
Скачать архив
Что делает
Делает интерфейс адаптивным для мобильных, планшетов и десктопа.
Когда брать
Когда вы просите: «адаптируй под мобильные» или «адаптивная вёрстка».
Пример запроса
$responsive-layout адаптируй под мобильные

Как включить

  1. Скачайте архив и распакуйте его.
  2. Положите папку responsive-layout в ~/.agents/skills/.
  3. Вызовите скилл командой $responsive-layout или найдите его через /skills.

Текст

---
name: responsive-layout
description: "Делает интерфейс адаптивным для мобильных, планшетов и десктопа. Используй, когда пользователь просит: «адаптируй под мобильные» или «адаптивная вёрстка». Не используй для задач вне этой темы."
---

Адаптивная вёрстка

Делает интерфейс адаптивным для мобильных, планшетов и десктопа.

Перед началом

Прочитай AGENTS.md и README, определи стек, команды сборки и тестов. Работай в текущей ветке, не трогай несвязанные файлы.

Порядок работы

  1. Проверить брейкпоинты.
  2. Переписать сетку на flex/grid.
  3. Исправить переполнения.
  4. Проверить на ширине 375px.
  5. Проверь результат по правилам ниже и кратко опиши, что сделано.

Формат результата

Diff стилей + скриншоты.

Правила

  • Используй существующие компоненты и токены проекта.
  • Проверяй вёрстку на мобильной ширине.
  • Не добавляй новые зависимости без необходимости.

Пример вызова

$responsive-layout адаптируй под мобильные

Разработано в iiuniversitet — https://iiuniversitet.ru/?utm_source=bonus&utm_medium=skill&utm_campaign=katalog&utm_content=responsive-layout

Автор: iiuniversitet. Каталог скиллов iiuniversitet.