mirror of
https://github.com/pupperpowell/bibdle.git
synced 2026-04-05 17:33:31 -04:00
Adds a new /progress route showing a personalized Bible knowledge dashboard with stat cards, book mastery grid, 30-day activity calendar, skill growth chart, streak milestones, and section insights. Links added from WinScreen (logged-in users) and DevButtons. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
26 lines
677 B
Svelte
26 lines
677 B
Svelte
<script lang="ts">
|
|
import Container from "$lib/components/Container.svelte";
|
|
|
|
interface Props {
|
|
emoji: string;
|
|
value: string;
|
|
label: string;
|
|
colorClass: string;
|
|
suffix?: string;
|
|
}
|
|
|
|
let { emoji, value, label, colorClass, suffix }: Props = $props();
|
|
</script>
|
|
|
|
<Container class="p-4 md:p-6 w-full">
|
|
<div class="text-center w-full">
|
|
<div class="text-2xl md:text-3xl mb-1">{emoji}</div>
|
|
<div class="text-2xl md:text-3xl font-bold {colorClass} mb-1">
|
|
{value}{#if suffix}<span class="text-base font-normal text-gray-400"
|
|
> {suffix}</span
|
|
>{/if}
|
|
</div>
|
|
<div class="text-xs md:text-sm text-gray-300 font-medium">{label}</div>
|
|
</div>
|
|
</Container>
|