Reading progress bar fixed at the top or bottom of the page.
Uses the PhiaPageProgress hook from priv/templates/js/hooks/page_progress.js.
The hook listens to scroll events and updates this.el.style.width and
aria-valuenow based on the percentage of the page scrolled.
The element starts with w-0 — the hook drives all width changes via inline style.
Summary
Functions
Renders a reading progress bar fixed to the top or bottom of the page.
Functions
Renders a reading progress bar fixed to the top or bottom of the page.
The bar starts at w-0 and grows to full width as the user scrolls.
The PhiaPageProgress hook drives width changes via inline style updates.
Attributes
id(:string) - Required for phx-hook. Defaults to"page-progress".variant(:atom) - Defaults to:default. Must be one of:default,:gradient, or:thin.position(:atom) - Defaults to:top. Must be one of:top, or:bottom.color(:any) - Optional inline background color override. Defaults tonil.class(:string) - Defaults tonil.- Global attributes are accepted.