Abstände

Zwei Skalen und eine Regel. Eine Form schreibt niemals eine Länge: Sie verbraucht einen Schritt, was verhindert, dass zwei Komponenten, die ein Jahr auseinander geschrieben sind, zwei Pixel aus dem Rhythmus geraten.

Abstandsstufen

Neun Schritte, von einer feinen Linie bis zu einem Seitenrand. Innenabstände, Lücken und Ränder stammen alle hierher – ein Wert zwischen zwei Schritten ist ein Wert, der noch nicht entschieden wurde.

--space-1

--space-2

--space-3

--space-4

--space-5

--space-6

--space-7

--space-8

--space-9

Größen

Die Breiten und Höhen, die einem Bereich zugewiesen werden: eine Spalte, ein Panel, ein Lesemaß. Größer als ein Abstandsschritt und aus demselben Grund verwendet.

--size-1

--size-2

--size-3

--size-4

--size-5

--size-6

Dichte

Kompaktheit gehört zu einem Bereich und nicht zu einem Widget. Eine als kompakt deklarierte Leiste macht auch das, was sie enthält, kompakt, da die Tokens, die sie tragen, erben – kein darunterliegendes Element wird darüber informiert, wo es steht.

Eine Werkzeugleiste in ihrer eigenen Dichte und die Schaltflächen, die sie enthält

Die gleiche Werkzeugleiste als kompakt deklariert – es wurde nichts über die Schaltflächen gesagt

Ein Bereich, der als kompakt deklariert ist, ohne eine eigene Form zu haben