Refactor UI components for improved styling and user experience

- Updated UserMenu.vue to enhance button and avatar styles for a more modern look.
- Adjusted alert component styles in index.ts for consistent rounded corners.
- Simplified loading state markup in order confirmation page for cleaner code.
- Enhanced button and link text for better clarity and user navigation.

These changes aim to improve the overall aesthetic and usability of the application, ensuring a more cohesive user experience.
This commit is contained in:
Bastian Masanek
2025-11-03 17:17:40 +01:00
parent 782bd6cdd7
commit f6f09ca147
4 changed files with 22 additions and 49 deletions

View File

@@ -6,15 +6,14 @@ export { default as AlertDescription } from './AlertDescription.vue'
export { default as AlertTitle } from './AlertTitle.vue'
export const alertVariants = cva(
'relative w-full rounded-lg border p-4 flex items-center gap-3 [&>svg]:shrink-0 [&>svg]:text-foreground',
'relative w-full rounded-[25px] border p-4 flex items-center gap-3 [&>svg]:shrink-0 [&>svg]:text-foreground',
{
variants: {
variant: {
default: 'bg-background text-foreground',
destructive:
'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
error:
'bg-white/15 border-l-4 border-warning text-white [&>svg]:text-warning',
error: 'bg-white/15 border-l-4 border-warning text-white [&>svg]:text-warning',
},
},
defaultVariants: {