Floating Action Button

What This Sidekick Query Does

Build a floating action button (FAB) section for my Shopify theme that displays a fixed circular button in the [FAB_POSITION] corner of the viewport. When clicked, the FAB should expand to reveal a vertical stack of up to [MAX_ACTIONS] smaller action buttons, each configured via section blocks. Each action block should include an icon choice from a select dropdown with options such as chat, email, phone, whatsapp, and custom-url, a label text [ACTION_LABEL], a target URL or action [ACTION_TARGET], and a tooltip that appears on hover. The main FAB button should have a size of [FAB_SIZE] pixels, background color [FAB_BG_COLOR], icon color [FAB_ICON_COLOR], and display a plus icon that rotates 45 degrees into an X when the menu is open. The child action buttons should have a size of [CHILD_SIZE] pixels with background color [CHILD_BG_COLOR] and icon color [CHILD_ICON_COLOR]. The expand animation should stagger each child button with a delay of [STAGGER_DELAY] milliseconds. Include settings for z-index [Z_INDEX], bottom offset [BOTTOM_OFFSET] pixels, side offset [SIDE_OFFSET] pixels, and shadow intensity [SHADOW_INTENSITY] (none, light, medium, heavy). On mobile, optionally hide labels and show only icons. Provide complete Liquid, CSS, and JavaScript.

Expected Output

Tips to Improve Results