SHAKL / PathPilot · معاينات للقراءة فقط

تجربة المكونات البصرية

معاينات قابلة للتجربة تستخدم تنسيقات PathPilot الأصلية دون تغييرها. التفاعل هنا توضيحي مستقل ولا يمثل تشغيل React الكامل.

مرجع المعاينة: ملفات التنسيق الأصلية من src/styles/global.css و src/features/editor/editor.css. تمت مراجعة تركيب Toggle وRange وFeatureCard وGroup وScrubField في InspectorPanel.tsx. العينات تمثيلات مستقلة لهذه العناصر وليست تأكيدا لفحص كل حالات التشغيل.

مفاتيح التبديل

InspectorPanel.tsx · function Toggle / .fig-toggle-item
غير نشط
نشط
اضغط على أي مفتاح لتجربة الحالتين.

شريط التحكم

InspectorPanel.tsx · function Range / .fig-slider-*
الشريط يستخدم تنسيق المصدر، ويمكن تعديل قيمته كتابيا داخل هذه المعاينة.

بطاقة الخصائص

InspectorPanel.tsx · function FeatureCard / .feature-card

محتوى توضيحي داخل البطاقة.

الأيقونة توضيحية، وليست رسمة EditorIcon الأصلية.

مجموعة الخصائص

InspectorPanel.tsx · function Group / .side-group
الفحصالقياسات

حقول التوقيت الرقمية

InspectorPanel.tsx · function ScrubField / .tl-field
حقول رقمية يمكن تعديلها، بتنسيق المحرر الأصلي.

الأيقونات والتشغيل

editor.css · .icon-button / .tl-transport / .tl-icon-btn
الرموز توضيحية مع تنسيقات الحالات المستخرجة من المصدر.

الأنماط الجاهزة

editor.css · .side-preset variants
أنماط CSS اللونية الأصلية؛ يمكن اختيار نمط واحد للتجربة.

طبقات الواجهة

editor.css · :root surface variables
--editor-panelلوحة
--editor-moduleوحدة
--editor-controlعنصر تحكم
--violetمحدد

للاطلاع على جميع المكونات والتكرارات والعناصر غير المصنفة، انتقل إلى الفهرس الرئيسي. هذه الصفحة تعرض مجموعة من العناصر التي تمت مراجعة بنائها.