diff --git a/apps/mana/apps/web/src/lib/components/PickerOverlay.svelte b/apps/mana/apps/web/src/lib/components/PickerOverlay.svelte index f0c306f85..b33f0d620 100644 --- a/apps/mana/apps/web/src/lib/components/PickerOverlay.svelte +++ b/apps/mana/apps/web/src/lib/components/PickerOverlay.svelte @@ -75,13 +75,14 @@ min-height: 60vh; max-height: 80vh; background: hsl(var(--color-card)); - border-radius: 0.375rem; + border-radius: 1.25rem; box-shadow: - 0 2px 8px rgba(0, 0, 0, 0.08), - 0 0 0 1px rgba(0, 0, 0, 0.04); + 0 2px 8px hsl(0 0% 0% / 0.08), + 0 0 0 1px hsl(var(--color-border)); display: flex; flex-direction: column; animation: slideIn 0.25s ease-out; + overflow: hidden; } @keyframes slideIn { from { diff --git a/apps/mana/apps/web/src/lib/components/workbench/AppPagePicker.svelte b/apps/mana/apps/web/src/lib/components/workbench/AppPagePicker.svelte index a22e7d4fb..110f97750 100644 --- a/apps/mana/apps/web/src/lib/components/workbench/AppPagePicker.svelte +++ b/apps/mana/apps/web/src/lib/components/workbench/AppPagePicker.svelte @@ -78,7 +78,12 @@ {/snippet} {#snippet item(app)} {/snippet} @@ -111,18 +116,21 @@ color: hsl(var(--color-muted-foreground)); } - :global(.picker .app-dot) { - width: 10px; - height: 10px; - border-radius: 9999px; + :global(.picker .app-icon-wrap) { + display: flex; + align-items: center; + justify-content: center; + width: 22px; + height: 22px; flex-shrink: 0; + color: hsl(var(--color-muted-foreground)); + } + :global(.picker .picker-option:hover .app-icon-wrap) { + color: hsl(var(--color-foreground)); } :global(.picker .app-name) { font-size: 0.875rem; font-weight: 500; - color: #374151; - } - :global(.dark .picker .app-name) { - color: #f3f4f6; + color: hsl(var(--color-foreground)); }