andika/membership-fe
3
1
Fork 1
Code Issues 17 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update button and badge styles for improved theming and consistency

Browse Source
This commit is contained in:
kayela
2026-01-14 11:07:43 -06:00
parent 4cdccc0323
commit 4ccaca192d
14 changed files with 85 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/styles/components.css
View File

@@ -17,7 +17,7 @@
}
.btn-ghost {
@apply hover:bg-accent hover:text-accent-foreground rounded-full disabled:opacity-50 px-6 transition-transform;
@apply hover:bg-brand-purple bg-brand-purple/10 rounded-full disabled:opacity-50 px-6 transition-transform text-brand-purple hover:text-[var(--purple-muted)];
}
.btn-outline {
@@ -33,7 +33,7 @@
}
.btn-outline-destructive {
@apply border border-destructive border-2 text-destructive shadow-sm hover:bg-destructive/10 dark:hover:bg-destructive/10 rounded-full disabled:opacity-50 px-6 transition-transform;
@apply border border-destructive bg-none border-2 text-destructive shadow-sm hover:bg-destructive/10 dark:hover:bg-destructive/10 rounded-full disabled:opacity-50 px-6 transition-transform;
}
.btn-link {
@@ -55,12 +55,15 @@
.btn-icon {
@apply h-9 w-9 rounded-full disabled:opacity-50 px-6;
}
.btn-green {
@apply bg-[var(--green-light)] hover:bg-[var(--green-forest)] text-white transition-transform rounded-full px-6 ;
}
.btn-util-green {
@apply bg-[var(--green-light)] hover:bg-[var(--green-forest)] text-white transition-transform rounded-xl h-12 px-6 transition-transform;
@apply bg-[var(--green-light)] hover:bg-[var(--green-forest)] text-white transition-transform rounded-xl h-12 px-6 ;
}
.btn-util-purple {
@apply bg-[var(--purple-lavender)] transition-transform hover:bg-[var(--purple-ink-2)] text-background dark:text-white dark:hover:text-white rounded-xl h-12 px-6 transition-transform;
@apply bg-[var(--purple-lavender)] hover:bg-[var(--purple-ink-2)] text-background dark:text-white dark:hover:text-white rounded-xl h-12 px-6 transition-transform;
}
.btn-light-orange {