Container Breakpoint
The JS counterpart to a CSS @container query. The card below
carries phx-hook="PureAdminContainerBreakpoint" and
data-pc-breakpoints; the engine maps its width to a named
mode — compact / comfy / wide
— reflected into [data-mode], and toggles .d-none
on the data-pc-show pieces. Thresholds are rem
(34 = 340px, 64 = 640px at the 10px root). Resize
the window and watch the class hop in devtools.
Beverages
Arabica Cold Brew
SKU-4471
· 1 L bottle · 12 per case
· Yirgacheffe Co-op
📈
$847K
Revenue · 30d
Open orders
38
On hand
8,450
Every visible piece is a real
pa-* class; only the engine's
.d-none toggling changes as the card resizes. The 1-D toolbar
companion is the fit engine (data-pc-fit + the
PureAdminNavFit hook).