Skip to content

Visual consistency: review flagged typography differences across cards #36

@tashda

Description

@tashda

Summary

While doing the typography token sweep (#33 follow-up), several places where similar visual elements use different font sizes were flagged. Most are probably intentional, but they should be confirmed before considering the design "consistent."

The tokens already exist in two flavors per role (e.g. `eyebrowLabel` 11pt vs `eyebrowLabelLarge` 12pt), so resolving each item here is a one-line token swap once you decide.

Flagged differences

A. Eyebrow size — 11pt vs 12pt

Cards using 11pt Cards using 12pt
Climate, Fan, Light, Cover, Switch, Lock, Group, DeviceCard SensorCard, RemoteCard, GenericExposeCard

The 12pt cards are content-heavy tiles rather than hero cards. Possibly intentional. Decision needed:

  • Treat all card headers identically and unify on 11pt? (cleaner consistency)
  • Keep 12pt for content tiles as a deliberate emphasis tier? (semantic distinction)

B. Tile metric value — 24pt vs 30pt

Cards using 30pt (primary tile) Cards using 24pt (identity tile)
FanControl, RemoteCard, SensorCard, SwitchControl GroupCard, ClimateControl, DeviceCard

Likely intentional — 24pt reads as "secondary identity stats" (linkquality/battery), 30pt as "primary card metric." Confirm.

C. Metric unit size — 13 / 14 / 15pt

  • 15pt unit pairs with 30pt value (RemoteCard, SensorCard, etc.)
  • 14pt unit pairs with 24pt value (DeviceCard, GroupCard)
  • 13pt unit appears in LightControl snapshot rows and footer bars

Looks consistent — unit size scales with value size. No action needed unless eyeballing reveals otherwise.

D. Notification banner level icon — 14pt vs 15pt

`FastTrackBanner` uses 14pt, `InAppNotificationBanner` uses 15pt for the same level glyph. Probably should match. Trivial fix.

E. Hero "Off" state — 48pt vs 56pt for active metric

Cards drop from 56pt to 48pt when there's no numeric metric (Light "Off", Switch "Off"). Likely deliberate but worth a glance — does the size shift read as a state change or as inconsistency?

Acceptance criteria

For each item above:

  • Decision recorded (unify, keep distinct, or out-of-scope).
  • If unifying: swap the outlier site's token to the dominant variant; remove the now-unused `...Large` token if no longer used.
  • If keeping distinct: add a one-line code comment at the outlier site explaining the intent so future audits don't re-flag it.

Notes

This is design-decision work, not engineering — none of these are bugs. Schedule alongside the next UI polish pass.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions