إتقان تصميم التخطيط سريع الاستجابة باستخدام CSS الحديث (Flexbox، Grid)، ونهج الهاتف المحمول أولاً، واستراتيجيات نقاط التوقف. قم بإنشاء تخطيطات تتكيف بشكل جميل عبر جميع الأجهزة مع الحفاظ على إمكانية الوصول والأداء. يتضمن استعلامات الحاوية ونسب العرض إلى الارتفاع وأنماط الاستجابة المتقدمة.
ثبّت مهارة الذكاء الاصطناعي layout-system بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: sanky369/vibe-building-skills.
Layout is the skeleton of your interface. It determines how content is organized, how users navigate, and how the experience adapts across devices. A well-designed layout system is invisible—users don't notice it because it works so well.
This skill teaches you to think about layout systematically, using modern CSS techniques (Flexbox, Grid, Container Queries) and a mobile-first approach that ensures your product works beautifully everywhere.
The mobile-first approach is not just about making things smaller on mobile. It's a fundamental shift in thinking: start with the simplest, most constrained context (mobile), then progressively enhance for larger screens.
إتقان تصميم التخطيط سريع الاستجابة باستخدام CSS الحديث (Flexbox، Grid)، ونهج الهاتف المحمول أولاً، واستراتيجيات نقاط التوقف. قم بإنشاء تخطيطات تتكيف بشكل جميل عبر جميع الأجهزة مع الحفاظ على إمكانية الوصول والأداء. يتضمن استعلامات الحاوية ونسب العرض إلى الارتفاع وأنماط الاستجابة المتقدمة. المصدر: sanky369/vibe-building-skills.
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/sanky369/vibe-building-skills --skill layout-systemإتقان تصميم التخطيط سريع الاستجابة باستخدام CSS الحديث (Flexbox، Grid)، ونهج الهاتف المحمول أولاً، واستراتيجيات نقاط التوقف. قم بإنشاء تخطيطات تتكيف بشكل جميل عبر جميع الأجهزة مع الحفاظ على إمكانية الوصول والأداء. يتضمن استعلامات الحاوية ونسب العرض إلى الارتفاع وأنماط الاستجابة المتقدمة. المصدر: sanky369/vibe-building-skills.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/sanky369/vibe-building-skills --skill layout-system بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/sanky369/vibe-building-skills