Merge pull request #66 from dikstub-rssa/fe-public-features-46

Feat(public): Implement Dark Mode + Adjustment Padding Frame
This commit is contained in:
Munawwirul Jamal
2025-09-19 07:49:33 +07:00
committed by GitHub
6 changed files with 176 additions and 57 deletions
+11 -11
View File
@@ -113,7 +113,7 @@ onMounted(() => {
<div class="mt-4 flex flex-wrap items-center justify-between gap-2">
<h2 class="text-2xl font-bold tracking-tight">Dashboard SIMRS</h2>
<div class="flex items-center gap-4 space-x-2">
<div class="bg-primary rounded-xl border p-1 text-white">Status: Aktif</div>
<div class="rounded-xl border bg-primary p-1 text-white">Status: Aktif</div>
<Button class="bg-primary p-2 text-white" size="lg">
<Icon name="i-lucide-refresh-ccw" class="h-6 w-6" />
Sinkronisasi
@@ -121,10 +121,10 @@ onMounted(() => {
</div>
</div>
<main class="my-6 flex flex-1 flex-col gap-4 md:gap-8">
<div class="grid gap-4 md:grid-cols-2 md:gap-8 lg:grid-cols-4">
<div class="dashboard-grid">
<PubBaseSummaryCard v-for="card in summaryData" :key="card.title" :stat="card" />
</div>
<div class="grid gap-4 md:gap-8 lg:grid-cols-1 xl:grid-cols-3">
<div class="dashboard-grid">
<Card v-for="n in 3" :key="n">
<CardHeader>
<CardTitle>Recent Sales</CardTitle>
@@ -143,7 +143,7 @@ onMounted(() => {
<p class="text-sm font-medium leading-none">
{{ recentSales.name }}
</p>
<p class="text-muted-foreground text-sm">
<p class="text-sm text-muted-foreground">
{{ recentSales.email }}
</p>
</div>
@@ -156,19 +156,19 @@ onMounted(() => {
<Card>
<CardHeader>
<div class="flex flex-wrap items-center gap-2">
<Icon name="i-lucide-activity" class="text-primary me-2 h-6 w-6" />
<Icon name="i-lucide-activity" class="me-2 h-6 w-6 text-primary" />
<h2 class="text-xl font-semibold tracking-tight">Aksi Cepat</h2>
</div>
</CardHeader>
<CardContent class="grid cursor-pointer gap-8 md:grid-cols-4 md:gap-8">
<CardContent class="grid cursor-pointer gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 xl:gap-5">
<Card
v-for="item in linkItems"
:key="item.title"
class="border-primary hover:bg-primary my-2 h-32 border transition-colors duration-200 hover:bg-gray-200"
>
v-for="item in linkItems"
:key="item.title"
class="my-2 h-32 border border-primary transition-colors duration-200 hover:bg-gray-200 hover:bg-primary"
>
<NuxtLink :to="item.link">
<CardContent class="my-2 grid h-full grid-rows-2 place-items-center">
<Icon :name="item.icon" class="text-primary h-9 w-[60px]" />
<Icon :name="item.icon" class="h-9 w-[60px] text-primary" />
<h1>{{ item.title }}</h1>
</CardContent>
</NuxtLink>