pub enum SizeClass {
Compact,
Medium,
Expanded,
}Expand description
How much screen there is, independent of what is pointing at it.
The second axis, and the one Density kept being asked to carry. A phone
is small and touch; a tablet and a touchscreen laptop are big and touch; a
half-width window on a desktop is small and pointer. Those are four real
combinations and one axis cannot name them, which is what made the old Touch
preset tighten shells it had no business tightening.
Boundaries are quoted, not derived, for the same reason the Gap
values are: a derived boundary is one nobody can check. They are Material 3’s
window size classes, the best-known three-tier split with published numbers.
Apple’s size classes are two-tier and expressed as regular/compact per axis,
which does not give a middle to aim at.
Source: https://m3.material.io/foundations/layout/applying-layout/window-size-classes
This enum carries the boundaries only. What appears, disappears or
reflows at each is a product decision and belongs to makeover-touch, not
here. Deliberately absent for now: size class does not feed Gap::step_at.
Whether shells should tighten on a compact window is a look call of exactly
the kind that produced the 2026-07-29 demolition, so it waits for an eyeball
rather than being derived a second time.
Variants§
Compact
Under 600px. Phones in either orientation, and any window narrowed to phone width regardless of what is pointing at it.
Medium
600px to 839px. Small tablets, split-screen panes, half-width windows.
Expanded
840px and up. Laptops, desktops, tablets in landscape.
Implementations§
Source§impl SizeClass
impl SizeClass
Sourcepub const fn min_px(self) -> u16
pub const fn min_px(self) -> u16
Lower bound in CSS pixels, inclusive. Self::Compact starts at zero.
Sourcepub fn media_condition(self) -> String
pub fn media_condition(self) -> String
The media condition selecting exactly this class, without the @media.
Bounded on both sides for the middle class, so the three are mutually
exclusive and a rule cannot land in two of them. max-width is one below
the next class’s min_px, because CSS width ranges are inclusive.