diff --git a/frontend/src/lib/components/home/HomeComposerSkeleton.svelte b/frontend/src/lib/components/home/HomeComposerSkeleton.svelte index fee8991894..cd81077342 100644 --- a/frontend/src/lib/components/home/HomeComposerSkeleton.svelte +++ b/frontend/src/lib/components/home/HomeComposerSkeleton.svelte @@ -4,11 +4,13 @@ const HEIGHT_SETTING = 'home-composer-height:' // The box's 4px top margin and the 8px under the block. const BLOCK_MARGINS = 12 - const ONE_LINE_HEIGHT = 48 + BLOCK_MARGINS // The suggestion chips' row under an open box. A disabled composer has none, and its box, // the shortest open one, is 78px. const SUGGESTIONS_ROW = 36 const OPEN_BOX_MIN = 78 + // The one-line box is 48px in Chromium but taller in Firefox, so the shape is told apart by + // the shortest open block: anything below it is one line, whatever the browser. + const OPEN_MIN_HEIGHT = OPEN_BOX_MIN + BLOCK_MARGINS /** The height Home's composer took when it last appeared in this workspace. */ export function composerHeight(workspace: string | undefined): number | undefined { @@ -37,7 +39,7 @@ // handful of items rests in. let { height }: { height?: number } = $props() - const open = $derived(height !== undefined && height > ONE_LINE_HEIGHT) + const open = $derived(height !== undefined && height >= OPEN_MIN_HEIGHT) const suggestions = $derived(open && height! - BLOCK_MARGINS - SUGGESTIONS_ROW >= OPEN_BOX_MIN) const boxClass = twMerge(composerBoxClass(), HERO_BOX_CLASS) @@ -52,7 +54,7 @@
@@ -86,7 +88,11 @@
{/if} {:else} -
+