gitadmin/gift-tracker-sv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update Button and StatsCard styles for improved UI and enhance GiftsList sorting logic

Browse Source
This commit is contained in:
Norbert Maciaszek
2025-11-21 01:17:57 +01:00
parent e5025d89a6
commit a0eb060257
4 changed files with 45 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/components/atoms/Button.svelte
View File

@@ -1,11 +1,12 @@
<script lang="ts">
import { page } from '$app/state';
import type { Snippet } from 'svelte';
const variants = {
primary:
'px-4 py-2 text-sm font-medium text-white bg-emerald-800 hover:bg-emerald-900 rounded-xl transition-all duration-200 ease-in-out disabled:opacity-70 disabled:cursor-not-allowed',
secondary:
'px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 hover:bg-gray-100 rounded-xl transition-all duration-200 ease-in-out',
'px-4 py-2 text-sm font-medium text-gray-100 bg-gray-600 border border-gray-300 hover:bg-gray-500 rounded-xl transition-all duration-200 ease-in-out',
danger:
'px-4 py-2 text-sm font-medium text-white bg-red-800 hover:bg-red-900 rounded-xl transition-all duration-200 ease-in-out disabled:opacity-70 disabled:cursor-not-allowed'
};
@@ -18,10 +19,13 @@
href?: string;
};
let { children, onClick, disabled, variant = 'primary', href }: Props = $props();
const isActive = page.params.year === href?.split('/').pop();
$inspect(isActive, 'isActive', page.params.year, href);
</script>
{#if href}
<a {href} class={variants[variant]}>
<a {href} class={variants[variant]} class:!bg-gray-900={isActive}>
{@render children()}
</a>
{:else}