First-draft SVG sketches for inline companion chat widgets β pymc_console
iOS-style weather card with condition gradient, large temp, detail pills, hi/lo bar, tomorrow preview.
wx gwx
Horizontal scrollable day forecast cards. Each day: abbreviation, emoji, hi/lo temps.
wx 3 gwx 5
Horizontal hour pills: time, emoji, temp, precip%. Optional signal score overlay.
wx hourly
Arc gauge with AQI value + EPA color. Category label. Pollutant breakdown pills below.
aqi
Key-value grid for solar indices. K-Index gets color coding (greenβred).
solar
Two-column day/night HF band conditions. Each band as a colored status pill.
hfcond
Sun arc SVG showing current position along the riseβset trajectory. Daylight + remaining readout.
sun
Large moon phase emoji + illumination ring. Rise/set, next full/new moon dates.
moon
Satellite pass arc with compass directions. Riseβpeakβset timeline. Max elevation callout.
satpass
KP index with color scale gauge. Probability bar + location. Aurora-themed gradient.
aurora
Reuses existing CompanionPathMap auto-expanded. Hop badges with confidence indicators above the map.
path decode
Signal quality card with SNR bars, hop count, path, distance. Clean data-box layout.
test t
Two modes: summary counts (cmds/replies/top) or leaderboard with micro bar chart.
stats
Game score cards stacked vertically. Live games pulse, final games badge, scheduled show time.
sports scores
Amber/red gradient banner. Severity-colored left border. Expandable truncation for long alerts.
β οΈ alert response
Standalone NWS alert card (from alert command). Red variant for severe.
alert
Card with emoji header. Two-part jokes: setup visible, delivery revealed on tap with a subtle slide animation.
joke dadjoke
Dice emoji + die type label, individual results in circles, total. Supports mixed dice.
dice roll
Subtle cat-themed card with paw print motif. Fact text + trailing emoji preserved.
catfact meow
For ping, magic8, and any unclassified bot response. Visually distinct from normal bubbles with subtle bot indicator + glass card treatment.
ping magic8 fallback
Every widget sits inside this container. Provides: glass card, π€ badge, consistent padding, rounded corners matching ChatBubble's rounded-2xl rounded-tl-md.
Replaces ChatBubble's inner <div> β avatar + sender name row stays from the existing layout.
HOWL Bot Wireframes v0.1 β First-draft sketches for collaboration. All colors reference pymc_console CSS variables (sys-*, zinc-*). Open this file in a browser to preview.