* feat: remove tinymce & replace org sidebar * chore: PR Fixes * chore: move ui font into src dir * remove files in vite config * use google font import for loading font * remove custom font * more fonts update * remove font bold * more removals of font bold * fix import * checkpoint * chore: checkpoint (add course & lms shadcn sidebar) * minor css improvements and try out font sans * chore: replace carbon components with shadcn's * chore: replace carbon components with shadcn _ v3 * chore: ui fixes & storybook update * feat: UI cleanup * fix: quick ui fixes * chore: update pnpm-lock.yaml with new dependencies and versions; fix output.css formatting * chore: add isloading to button * feat: add loading state to button stories * chore: feedback fixes * fix: feedback fixes * chore: remove console * fix: PR comments * fix: PR comments --------- Co-authored-by: Rotimi Best <best@classroomio.com>
39 lines
921 B
Svelte
39 lines
921 B
Svelte
<script lang="ts">
|
|
interface Activity {
|
|
icon: any;
|
|
title: string;
|
|
percentage: number | string;
|
|
description: string;
|
|
hidePercentage?: boolean;
|
|
}
|
|
|
|
interface Props {
|
|
activity: Activity;
|
|
}
|
|
|
|
let { activity }: Props = $props();
|
|
</script>
|
|
|
|
<div
|
|
class="flex flex-col items-center justify-center gap-5 rounded-xl border p-3 md:flex-row md:p-5 dark:border-neutral-600"
|
|
>
|
|
<div class="bg-primary-200 w-fit rounded-full p-4 text-black">
|
|
<activity.icon />
|
|
</div>
|
|
|
|
<div>
|
|
<p class="text-center text-sm font-medium text-gray-600 md:text-left dark:text-gray-200">
|
|
{activity.title}
|
|
</p>
|
|
<p class="text-center text-2xl md:text-left">
|
|
{activity.percentage}
|
|
{#if !activity.hidePercentage}
|
|
%
|
|
{/if}
|
|
</p>
|
|
<p class="text-center text-xs text-gray-500 md:text-left md:text-sm dark:text-gray-300">
|
|
{activity.description}
|
|
</p>
|
|
</div>
|
|
</div>
|