SquatchMail.Web.Components.Icons (SquatchMail v0.1.0)

Copy Markdown View Source

The SquatchMail footprint mark and small outlined nav icons.

The footprint (the landing page's Footprint.astro bigfoot track: long sole, arch details, five uneven toes) is the one recurring visual motif called for throughout DESIGN.md — loading spinner, empty states, and the event timeline all reuse this same footprint/1 component so the mark stays consistent everywhere it appears, on the landing page and in the dashboard alike.

Summary

Functions

easter_egg(assigns)

The tiny sasquatch silhouette that walks across the sidebar footer once per session. Purely decorative; prefers-reduced-motion disables the CSS animation that moves it (see assets/css/squatch_mail.css .sq-easter-egg).

footprint(assigns)

Renders a single bigfoot track: long human-like sole, broad forefoot, heavy heel, uneven toes. Same geometry as the landing page's Footprint.astro — the one mark, everywhere. Pass mirrored for the opposite foot (walking-trail alternation).

nav_icon(assigns)

Small outlined nav-rail icons. Deliberately simple single-path glyphs (not the footprint mark, which is reserved for the logo/spinner/empty states) so the sidebar stays legible at 16px.

spinner(assigns)

Four footprints used together as the "walking tracks" loading spinner, paired with the .sq-loading-label mono caption in callers (e.g. FOLLOWING TRACKS…).

Functions

easter_egg(assigns)

The tiny sasquatch silhouette that walks across the sidebar footer once per session. Purely decorative; prefers-reduced-motion disables the CSS animation that moves it (see assets/css/squatch_mail.css .sq-easter-egg).

Attributes

  • class (:string) - Defaults to nil.

footprint(assigns)

Renders a single bigfoot track: long human-like sole, broad forefoot, heavy heel, uneven toes. Same geometry as the landing page's Footprint.astro — the one mark, everywhere. Pass mirrored for the opposite foot (walking-trail alternation).

Attributes

  • class (:string) - Defaults to nil.
  • mirrored (:boolean) - Defaults to false.
  • Global attributes are accepted.

spinner(assigns)

Four footprints used together as the "walking tracks" loading spinner, paired with the .sq-loading-label mono caption in callers (e.g. FOLLOWING TRACKS…).

Attributes

  • label (:string) - Defaults to "Following tracks…".