diff --git a/backend/internal/bootstrap/router_bootstrap.go b/backend/internal/bootstrap/router_bootstrap.go index 96a8eabb..cc9e3a91 100644 --- a/backend/internal/bootstrap/router_bootstrap.go +++ b/backend/internal/bootstrap/router_bootstrap.go @@ -165,11 +165,12 @@ func initServer(r *gin.Engine) (*serverConfig, error) { } var socketFn func() (*socket, error) - if common.EnvConfig.SystemdSocket { + switch { + case common.EnvConfig.SystemdSocket: socketFn = systemdSocket - } else if common.EnvConfig.UnixSocket != "" { + case common.EnvConfig.UnixSocket != "": socketFn = unixSocket - } else { + default: socketFn = tcpSocket } diff --git a/backend/internal/utils/image/profile_picture.go b/backend/internal/utils/image/profile_picture.go index 21d78797..4c4debde 100644 --- a/backend/internal/utils/image/profile_picture.go +++ b/backend/internal/utils/image/profile_picture.go @@ -54,7 +54,7 @@ func CreateDefaultProfilePicture(initials string) (*bytes.Buffer, error) { img := imaging.New(profilePictureSize, profilePictureSize, color.RGBA{R: 255, G: 255, B: 255, A: 255}) // Load the font - fontBytes, err := resources.FS.ReadFile("fonts/PlayfairDisplay-Bold.ttf") + fontBytes, err := resources.FS.ReadFile("fonts/Gloock.ttf") if err != nil { return nil, fmt.Errorf("failed to read font file: %w", err) } @@ -84,7 +84,7 @@ func CreateDefaultProfilePicture(initials string) (*bytes.Buffer, error) { // Center the initials x := (profilePictureSize - font.MeasureString(face, initials).Ceil()) / 2 - y := (profilePictureSize-face.Metrics().Height.Ceil())/2 + face.Metrics().Ascent.Ceil() - 10 + y := (profilePictureSize-face.Metrics().Height.Ceil())/2 + face.Metrics().Ascent.Ceil() drawer.Dot = fixed.P(x, y) // Draw the initials diff --git a/backend/resources/fonts/Gloock.ttf b/backend/resources/fonts/Gloock.ttf new file mode 100644 index 00000000..3e58c4e4 Binary files /dev/null and b/backend/resources/fonts/Gloock.ttf differ diff --git a/backend/resources/fonts/PlayfairDisplay-Bold.ttf b/backend/resources/fonts/PlayfairDisplay-Bold.ttf deleted file mode 100644 index 029a1a60..00000000 Binary files a/backend/resources/fonts/PlayfairDisplay-Bold.ttf and /dev/null differ diff --git a/frontend/package.json b/frontend/package.json index 08a0178d..80e7719b 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -14,6 +14,7 @@ "format": "prettier --write ." }, "dependencies": { + "@fontsource/gloock": "^5.2.8", "@simplewebauthn/browser": "^13.3.0", "@tailwindcss/vite": "^4.3.0", "axios": "^1.16.1", diff --git a/frontend/src/app.css b/frontend/src/app.css index a29105f9..a1e0ed30 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -1,5 +1,6 @@ @import 'tailwindcss'; @import 'tw-animate-css'; +@import '@fontsource/gloock'; @variant dark (&:where(.dark, .dark *)); @@ -12,245 +13,192 @@ color utility to any element that depends on these defaults. */ @layer base { - *, - ::after, - ::before, - ::backdrop, - ::file-selector-button { - border-color: var(--color-gray-200, currentcolor); - } + + *, + ::after, + ::before, + ::backdrop, + ::file-selector-button { + border-color: var(--color-gray-200, currentcolor); + } } :root { - --radius: 0.625rem; - --background: oklch(1 0 0); - --foreground: oklch(0.145 0 0); - --card: oklch(1 0 0); - --card-foreground: oklch(0.145 0 0); - --popover: oklch(1 0 0); - --popover-foreground: oklch(0.145 0 0); - --primary: oklch(0.205 0 0); - --primary-foreground: oklch(0.985 0 0); - --secondary: oklch(0.97 0 0); - --secondary-foreground: oklch(0.205 0 0); - --muted: oklch(0.97 0 0); - --muted-foreground: oklch(0.556 0 0); - --accent: oklch(0.97 0 0); - --accent-foreground: oklch(0.205 0 0); - --destructive: oklch(0.577 0.245 27.325); - --warning: oklch(0.96 0.06 85); - --warning-foreground: oklch(0.32 0.07 70); - --border: oklch(0.922 0 0); - --input: oklch(0.922 0 0); - --ring: oklch(0.708 0 0); - --chart-1: oklch(0.646 0.222 41.116); - --chart-2: oklch(0.6 0.118 184.704); - --chart-3: oklch(0.398 0.07 227.392); - --chart-4: oklch(0.828 0.189 84.429); - --chart-5: oklch(0.769 0.188 70.08); - --sidebar: oklch(0.985 0 0); - --sidebar-foreground: oklch(0.145 0 0); - --sidebar-primary: oklch(0.205 0 0); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.97 0 0); - --sidebar-accent-foreground: oklch(0.205 0 0); - --sidebar-border: oklch(0.922 0 0); - --sidebar-ring: oklch(0.708 0 0); + --radius: 1rem; + --background: oklch(1 0 0); + --foreground: oklch(0.145 0 0); + --card: oklch(1 0 0); + --card-foreground: oklch(0.145 0 0); + --popover: oklch(1 0 0); + --popover-foreground: oklch(0.145 0 0); + --primary: oklch(0.205 0 0); + --primary-foreground: oklch(0.985 0 0); + --secondary: oklch(0.97 0 0); + --secondary-foreground: oklch(0.205 0 0); + --muted: oklch(0.97 0 0); + --muted-foreground: oklch(0.556 0 0); + --accent: oklch(0.97 0 0); + --accent-foreground: oklch(0.205 0 0); + --destructive: oklch(0.577 0.245 27.325); + --warning: oklch(0.96 0.06 85); + --warning-foreground: oklch(0.32 0.07 70); + --border: oklch(0.922 0 0); + --input: oklch(0.922 0 0); + --ring: oklch(0.708 0 0); + --chart-1: oklch(0.646 0.222 41.116); + --chart-2: oklch(0.6 0.118 184.704); + --chart-3: oklch(0.398 0.07 227.392); + --chart-4: oklch(0.828 0.189 84.429); + --chart-5: oklch(0.769 0.188 70.08); + --sidebar: oklch(0.985 0 0); + --sidebar-foreground: oklch(0.145 0 0); + --sidebar-primary: oklch(0.205 0 0); + --sidebar-primary-foreground: oklch(0.985 0 0); + --sidebar-accent: oklch(0.97 0 0); + --sidebar-accent-foreground: oklch(0.205 0 0); + --sidebar-border: oklch(0.922 0 0); + --sidebar-ring: oklch(0.708 0 0); } .dark { - --background: oklch(0.145 0 0); - --foreground: oklch(0.985 0 0); - --card: oklch(0.205 0 0); - --card-foreground: oklch(0.985 0 0); - --popover: oklch(0.205 0 0); - --popover-foreground: oklch(0.985 0 0); - --primary: oklch(0.922 0 0); - --primary-foreground: oklch(0.205 0 0); - --secondary: oklch(0.269 0 0); - --secondary-foreground: oklch(0.985 0 0); - --muted: oklch(0.269 0 0); - --muted-foreground: oklch(0.708 0 0); - --accent: oklch(0.269 0 0); - --accent-foreground: oklch(0.985 0 0); - --destructive: oklch(0.704 0.191 22.216); - --warning: oklch(0.42 0.09 70); - --warning-foreground: oklch(0.93 0.03 85); - --border: oklch(1 0 0 / 10%); - --input: oklch(1 0 0 / 15%); - --ring: oklch(0.556 0 0); - --chart-1: oklch(0.488 0.243 264.376); - --chart-2: oklch(0.696 0.17 162.48); - --chart-3: oklch(0.769 0.188 70.08); - --chart-4: oklch(0.627 0.265 303.9); - --chart-5: oklch(0.645 0.246 16.439); - --sidebar: oklch(0.205 0 0); - --sidebar-foreground: oklch(0.985 0 0); - --sidebar-primary: oklch(0.488 0.243 264.376); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.269 0 0); - --sidebar-accent-foreground: oklch(0.985 0 0); - --sidebar-border: oklch(1 0 0 / 10%); - --sidebar-ring: oklch(0.556 0 0); + --background: oklch(0.145 0 0); + --foreground: oklch(0.985 0 0); + --card: oklch(0.205 0 0); + --card-foreground: oklch(0.985 0 0); + --popover: oklch(0.205 0 0); + --popover-foreground: oklch(0.985 0 0); + --primary: oklch(0.922 0 0); + --primary-foreground: oklch(0.205 0 0); + --secondary: oklch(0.269 0 0); + --secondary-foreground: oklch(0.985 0 0); + --muted: oklch(0.269 0 0); + --muted-foreground: oklch(0.708 0 0); + --accent: oklch(0.269 0 0); + --accent-foreground: oklch(0.985 0 0); + --destructive: oklch(0.704 0.191 22.216); + --warning: oklch(0.42 0.09 70); + --warning-foreground: oklch(0.93 0.03 85); + --border: oklch(1 0 0 / 10%); + --input: oklch(1 0 0 / 15%); + --ring: oklch(0.556 0 0); + --chart-1: oklch(0.488 0.243 264.376); + --chart-2: oklch(0.696 0.17 162.48); + --chart-3: oklch(0.769 0.188 70.08); + --chart-4: oklch(0.627 0.265 303.9); + --chart-5: oklch(0.645 0.246 16.439); + --sidebar: oklch(0.205 0 0); + --sidebar-foreground: oklch(0.985 0 0); + --sidebar-primary: oklch(0.488 0.243 264.376); + --sidebar-primary-foreground: oklch(0.985 0 0); + --sidebar-accent: oklch(0.269 0 0); + --sidebar-accent-foreground: oklch(0.985 0 0); + --sidebar-border: oklch(1 0 0 / 10%); + --sidebar-ring: oklch(0.556 0 0); } @theme inline { - /* Radius (for rounded-*) */ - --radius-sm: calc(var(--radius) - 4px); - --radius-md: calc(var(--radius) - 2px); - --radius-lg: var(--radius); - --radius-xl: calc(var(--radius) + 4px); + /* Radius (for rounded-*) */ + --radius-sm: calc(var(--radius) - 4px); + --radius-md: calc(var(--radius) - 2px); + --radius-lg: var(--radius); + --radius-xl: calc(var(--radius) + 4px); - /* Colors */ - --color-background: var(--background); - --color-foreground: var(--foreground); - --color-muted: var(--muted); - --color-muted-foreground: var(--muted-foreground); - --color-popover: var(--popover); - --color-popover-foreground: var(--popover-foreground); - --color-card: var(--card); - --color-card-foreground: var(--card-foreground); - --color-border: var(--border); - --color-input: var(--input); - --color-primary: var(--primary); - --color-primary-foreground: var(--primary-foreground); - --color-secondary: var(--secondary); - --color-secondary-foreground: var(--secondary-foreground); - --color-accent: var(--accent); - --color-accent-foreground: var(--accent-foreground); - --color-destructive: var(--destructive); - --color-destructive-foreground: var(--destructive-foreground); - --color-warning: var(--warning); - --color-warning-foreground: var(--warning-foreground); - --color-ring: var(--ring); - --color-radius: var(--radius); - --color-sidebar-background: var(--sidebar-background); - --color-sidebar-foreground: var(--sidebar-foreground); - --color-sidebar-primary: var(--sidebar-primary); - --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); - --color-sidebar-accent: var(--sidebar-accent); - --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); - --color-sidebar-border: var(--sidebar-border); - --color-sidebar-ring: var(--sidebar-ring); + /* Colors */ + --color-background: var(--background); + --color-foreground: var(--foreground); + --color-muted: var(--muted); + --color-muted-foreground: var(--muted-foreground); + --color-popover: var(--popover); + --color-popover-foreground: var(--popover-foreground); + --color-card: var(--card); + --color-card-foreground: var(--card-foreground); + --color-border: var(--border); + --color-input: var(--input); + --color-primary: var(--primary); + --color-primary-foreground: var(--primary-foreground); + --color-secondary: var(--secondary); + --color-secondary-foreground: var(--secondary-foreground); + --color-accent: var(--accent); + --color-accent-foreground: var(--accent-foreground); + --color-destructive: var(--destructive); + --color-destructive-foreground: var(--destructive-foreground); + --color-warning: var(--warning); + --color-warning-foreground: var(--warning-foreground); + --color-ring: var(--ring); + --color-radius: var(--radius); + --color-sidebar-background: var(--sidebar-background); + --color-sidebar-foreground: var(--sidebar-foreground); + --color-sidebar-primary: var(--sidebar-primary); + --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); + --color-sidebar-accent: var(--sidebar-accent); + --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); + --color-sidebar-border: var(--sidebar-border); + --color-sidebar-ring: var(--sidebar-ring); - /* Animations */ - --animate-accordion-up: accordion-up 0.2s ease-out; - --animate-accordion-down: accordion-down 0.2s ease-out; - --animate-caret-blink: caret-blink 1.25s ease-out infinite; - - /* Font */ - --font-playfair: 'Playfair Display', serif; + /* Font */ + --font-glooock: 'glooock ', serif; } @layer base { - * { - @apply border-border; - } + * { + @apply border-border; + } - body { - @apply bg-background text-foreground; - } + body { + @apply bg-background text-foreground; + } - button { - @apply cursor-pointer; - } - - @font-face { - font-family: 'Playfair Display'; - font-weight: 400; - src: url('/fonts/PlayfairDisplay-Regular.woff') format('woff'); - } - @font-face { - font-family: 'Playfair Display'; - font-weight: 500; - src: url('/fonts/PlayfairDisplay-Medium.woff') format('woff'); - } - @font-face { - font-family: 'Playfair Display'; - font-weight: 600; - src: url('/fonts/PlayfairDisplay-SemiBold.woff') format('woff'); - } - @font-face { - font-family: 'Playfair Display'; - font-weight: 700; - src: url('/fonts/PlayfairDisplay-Bold.woff') format('woff'); - } + button { + @apply cursor-pointer; + } } -@keyframes accordion-down { - from { - height: 0; - } - - to { - height: var(--bits-accordion-content-height); - } -} - -@keyframes accordion-up { - from { - height: var(--bits-accordion-content-height); - } - - to { - height: 0; - } -} - -@keyframes caret-blink { - 0%, - 70%, - 100% { - opacity: 1; - } - - 20%, - 50% { - opacity: 0; - } -} .animate-fade-in { - animation: fadeIn 0.3s ease-out forwards; - opacity: 0; + animation: fadeIn 0.3s ease-out forwards; + opacity: 0; } @keyframes fadeIn { - from { - opacity: 0; - transform: translateY(10px); - } - to { - opacity: 1; - transform: translateY(0); - } + from { + opacity: 0; + transform: translateY(10px); + } + + to { + opacity: 1; + transform: translateY(0); + } } @keyframes bg-zoom { - 0% { - transform: scale(1.3); - } - 100% { - transform: scale(1); - } + 0% { + transform: scale(1.3); + } + + 100% { + transform: scale(1); + } } .animate-bg-zoom { - transform-origin: center; - will-change: transform; - animation: bg-zoom 0.7s cubic-bezier(0.25, 0.1, 0.25, 1) forwards; + transform-origin: center; + will-change: transform; + animation: bg-zoom 0.7s cubic-bezier(0.25, 0.1, 0.25, 1) forwards; } @keyframes delayed-fade { - 0%, - 40% { - opacity: 0; - } - 100% { - opacity: 1; - } + + 0%, + 40% { + opacity: 0; + } + + 100% { + opacity: 1; + } } .animate-delayed-fade { - animation: delayed-fade 0.5s ease-out forwards; -} + animation: delayed-fade 0.5s ease-out forwards; +} \ No newline at end of file diff --git a/frontend/src/lib/components/form/searchable-multi-select.svelte b/frontend/src/lib/components/form/searchable-multi-select.svelte index d2fb24f2..343ab32e 100644 --- a/frontend/src/lib/components/form/searchable-multi-select.svelte +++ b/frontend/src/lib/components/form/searchable-multi-select.svelte @@ -81,18 +81,20 @@ variant="outline" role="combobox" aria-expanded={open} - class="h-auto min-h-10 w-full justify-between" + class="h-auto min-h-10 w-full bg-input/30!" > -
- {#if selectedItems.length > 0} - {#each selectedLabels as label} - {label} - {/each} - {:else} - {m.select_items()} - {/if} +
+
+ {#if selectedItems.length > 0} + {#each selectedLabels as label} + {label} + {/each} + {:else} + {m.select_items()} + {/if} +
+
- {/snippet} diff --git a/frontend/src/lib/components/form/searchable-select.svelte b/frontend/src/lib/components/form/searchable-select.svelte index cfc2301f..1b9dcaa8 100644 --- a/frontend/src/lib/components/form/searchable-select.svelte +++ b/frontend/src/lib/components/form/searchable-select.svelte @@ -70,10 +70,12 @@ role="combobox" aria-expanded={open} {...props} - class={cn('justify-between', restProps.class)} + class={restProps.class} > - {items.find((item) => item.value === value)?.label || selectText} - + + {items.find((item) => item.value === value)?.label || selectText} + + {/snippet} diff --git a/frontend/src/lib/components/header/header.svelte b/frontend/src/lib/components/header/header.svelte index e3b0625a..47d98252 100644 --- a/frontend/src/lib/components/header/header.svelte +++ b/frontend/src/lib/components/header/header.svelte @@ -1,8 +1,9 @@ -
+
{#if !isAuthPage} - + -

- {$appConfigStore.appName} + +

+ {m.settings()}

{/if} diff --git a/frontend/src/lib/components/passkey-row.svelte b/frontend/src/lib/components/passkey-row.svelte index 77dde69c..b5777040 100644 --- a/frontend/src/lib/components/passkey-row.svelte +++ b/frontend/src/lib/components/passkey-row.svelte @@ -23,7 +23,7 @@ - + {#if icon}{@const Icon = icon} {/if} diff --git a/frontend/src/lib/components/qrcode/qrcode.svelte b/frontend/src/lib/components/qrcode/qrcode.svelte index 9b4984a7..868525ad 100644 --- a/frontend/src/lib/components/qrcode/qrcode.svelte +++ b/frontend/src/lib/components/qrcode/qrcode.svelte @@ -9,7 +9,7 @@ value, size = 200, color = '#000000', - backgroundColor = '#FFFFFF', + backgroundColor = 'transparent', ...restProps }: HTMLAttributes & { value: string | null; @@ -39,4 +39,4 @@ }); - + diff --git a/frontend/src/lib/components/signup/signup-token-modal.svelte b/frontend/src/lib/components/signup/signup-token-modal.svelte index 3456f09c..ab1f79fe 100644 --- a/frontend/src/lib/components/signup/signup-token-modal.svelte +++ b/frontend/src/lib/components/signup/signup-token-modal.svelte @@ -187,7 +187,6 @@ value={signupLink} size={180} color={mode.current === 'dark' ? '#FFFFFF' : '#000000'} - backgroundColor={mode.current === 'dark' ? '#000000' : '#FFFFFF'} />

diff --git a/frontend/src/lib/components/table/advanced-table-column-selection.svelte b/frontend/src/lib/components/table/advanced-table-column-selection.svelte index 0fc5d329..c0839476 100644 --- a/frontend/src/lib/components/table/advanced-table-column-selection.svelte +++ b/frontend/src/lib/components/table/advanced-table-column-selection.svelte @@ -16,7 +16,7 @@ class={buttonVariants({ variant: 'outline', size: 'sm', - class: 'ml-auto h-8' + class: 'ml-auto' })} > diff --git a/frontend/src/lib/components/table/advanced-table-filter.svelte b/frontend/src/lib/components/table/advanced-table-filter.svelte index 4e1b5609..57d6c23c 100644 --- a/frontend/src/lib/components/table/advanced-table-filter.svelte +++ b/frontend/src/lib/components/table/advanced-table-filter.svelte @@ -38,11 +38,13 @@ {...props} variant="outline" size="sm" - class="h-8 border-dashed" + class="order-dashed" data-testid={`facet-${title.toLowerCase()}-trigger`} > - - {title} + + + {title} + {#if selectedValues.size > 0} diff --git a/frontend/src/lib/components/table/advanced-table.svelte b/frontend/src/lib/components/table/advanced-table.svelte index 98a393d9..f50aad50 100644 --- a/frontend/src/lib/components/table/advanced-table.svelte +++ b/frontend/src/lib/components/table/advanced-table.svelte @@ -239,7 +239,7 @@ class="h-12 w-full justify-start px-4 font-medium hover:bg-transparent" onclick={() => onSort(column.column)} > - + {column.label} action.onClick(item)} disabled={action.disabled} - class={action.variant === 'danger' - ? 'text-red-500 focus:!text-red-700' - : ''} + class={action.variant === 'danger' ? 'text-red-500!' : ''} > {#if action.icon} {@const Icon = action.icon} diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte index 1f849e51..d15b56c1 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte @@ -1,18 +1,27 @@ diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte index dac534d5..2cea0526 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte @@ -1,18 +1,27 @@ diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte index a9808dae..9da51c6c 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte @@ -1,27 +1,32 @@ - + - + diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte index 4622dec1..0a6a3efe 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte @@ -1,6 +1,6 @@ + +

+ {@render children?.()} +
diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte index 4e1d6fe8..2e676816 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte @@ -1,6 +1,6 @@ + + diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte index 0bc78202..86c4c200 100644 --- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte @@ -1,6 +1,6 @@ diff --git a/frontend/src/lib/components/ui/alert-dialog/alert-dialog.svelte b/frontend/src/lib/components/ui/alert-dialog/alert-dialog.svelte new file mode 100644 index 00000000..7ea78bb4 --- /dev/null +++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/alert-dialog/index.ts b/frontend/src/lib/components/ui/alert-dialog/index.ts index bc8e9709..ca81c2a9 100644 --- a/frontend/src/lib/components/ui/alert-dialog/index.ts +++ b/frontend/src/lib/components/ui/alert-dialog/index.ts @@ -1,36 +1,40 @@ -import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'; -import Trigger from './alert-dialog-trigger.svelte'; -import Title from './alert-dialog-title.svelte'; -import Action from './alert-dialog-action.svelte'; -import Cancel from './alert-dialog-cancel.svelte'; -import Footer from './alert-dialog-footer.svelte'; -import Header from './alert-dialog-header.svelte'; -import Overlay from './alert-dialog-overlay.svelte'; -import Content from './alert-dialog-content.svelte'; -import Description from './alert-dialog-description.svelte'; - -const Root = AlertDialogPrimitive.Root; +import Root from "./alert-dialog.svelte"; +import Portal from "./alert-dialog-portal.svelte"; +import Trigger from "./alert-dialog-trigger.svelte"; +import Title from "./alert-dialog-title.svelte"; +import Action from "./alert-dialog-action.svelte"; +import Cancel from "./alert-dialog-cancel.svelte"; +import Footer from "./alert-dialog-footer.svelte"; +import Header from "./alert-dialog-header.svelte"; +import Overlay from "./alert-dialog-overlay.svelte"; +import Content from "./alert-dialog-content.svelte"; +import Description from "./alert-dialog-description.svelte"; +import Media from "./alert-dialog-media.svelte"; export { Root, Title, Action, Cancel, + Portal, Footer, Header, Trigger, Overlay, Content, Description, + Media, // Root as AlertDialog, Title as AlertDialogTitle, Action as AlertDialogAction, Cancel as AlertDialogCancel, + Portal as AlertDialogPortal, Footer as AlertDialogFooter, Header as AlertDialogHeader, Trigger as AlertDialogTrigger, Overlay as AlertDialogOverlay, Content as AlertDialogContent, - Description as AlertDialogDescription + Description as AlertDialogDescription, + Media as AlertDialogMedia, }; diff --git a/frontend/src/lib/components/ui/alert/alert.svelte b/frontend/src/lib/components/ui/alert/alert.svelte index 09e6d8ac..c09ed4ac 100644 --- a/frontend/src/lib/components/ui/alert/alert.svelte +++ b/frontend/src/lib/components/ui/alert/alert.svelte @@ -2,7 +2,7 @@ import { tv, type VariantProps } from 'tailwind-variants'; export const alertVariants = tv({ - base: 'relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current', + base: 'relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-3xl border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current', variants: { variant: { default: 'bg-card text-card-foreground', diff --git a/frontend/src/lib/components/ui/badge/badge.svelte b/frontend/src/lib/components/ui/badge/badge.svelte index d9e34464..2bf5110c 100644 --- a/frontend/src/lib/components/ui/badge/badge.svelte +++ b/frontend/src/lib/components/ui/badge/badge.svelte @@ -1,35 +1,35 @@ - {#if isLoading} - - {/if} {@render children?.()} {:else} @@ -111,9 +110,15 @@ onclick={handleOnClick} {...restProps} > - {#if isLoading} - - {/if} - {@render children?.()} + + + {@render children?.()} + {/if} diff --git a/frontend/src/lib/components/ui/button/index.ts b/frontend/src/lib/components/ui/button/index.ts index 5414d9d3..fb585d76 100644 --- a/frontend/src/lib/components/ui/button/index.ts +++ b/frontend/src/lib/components/ui/button/index.ts @@ -2,8 +2,8 @@ import Root, { type ButtonProps, type ButtonSize, type ButtonVariant, - buttonVariants -} from './button.svelte'; + buttonVariants, +} from "./button.svelte"; export { Root, @@ -13,5 +13,5 @@ export { buttonVariants, type ButtonProps, type ButtonSize, - type ButtonVariant + type ButtonVariant, }; diff --git a/frontend/src/lib/components/ui/card/card.svelte b/frontend/src/lib/components/ui/card/card.svelte index 23f876d6..536744ca 100644 --- a/frontend/src/lib/components/ui/card/card.svelte +++ b/frontend/src/lib/components/ui/card/card.svelte @@ -14,7 +14,7 @@ bind:this={ref} data-slot="card" class={cn( - 'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm', + 'bg-card text-card-foreground flex flex-col gap-6 rounded-4xl border py-6 shadow-sm', className )} {...restProps} diff --git a/frontend/src/lib/components/ui/dialog/dialog-content.svelte b/frontend/src/lib/components/ui/dialog/dialog-content.svelte index b4aba473..4dce737b 100644 --- a/frontend/src/lib/components/ui/dialog/dialog-content.svelte +++ b/frontend/src/lib/components/ui/dialog/dialog-content.svelte @@ -23,14 +23,14 @@ bind:ref data-slot="dialog-content" class={cn( - 'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg', + 'bg-popover data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-4xl border p-6 shadow-lg duration-200 sm:max-w-lg', className )} {...restProps} > {@render children?.()} Close diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte new file mode 100644 index 00000000..e0e19718 --- /dev/null +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte @@ -0,0 +1,16 @@ + + + diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte index 74e21bb8..42dbfe76 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte @@ -1,9 +1,9 @@ - + - + diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte index 231aee49..bcaaeefd 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte @@ -1,7 +1,7 @@ diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte index 204a67d0..85b1e36b 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte @@ -1,16 +1,16 @@ @@ -20,7 +20,7 @@ data-inset={inset} data-variant={variant} class={cn( - "data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-[variant=destructive]:data-highlighted:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", + "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-2 py-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 group/dropdown-menu-item relative flex cursor-pointer items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0", className )} {...restProps} diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte index fe2ef4a7..9026affc 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte @@ -1,6 +1,6 @@ + + diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte index 3e987491..189aef40 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte @@ -1,5 +1,5 @@ + + diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-trigger.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-trigger.svelte index 032b6453..cb053444 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-trigger.svelte +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-trigger.svelte @@ -1,5 +1,5 @@ diff --git a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu.svelte b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu.svelte new file mode 100644 index 00000000..cb4bc621 --- /dev/null +++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/dropdown-menu/index.ts b/frontend/src/lib/components/ui/dropdown-menu/index.ts index aeb398e0..7850c6a3 100644 --- a/frontend/src/lib/components/ui/dropdown-menu/index.ts +++ b/frontend/src/lib/components/ui/dropdown-menu/index.ts @@ -1,26 +1,31 @@ -import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui'; -import CheckboxItem from './dropdown-menu-checkbox-item.svelte'; -import Content from './dropdown-menu-content.svelte'; -import Group from './dropdown-menu-group.svelte'; -import Item from './dropdown-menu-item.svelte'; -import Label from './dropdown-menu-label.svelte'; -import RadioGroup from './dropdown-menu-radio-group.svelte'; -import RadioItem from './dropdown-menu-radio-item.svelte'; -import Separator from './dropdown-menu-separator.svelte'; -import Shortcut from './dropdown-menu-shortcut.svelte'; -import Trigger from './dropdown-menu-trigger.svelte'; -import SubContent from './dropdown-menu-sub-content.svelte'; -import SubTrigger from './dropdown-menu-sub-trigger.svelte'; -import GroupHeading from './dropdown-menu-group-heading.svelte'; -const Sub = DropdownMenuPrimitive.Sub; -const Root = DropdownMenuPrimitive.Root; +import Root from "./dropdown-menu.svelte"; +import Sub from "./dropdown-menu-sub.svelte"; +import CheckboxGroup from "./dropdown-menu-checkbox-group.svelte"; +import CheckboxItem from "./dropdown-menu-checkbox-item.svelte"; +import Content from "./dropdown-menu-content.svelte"; +import Group from "./dropdown-menu-group.svelte"; +import Item from "./dropdown-menu-item.svelte"; +import Label from "./dropdown-menu-label.svelte"; +import RadioGroup from "./dropdown-menu-radio-group.svelte"; +import RadioItem from "./dropdown-menu-radio-item.svelte"; +import Separator from "./dropdown-menu-separator.svelte"; +import Shortcut from "./dropdown-menu-shortcut.svelte"; +import Trigger from "./dropdown-menu-trigger.svelte"; +import SubContent from "./dropdown-menu-sub-content.svelte"; +import SubTrigger from "./dropdown-menu-sub-trigger.svelte"; +import GroupHeading from "./dropdown-menu-group-heading.svelte"; +import Portal from "./dropdown-menu-portal.svelte"; export { + CheckboxGroup, CheckboxItem, Content, + Portal, Root as DropdownMenu, + CheckboxGroup as DropdownMenuCheckboxGroup, CheckboxItem as DropdownMenuCheckboxItem, Content as DropdownMenuContent, + Portal as DropdownMenuPortal, Group as DropdownMenuGroup, Item as DropdownMenuItem, Label as DropdownMenuLabel, @@ -45,5 +50,5 @@ export { Sub, SubContent, SubTrigger, - Trigger + Trigger, }; diff --git a/frontend/src/lib/components/ui/input/input.svelte b/frontend/src/lib/components/ui/input/input.svelte index 8f865f96..e92db9e7 100644 --- a/frontend/src/lib/components/ui/input/input.svelte +++ b/frontend/src/lib/components/ui/input/input.svelte @@ -24,7 +24,7 @@ bind:this={ref} data-slot="input" class={cn( - 'selection:bg-primary dark:bg-input/30 selection:text-primary-foreground border-input ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-2 text-base font-medium shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', + 'selection:bg-primary dark:bg-input/30 selection:text-primary-foreground border-input ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-full border bg-transparent px-3 py-2 text-base font-medium shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive', className @@ -39,7 +39,7 @@ bind:this={ref} data-slot="input" class={cn( - 'border-input bg-background selection:bg-primary dark:bg-input/30 selection:text-primary-foreground ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-md border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', + 'border-input bg-background selection:bg-primary dark:bg-input/30 selection:text-primary-foreground ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-full border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive', className diff --git a/frontend/src/lib/components/ui/item/item.svelte b/frontend/src/lib/components/ui/item/item.svelte index 4839643e..8f0f4e76 100644 --- a/frontend/src/lib/components/ui/item/item.svelte +++ b/frontend/src/lib/components/ui/item/item.svelte @@ -2,7 +2,7 @@ import { tv, type VariantProps } from 'tailwind-variants'; export const itemVariants = tv({ - base: 'group/item focus-visible:border-ring focus-visible:ring-ring/50 flex flex-wrap items-center rounded-xl border border-transparent text-sm outline-none transition-colors duration-100 focus-visible:ring-[3px]', + base: 'group/item focus-visible:border-ring focus-visible:ring-ring/50 flex flex-wrap items-center rounded-4xl border border-transparent text-sm outline-none transition-colors duration-100 focus-visible:ring-[3px]', variants: { variant: { default: 'bg-transparent [a&]:hover:bg-accent/50 [a&]:transition-colors', @@ -12,8 +12,8 @@ transparent: 'bg-transparent' }, size: { - default: 'gap-4 p-4', - sm: 'gap-2.5 px-4 py-3' + default: 'gap-4 p-6', + sm: 'gap-2.5 px-4 py-4' } }, defaultVariants: { diff --git a/frontend/src/lib/components/ui/popover/index.ts b/frontend/src/lib/components/ui/popover/index.ts index 0dcc3ccb..5f180363 100644 --- a/frontend/src/lib/components/ui/popover/index.ts +++ b/frontend/src/lib/components/ui/popover/index.ts @@ -1,17 +1,28 @@ -import { Popover as PopoverPrimitive } from 'bits-ui'; -import Content from './popover-content.svelte'; -import Trigger from './popover-trigger.svelte'; -const Root = PopoverPrimitive.Root; -const Close = PopoverPrimitive.Close; +import Root from "./popover.svelte"; +import Close from "./popover-close.svelte"; +import Content from "./popover-content.svelte"; +import Description from "./popover-description.svelte"; +import Header from "./popover-header.svelte"; +import Title from "./popover-title.svelte"; +import Trigger from "./popover-trigger.svelte"; +import Portal from "./popover-portal.svelte"; export { Root, Content, + Description, + Header, + Title, Trigger, Close, + Portal, // Root as Popover, Content as PopoverContent, + Description as PopoverDescription, + Header as PopoverHeader, + Title as PopoverTitle, Trigger as PopoverTrigger, - Close as PopoverClose + Close as PopoverClose, + Portal as PopoverPortal, }; diff --git a/frontend/src/lib/components/ui/popover/popover-close.svelte b/frontend/src/lib/components/ui/popover/popover-close.svelte new file mode 100644 index 00000000..c360925a --- /dev/null +++ b/frontend/src/lib/components/ui/popover/popover-close.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/popover/popover-content.svelte b/frontend/src/lib/components/ui/popover/popover-content.svelte index 95e209a5..58ef2c5d 100644 --- a/frontend/src/lib/components/ui/popover/popover-content.svelte +++ b/frontend/src/lib/components/ui/popover/popover-content.svelte @@ -1,6 +1,8 @@ - + - + diff --git a/frontend/src/lib/components/ui/popover/popover-description.svelte b/frontend/src/lib/components/ui/popover/popover-description.svelte new file mode 100644 index 00000000..ac020ba6 --- /dev/null +++ b/frontend/src/lib/components/ui/popover/popover-description.svelte @@ -0,0 +1,20 @@ + + +
+ {@render children?.()} +
diff --git a/frontend/src/lib/components/ui/popover/popover-header.svelte b/frontend/src/lib/components/ui/popover/popover-header.svelte new file mode 100644 index 00000000..9fa77f74 --- /dev/null +++ b/frontend/src/lib/components/ui/popover/popover-header.svelte @@ -0,0 +1,20 @@ + + +
+ {@render children?.()} +
diff --git a/frontend/src/lib/components/ui/popover/popover-portal.svelte b/frontend/src/lib/components/ui/popover/popover-portal.svelte new file mode 100644 index 00000000..dd8265fe --- /dev/null +++ b/frontend/src/lib/components/ui/popover/popover-portal.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/popover/popover-title.svelte b/frontend/src/lib/components/ui/popover/popover-title.svelte new file mode 100644 index 00000000..f7e1bb83 --- /dev/null +++ b/frontend/src/lib/components/ui/popover/popover-title.svelte @@ -0,0 +1,20 @@ + + +
+ {@render children?.()} +
diff --git a/frontend/src/lib/components/ui/popover/popover-trigger.svelte b/frontend/src/lib/components/ui/popover/popover-trigger.svelte index dfe6b884..942bf300 100644 --- a/frontend/src/lib/components/ui/popover/popover-trigger.svelte +++ b/frontend/src/lib/components/ui/popover/popover-trigger.svelte @@ -1,6 +1,6 @@ + + diff --git a/frontend/src/lib/components/ui/select/index.ts b/frontend/src/lib/components/ui/select/index.ts index e6acdf8e..4dec358b 100644 --- a/frontend/src/lib/components/ui/select/index.ts +++ b/frontend/src/lib/components/ui/select/index.ts @@ -1,15 +1,14 @@ -import { Select as SelectPrimitive } from 'bits-ui'; - -import Group from './select-group.svelte'; -import Label from './select-label.svelte'; -import Item from './select-item.svelte'; -import Content from './select-content.svelte'; -import Trigger from './select-trigger.svelte'; -import Separator from './select-separator.svelte'; -import ScrollDownButton from './select-scroll-down-button.svelte'; -import ScrollUpButton from './select-scroll-up-button.svelte'; - -const Root = SelectPrimitive.Root; +import Root from "./select.svelte"; +import Group from "./select-group.svelte"; +import Label from "./select-label.svelte"; +import Item from "./select-item.svelte"; +import Content from "./select-content.svelte"; +import Trigger from "./select-trigger.svelte"; +import Separator from "./select-separator.svelte"; +import ScrollDownButton from "./select-scroll-down-button.svelte"; +import ScrollUpButton from "./select-scroll-up-button.svelte"; +import GroupHeading from "./select-group-heading.svelte"; +import Portal from "./select-portal.svelte"; export { Root, @@ -21,6 +20,8 @@ export { Separator, ScrollDownButton, ScrollUpButton, + GroupHeading, + Portal, // Root as Select, Group as SelectGroup, @@ -30,5 +31,7 @@ export { Trigger as SelectTrigger, Separator as SelectSeparator, ScrollDownButton as SelectScrollDownButton, - ScrollUpButton as SelectScrollUpButton + ScrollUpButton as SelectScrollUpButton, + GroupHeading as SelectGroupHeading, + Portal as SelectPortal, }; diff --git a/frontend/src/lib/components/ui/select/select-content.svelte b/frontend/src/lib/components/ui/select/select-content.svelte index 9450e3be..edb50d06 100644 --- a/frontend/src/lib/components/ui/select/select-content.svelte +++ b/frontend/src/lib/components/ui/select/select-content.svelte @@ -1,8 +1,11 @@ - + {@render children?.()} - + diff --git a/frontend/src/lib/components/ui/select/select-group-heading.svelte b/frontend/src/lib/components/ui/select/select-group-heading.svelte new file mode 100644 index 00000000..c9a51e96 --- /dev/null +++ b/frontend/src/lib/components/ui/select/select-group-heading.svelte @@ -0,0 +1,21 @@ + + + + {@render children?.()} + diff --git a/frontend/src/lib/components/ui/select/select-group.svelte b/frontend/src/lib/components/ui/select/select-group.svelte index 2520795d..c5de8f1f 100644 --- a/frontend/src/lib/components/ui/select/select-group.svelte +++ b/frontend/src/lib/components/ui/select/select-group.svelte @@ -1,7 +1,17 @@ - + diff --git a/frontend/src/lib/components/ui/select/select-item.svelte b/frontend/src/lib/components/ui/select/select-item.svelte index 4bf38167..9819d262 100644 --- a/frontend/src/lib/components/ui/select/select-item.svelte +++ b/frontend/src/lib/components/ui/select/select-item.svelte @@ -1,7 +1,7 @@ + + diff --git a/frontend/src/lib/components/ui/select/select-scroll-down-button.svelte b/frontend/src/lib/components/ui/select/select-scroll-down-button.svelte index 7ede728a..a382087a 100644 --- a/frontend/src/lib/components/ui/select/select-scroll-down-button.svelte +++ b/frontend/src/lib/components/ui/select/select-scroll-down-button.svelte @@ -1,7 +1,7 @@ @@ -19,11 +19,11 @@ data-slot="select-trigger" data-size={size} class={cn( - "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", + "border-input data-placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 gap-1.5 rounded-full border bg-transparent py-2 px-4 text-sm transition-colors select-none focus-visible:ring-3 aria-invalid:ring-3 data-[size=default]:h-9 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:flex *:data-[slot=select-value]:gap-1.5 [&_svg:not([class*='size-'])]:size-4 flex w-fit items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0", className )} {...restProps} > {@render children?.()} - + diff --git a/frontend/src/lib/components/ui/select/select.svelte b/frontend/src/lib/components/ui/select/select.svelte new file mode 100644 index 00000000..05eb6634 --- /dev/null +++ b/frontend/src/lib/components/ui/select/select.svelte @@ -0,0 +1,11 @@ + + + diff --git a/frontend/src/lib/components/ui/separator/index.ts b/frontend/src/lib/components/ui/separator/index.ts index 768efac9..82442d2c 100644 --- a/frontend/src/lib/components/ui/separator/index.ts +++ b/frontend/src/lib/components/ui/separator/index.ts @@ -1,7 +1,7 @@ -import Root from './separator.svelte'; +import Root from "./separator.svelte"; export { Root, // - Root as Separator + Root as Separator, }; diff --git a/frontend/src/lib/components/ui/separator/separator.svelte b/frontend/src/lib/components/ui/separator/separator.svelte index 9e2570b2..9a40e6a0 100644 --- a/frontend/src/lib/components/ui/separator/separator.svelte +++ b/frontend/src/lib/components/ui/separator/separator.svelte @@ -1,19 +1,22 @@ diff --git a/frontend/src/lib/components/ui/tabs/index.ts b/frontend/src/lib/components/ui/tabs/index.ts index d2a7939e..31267e58 100644 --- a/frontend/src/lib/components/ui/tabs/index.ts +++ b/frontend/src/lib/components/ui/tabs/index.ts @@ -1,16 +1,18 @@ -import Root from './tabs.svelte'; -import Content from './tabs-content.svelte'; -import List from './tabs-list.svelte'; -import Trigger from './tabs-trigger.svelte'; +import Root from "./tabs.svelte"; +import Content from "./tabs-content.svelte"; +import List, { tabsListVariants, type TabsListVariant } from "./tabs-list.svelte"; +import Trigger from "./tabs-trigger.svelte"; export { Root, Content, List, Trigger, + tabsListVariants, + type TabsListVariant, // Root as Tabs, Content as TabsContent, List as TabsList, - Trigger as TabsTrigger + Trigger as TabsTrigger, }; diff --git a/frontend/src/lib/components/ui/tabs/tabs-content.svelte b/frontend/src/lib/components/ui/tabs/tabs-content.svelte index 35e44f66..344d2d58 100644 --- a/frontend/src/lib/components/ui/tabs/tabs-content.svelte +++ b/frontend/src/lib/components/ui/tabs/tabs-content.svelte @@ -1,6 +1,6 @@ + + diff --git a/frontend/src/lib/components/ui/tabs/tabs-trigger.svelte b/frontend/src/lib/components/ui/tabs/tabs-trigger.svelte index 3766b0ad..4617aa26 100644 --- a/frontend/src/lib/components/ui/tabs/tabs-trigger.svelte +++ b/frontend/src/lib/components/ui/tabs/tabs-trigger.svelte @@ -1,6 +1,6 @@ - + - + diff --git a/frontend/src/lib/components/ui/tooltip/tooltip-portal.svelte b/frontend/src/lib/components/ui/tooltip/tooltip-portal.svelte new file mode 100644 index 00000000..d234f7d7 --- /dev/null +++ b/frontend/src/lib/components/ui/tooltip/tooltip-portal.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/tooltip/tooltip-provider.svelte b/frontend/src/lib/components/ui/tooltip/tooltip-provider.svelte new file mode 100644 index 00000000..6dba9a67 --- /dev/null +++ b/frontend/src/lib/components/ui/tooltip/tooltip-provider.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/ui/tooltip/tooltip-trigger.svelte b/frontend/src/lib/components/ui/tooltip/tooltip-trigger.svelte index 5631d1b4..1acdaa47 100644 --- a/frontend/src/lib/components/ui/tooltip/tooltip-trigger.svelte +++ b/frontend/src/lib/components/ui/tooltip/tooltip-trigger.svelte @@ -1,5 +1,5 @@ diff --git a/frontend/src/lib/components/ui/tooltip/tooltip.svelte b/frontend/src/lib/components/ui/tooltip/tooltip.svelte new file mode 100644 index 00000000..0b0f9cef --- /dev/null +++ b/frontend/src/lib/components/ui/tooltip/tooltip.svelte @@ -0,0 +1,7 @@ + + + diff --git a/frontend/src/lib/components/web-authn-unsupported.svelte b/frontend/src/lib/components/web-authn-unsupported.svelte index 5bdc97d1..bec0709d 100644 --- a/frontend/src/lib/components/web-authn-unsupported.svelte +++ b/frontend/src/lib/components/web-authn-unsupported.svelte @@ -7,7 +7,7 @@
-

{m.browser_unsupported()}

+

{m.browser_unsupported()}

{m.this_browser_does_not_support_passkeys()}

diff --git a/frontend/src/routes/authorize/+page.svelte b/frontend/src/routes/authorize/+page.svelte index 0425630a..af79cd69 100644 --- a/frontend/src/routes/authorize/+page.svelte +++ b/frontend/src/routes/authorize/+page.svelte @@ -265,7 +265,7 @@ {:else} -

+

{m.sign_in_to({ name: client.name })}

{#if errorMessage} diff --git a/frontend/src/routes/device/+page.svelte b/frontend/src/routes/device/+page.svelte index 72b955de..bdc6d377 100644 --- a/frontend/src/routes/device/+page.svelte +++ b/frontend/src/routes/device/+page.svelte @@ -79,7 +79,7 @@ {/if}

-

{m.authorize_device()}

+

{m.authorize_device()}

{#if errorMessage}

{errorMessage}. {m.please_try_again()} diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte index 597cc791..0daedab0 100644 --- a/frontend/src/routes/login/+page.svelte +++ b/frontend/src/routes/login/+page.svelte @@ -44,7 +44,7 @@

-

+

{m.sign_in_to_appname({ appName: $appConfigStore.appName })}

{#if error} diff --git a/frontend/src/routes/login/alternative/+page.svelte b/frontend/src/routes/login/alternative/+page.svelte index 033db476..704dc3a3 100644 --- a/frontend/src/routes/login/alternative/+page.svelte +++ b/frontend/src/routes/login/alternative/+page.svelte @@ -35,7 +35,7 @@
-

{m.alternative_sign_in()}

+

{m.alternative_sign_in()}

{m.if_you_do_not_have_access_to_your_passkey_you_can_sign_in_using_one_of_the_following_methods()}

diff --git a/frontend/src/routes/login/alternative/code/+page.svelte b/frontend/src/routes/login/alternative/code/+page.svelte index aa3236e9..59e4bfc9 100644 --- a/frontend/src/routes/login/alternative/code/+page.svelte +++ b/frontend/src/routes/login/alternative/code/+page.svelte @@ -59,7 +59,7 @@
-

{m.login_code()}

+

{m.login_code()}

{#if error}

{error}. {m.please_try_again()} diff --git a/frontend/src/routes/login/alternative/email/+page.svelte b/frontend/src/routes/login/alternative/email/+page.svelte index 3cef4135..e1718fcd 100644 --- a/frontend/src/routes/login/alternative/email/+page.svelte +++ b/frontend/src/routes/login/alternative/email/+page.svelte @@ -5,9 +5,9 @@ import Input from '$lib/components/ui/input/input.svelte'; import { m } from '$lib/paraglide/messages'; import UserService from '$lib/services/user-service'; + import { preventDefault } from '$lib/utils/event-util'; import { fade } from 'svelte/transition'; import LoginLogoErrorSuccessIndicator from '../../components/login-logo-error-success-indicator.svelte'; - import { preventDefault } from '$lib/utils/event-util'; const { data } = $props(); @@ -37,7 +37,7 @@

-

{m.email_login()}

+

{m.email_login()}

{#if error}

{error}. {m.please_try_again()} diff --git a/frontend/src/routes/logout/+page.svelte b/frontend/src/routes/logout/+page.svelte index d8792831..b95d2c0b 100644 --- a/frontend/src/routes/logout/+page.svelte +++ b/frontend/src/routes/logout/+page.svelte @@ -34,7 +34,7 @@

-

{m.sign_out()}

+

{m.sign_out()}

-
-

- - {m.settings()} -

-
-
-
+
{@render children()} diff --git a/frontend/src/routes/settings/account/+page.svelte b/frontend/src/routes/settings/account/+page.svelte index 4c3b91a0..6889a998 100644 --- a/frontend/src/routes/settings/account/+page.svelte +++ b/frontend/src/routes/settings/account/+page.svelte @@ -141,7 +141,7 @@ - + diff --git a/frontend/src/routes/settings/account/login-code-modal.svelte b/frontend/src/routes/settings/account/login-code-modal.svelte index 709a047a..20437492 100644 --- a/frontend/src/routes/settings/account/login-code-modal.svelte +++ b/frontend/src/routes/settings/account/login-code-modal.svelte @@ -64,7 +64,6 @@ value={loginCodeLink} size={150} color={mode.current === 'dark' ? '#FFFFFF' : '#000000'} - backgroundColor={mode.current === 'dark' ? '#000000' : '#FFFFFF'} />

{loginCodeLink!}

diff --git a/frontend/src/routes/settings/admin/oidc-clients/oidc-client-preview-modal.svelte b/frontend/src/routes/settings/admin/oidc-clients/oidc-client-preview-modal.svelte index f888a281..b3bdc1c3 100644 --- a/frontend/src/routes/settings/admin/oidc-clients/oidc-client-preview-modal.svelte +++ b/frontend/src/routes/settings/admin/oidc-clients/oidc-client-preview-modal.svelte @@ -115,7 +115,7 @@
{/if} -
+
{m.users()} - + diff --git a/frontend/src/routes/signup/+page.svelte b/frontend/src/routes/signup/+page.svelte index 41747516..094fcc3b 100644 --- a/frontend/src/routes/signup/+page.svelte +++ b/frontend/src/routes/signup/+page.svelte @@ -61,7 +61,7 @@
-

+

{m.signup_to_appname({ appName: $appConfigStore.appName })}

diff --git a/frontend/src/routes/signup/add-passkey/+page.svelte b/frontend/src/routes/signup/add-passkey/+page.svelte index d30f7d43..f8369169 100644 --- a/frontend/src/routes/signup/add-passkey/+page.svelte +++ b/frontend/src/routes/signup/add-passkey/+page.svelte @@ -69,7 +69,7 @@
-

+

{m.setup_your_passkey()}

diff --git a/frontend/src/routes/signup/setup/+page.svelte b/frontend/src/routes/signup/setup/+page.svelte index 78c16739..fb9bc1d5 100644 --- a/frontend/src/routes/signup/setup/+page.svelte +++ b/frontend/src/routes/signup/setup/+page.svelte @@ -47,7 +47,7 @@

-

+

{m.signup_to_appname({ appName: $appConfigStore.appName })}

diff --git a/frontend/static/fonts/PlayfairDisplay-Bold.woff b/frontend/static/fonts/PlayfairDisplay-Bold.woff deleted file mode 100644 index 3e4f6da7..00000000 Binary files a/frontend/static/fonts/PlayfairDisplay-Bold.woff and /dev/null differ diff --git a/frontend/static/fonts/PlayfairDisplay-ExtraBold.woff b/frontend/static/fonts/PlayfairDisplay-ExtraBold.woff deleted file mode 100644 index a42fd641..00000000 Binary files a/frontend/static/fonts/PlayfairDisplay-ExtraBold.woff and /dev/null differ diff --git a/frontend/static/fonts/PlayfairDisplay-Medium.woff b/frontend/static/fonts/PlayfairDisplay-Medium.woff deleted file mode 100644 index 8c11b8d5..00000000 Binary files a/frontend/static/fonts/PlayfairDisplay-Medium.woff and /dev/null differ diff --git a/frontend/static/fonts/PlayfairDisplay-Regular.woff b/frontend/static/fonts/PlayfairDisplay-Regular.woff deleted file mode 100644 index 688623bc..00000000 Binary files a/frontend/static/fonts/PlayfairDisplay-Regular.woff and /dev/null differ diff --git a/frontend/static/fonts/PlayfairDisplay-SemiBold.woff b/frontend/static/fonts/PlayfairDisplay-SemiBold.woff deleted file mode 100644 index 76a30f32..00000000 Binary files a/frontend/static/fonts/PlayfairDisplay-SemiBold.woff and /dev/null differ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 244fc94a..9b565ee9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -61,6 +61,9 @@ importers: frontend: dependencies: + '@fontsource/gloock': + specifier: ^5.2.8 + version: 5.2.8 '@simplewebauthn/browser': specifier: ^13.3.0 version: 13.3.0 @@ -633,6 +636,9 @@ packages: '@floating-ui/utils@0.2.11': resolution: {integrity: sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==} + '@fontsource/gloock@5.2.8': + resolution: {integrity: sha512-2qh1h3uC8bY93r2zuX3a0Q2IoGUf4vc1qxM0DUqoNVxwqDkXIOhGS7/0EEYNBLfSWO7ABfi/qkVmzedkj2jSZA==} + '@hapi/hoek@9.3.0': resolution: {integrity: sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==} @@ -3583,6 +3589,8 @@ snapshots: '@floating-ui/utils@0.2.11': {} + '@fontsource/gloock@5.2.8': {} + '@hapi/hoek@9.3.0': optional: true diff --git a/tests/resources/export/uploads/profile-pictures/defaults/CF.png b/tests/resources/export/uploads/profile-pictures/defaults/CF.png index 7c399f55..b608b8f7 100644 Binary files a/tests/resources/export/uploads/profile-pictures/defaults/CF.png and b/tests/resources/export/uploads/profile-pictures/defaults/CF.png differ diff --git a/tests/resources/export/uploads/profile-pictures/defaults/TC.png b/tests/resources/export/uploads/profile-pictures/defaults/TC.png index b8192304..316c10b3 100644 Binary files a/tests/resources/export/uploads/profile-pictures/defaults/TC.png and b/tests/resources/export/uploads/profile-pictures/defaults/TC.png differ diff --git a/tests/specs/application-configuration.spec.ts b/tests/specs/application-configuration.spec.ts index 87e8979d..f9dfed8e 100644 --- a/tests/specs/application-configuration.spec.ts +++ b/tests/specs/application-configuration.spec.ts @@ -18,14 +18,13 @@ test('Update general configuration', async ({ page }) => { await expect(page.locator('[data-type="success"]')).toHaveText( 'Application configuration updated successfully' ); - await expect(page.getByTestId('application-name')).toHaveText('Updated Name'); await page.reload(); await expect(page.getByLabel('Application Name', { exact: true })).toHaveValue('Updated Name'); await expect(page.getByLabel('Session Duration')).toHaveValue('30'); - await page.getByRole('link', { name: 'Logo Updated Name' }).click(); + await page.getByRole('link', { name: 'Logo' }).click(); await page.waitForURL('/settings/apps'); });