35 lines
1.3 KiB
TypeScript
35 lines
1.3 KiB
TypeScript
import { View } from 'react-native';
|
|
|
|
import { UI } from '@/constants/uiTheme';
|
|
|
|
export function DashboardSkeleton() {
|
|
return (
|
|
<View className="p-4" accessibilityLabel="Chargement du tableau de bord">
|
|
<View className="mb-2 h-7 w-[55%] rounded-lg" style={{ backgroundColor: '#E2E8F0' }} />
|
|
<View className="mb-4 h-24 rounded-2xl border" style={{ borderColor: UI.border, backgroundColor: UI.card }} />
|
|
<View className="mb-2 h-7 w-[40%] rounded-lg" style={{ backgroundColor: '#E2E8F0' }} />
|
|
<View className="mb-4 flex-row gap-3">
|
|
{[1, 2, 3].map((k) => (
|
|
<View
|
|
key={k}
|
|
className="h-24 flex-1 rounded-2xl border"
|
|
style={{ borderColor: UI.border, backgroundColor: UI.card }}
|
|
/>
|
|
))}
|
|
</View>
|
|
<View className="mb-2 h-7 w-[35%] rounded-lg" style={{ backgroundColor: '#E2E8F0' }} />
|
|
<View className="mb-4 h-20 rounded-2xl border" style={{ borderColor: UI.border, backgroundColor: '#F8FAFC' }} />
|
|
<View className="mb-2 h-7 w-[45%] rounded-lg" style={{ backgroundColor: '#E2E8F0' }} />
|
|
<View className="gap-3">
|
|
{[1, 2, 3].map((k) => (
|
|
<View
|
|
key={k}
|
|
className="h-16 rounded-2xl border"
|
|
style={{ borderColor: UI.border, backgroundColor: UI.card }}
|
|
/>
|
|
))}
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|