pub enum Stroke {
Hairline,
Mark,
}Expand description
How heavy an edge is, named for what the edge is saying.
The fourth axis, and the same move as Radius: name the thing, let the
width follow. Measured across the tree before it existed, edges were 1px,
2px, 3px and 4px with no token for any of them, and the 3px and 4px ones
were all the same thing (a status stripe down one side) spelled two ways.
§Two rungs
An edge says one of two things. Either it separates two surfaces, and wants
to be the least ink that still reads as a line, or it marks something the
reader has to notice: a focus ring, a status, a selection. Nothing between
those is a third meaning, so there is no third rung. none is not a rung
either, unlike Radius::Square: an absent edge is border: none, which
states itself without a width.
§Pixels, not ratios of the base
The one axis here that does not scale with --geometry-base, and on
purpose. A browser snaps a border’s width to whole device pixels, so a
hairline at a 20px root would ask for 1.25px and draw 1, while the mark
would ask for 2.5 and draw 2: the scaling would buy nothing and blur the
ratio between the rungs. A hairline is the device’s own unit of line, and
stays one at any text size.
On a terminal both rungs are one cell edge; the box-drawing set has a
heavy line for Self::Mark where the surface can draw it.
§Not --border-*
The tokens are --stroke-* because --border and --border-strong are
already colour tokens in makeover, and border-strong beside a
border-mark would read as two halves of one scale when they are two axes.
Variants§
Hairline
The edge between two surfaces: dividers, rules, input outlines, a bevel’s edge. 1px.
Mark
An edge that has to be noticed: the focus ring, a status stripe, a selected or latched outline. 2px, twice the hairline so the two never read as the same weight.