نظام التصميم
الرموز، وبيانات السمة، والمكوّنات، وامتداد الهوية التجارية في after_design_system.
إصدار التوثيق: supercore main · الحزم 1.0.0
بيانات السمةرابط إلى هذا القسم: بيانات السمة
اللغة البصرية المشتركة: رموز اللون والتباعد ونصف القطر والحركة والطباعة، وبيانات سمة Material 3، ومكوّنات مشتركة، متطابقة عبر خطوط المنتجات.
abstract final class AfterThemeData {
static ThemeData light({
AfterTypography typography = AfterTypography.garage,
Color? accentOverride,
}) { … }
static ThemeData dark({
AfterTypography typography = AfterTypography.garage,
Color? accentOverride,
}) { … }
}
// Product: same family, own accent (spec branding.accent).
MaterialApp(
theme: AfterThemeData.light(accentOverride: const Color(0xFF22D3EE)),
darkTheme: AfterThemeData.dark(accentOverride: const Color(0xFF22D3EE)),
);المصدر supercore/packages/after_design_system/lib/src/foundations/theme.dart (يُفتح في علامة تبويب جديدة)
الرموزرابط إلى هذا القسم: الرموز
| الرمز | القيمة |
|---|---|
| AfterColors.accent | #38BDF8 |
| AfterColors.accentDeep | #0284C7 |
| AfterColors.graphite950 | #0B0C0F |
| AfterColors.graphite800 | #222831 |
| AfterColors.steel | #8A919D |
| AfterColors.lightBackground | #FAFBFC |
| AfterColors.success | #22C55E |
| AfterColors.warning | #F59E0B |
| AfterColors.danger | #EF4444 |
| AfterSpacing.xs | 4 |
| AfterSpacing.sm | 8 |
| AfterSpacing.md | 12 |
| AfterSpacing.lg | 16 |
| AfterSpacing.xxl | 24 |
| AfterSpacing.xxxl | 32 |
| AfterSpacing.massive | 48 |
| AfterSpacing.hero | 64 |
| AfterRadius · xs | 6 |
| AfterRadius · sm · control | 8 |
| AfterRadius · md · surface | 12 |
| AfterRadius · lg · panel | 16 |
| AfterRadius · xl · media | 20 |
| AfterMotion · instant | 100ms |
| AfterMotion · fast · micro | 180ms |
| AfterMotion · normal · page | 280ms |
| AfterMotion · slow · modal | 420ms |
| AfterMotion · emphasis | 560ms |
المكوّناترابط إلى هذا القسم: المكوّنات
الأزرار، والبطاقات، وحقول الإدخال، والتنقل، ومربعات الحوار، والمخططات، ولوحة المعلومات، وحالات الفراغ والتحميل، وأقسام الإعدادات، والشريط العلوي للغلاف.
- lib/src/components/buttons.dart
- lib/src/components/cards.dart
- lib/src/components/inputs.dart
- lib/src/components/navigation_bar.dart
- lib/src/components/dialogs.dart
- lib/src/components/charts.dart
- lib/src/components/dashboard.dart
- lib/src/components/empty_states.dart
- lib/src/components/loading.dart
- lib/src/components/settings_section.dart
- lib/src/components/shell_top_bar.dart
امتداد الهوية التجاريةرابط إلى هذا القسم: امتداد الهوية التجارية
تصرّح مواصفة كل منتج بلون مميّز وشعار حرفي. وتستقبل السمة اللون المميّز عبر accentOverride؛ ويبقى كل ما عدا ذلك ضمن العائلة.
- SuperGarage#22D3EE · SG
- SuperKids#F472B6 · SK
- SuperHospital#F43F5E · SH
- SuperFactory#F59E0B · SF