U
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Mobile UI patterns - React Native, iOS/Android, touch targets
How to use
- Załaduj umiejętność wraz z plikami base.md i react-native.md w swoim projekcie Claude. 2. Zapoznaj się z trzema obowiązkowym standardami: touch targety muszą mieć minimum 44×44 punkty dla każdego elementu interaktywnego (przyciski, ikony, linki), kontrast tekstu musi wynosić co najmniej 4,5:1 dla tekstu zwykłego i 3:1 dla tekstu dużego zgodnie z WCAG 2.1 AA, wszystkie przyciski muszą mieć widoczne granice – używaj solidnych tła z kontrastowym tekstem. 3. Podczas projektowania komponentów React Native stosuj podane rozmiary paddingu i wysokości: paddingVertical 12–16 punktów, paddingHorizontal 16–24 punkty, minHeight i minWidth 44 punkty dla przycisków. 4. Sprawdzaj kombinacje kolorów przed wdrożeniem – czarny tekst (#000000) na białym tle daje kontrast 21:1, szary-700 (#374151) na białym daje 9,2:1, białe (#FFFFFF) na szarym-900 daje 16:1. Unikaj szarych odcieni poniżej 4,5:1. 5. Testuj każdy element interaktywny na rzeczywistych urządzeniach iOS i Android, aby potwierdzić, że touch targety są łatwe do dotknięcia i że kontrast jest wystarczający w różnych warunkach oświetlenia.