mobile-frontend

Solid

Composite skill for quality mobile-first frontend — codified rules (spacing, type scale, anchors, safe-area, tap-targets), build, and multi-level verification with per-element menu/nav debugging.

AI & Automation 6 stars 0 forks Updated 2 weeks ago MIT

Install

View on GitHub

Quality Score: 82/100

Stars 20%
28
Recency 20%
90
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# mobile-frontend Композитный скилл для качественной **мобильной вёрстки и фронтенда**: от правил (отступы, шрифты, якоря, токены) через сборку к многоуровневой проверке с отладкой каждого элемента — включая меню и навигацию — и финальному аудиту перед сдачей. Это «дирижёр»: он держит единый воркфлоу и перенаправляет узкие задачи соседним скиллам (`frontend-design-taste`, `frontend-perfection`, `/visual-qa`, `/frontend`), а сам владеет мобильными правилами и чек-листом отладки навигации. ## Когда использовать - «сделай мобильную версию», «mobile-first вёрстка», «адаптив под телефон» - «проверь мобилку», «аудит мобильной вёрстки», «mobile QA» - «меню/гамбургер не работает на телефоне», «якоря упираются в шапку» - «доведи мобильный фронт до идеала», «mobile lighthouse 100» ## Не подменяйте этим скиллом - Чистая эстетика/палитра без мобильного контекста → `frontend-design-taste` - Глубокий a11y-аудит (ARIA, контраст, фокус-ловушки, скринридер) → `frontend-a11y` - Глубокий perf-аудит (заголовки, вес бандла, CWV, resource-hints) → `frontend-performance` - E2E/визуальные/контрактные тесты → `frontend-testing` - Быстрый Lighthouse/контраст/токены/OG на десктопе → `frontend-perfection` - Один конкретный баг в меню → см. `references/debug-menu-nav.md`, но воркфлоу всё равно прогоняйте по уровням. --- ## Необходимые мобильные правила (база) Все числа — в `references/tokens.md`. Кратко: 1. **Tap-target ≥ 44×44px** для любой интерактивной цели (кнопка, ссылка-иконка, пункт ...

Details

Author
bestdeejay-design
Repository
bestdeejay-design/agent-skills
Created
1 months ago
Last Updated
2 weeks ago
Language
Python
License
MIT

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

mobile

Mobile adaptation with hardened rules from real production iterations. Uniform scale factor, preserve composition, no JS→scroll-snap swap, iOS ?v=N cache-bust, text nowrap in collapsed cards. Ends with a headless-browser safety check (text overflow, safe paddings, no horizontal scroll, tap-target sizes) across 320/375/390/414/480/768. Runs only when priority=desktop-first.

2 Updated 1 months ago
dkadts
Web & Frontend Listed

mobile-ux-optimizer

Mobile-first UX optimization for touch interfaces, responsive layouts, and performance. Use for viewport handling, touch targets, gestures, mobile navigation. Activate on mobile, touch, responsive, dvh, viewport, safe area, hamburger menu. NOT for native app development (use React Native skills), desktop-only features, or general CSS (use Tailwind docs).

0 Updated today
Oatelauser
Web & Frontend Solid

frontend-design

Создание высококачественных, визуально выдающихся фронтенд-интерфейсов. Используй ВСЕГДА когда пользователь просит создать веб-страницу, компонент, лендинг, дашборд, UI-кит, форму, карточки, навигацию, анимации, или любой другой веб-интерфейс. Скилл покрывает: HTML/CSS/JS компоненты, React/Vue/Svelte, Tailwind CSS, адаптивный и мобильный дизайн, визуальные стили (glassmorphism, neomorphism, material, flat, градиенты, тёмная тема), интерактивность (drag-and-drop, анимации, hover-эффекты, transitions), верстку (Flexbox, Grid, Container Queries), производительность, доступность (WCAG/ARIA), дизайн-системы и токены. Если пользователь хочет что-то "красивое", "современное", "стильное" в вебе — обязательно используй этот скилл. НЕ используй для нативных мобильных приложений (iOS/Swift/SwiftUI, Android) — для iOS бери скилл ios-development; этот скилл только про веб-UI (браузер).

138 Updated 2 months ago
AnastasiyaW