@pg-labs-incubator/cobweb 0.0.0-stage → 0.0.2

package/src/text/typescale.yaml

@@ -0,0 +1,726 @@
+# SPDX-License-Identifier: MPL-2.0
+class: system
+attribute: Typescale
+description: >
+  System roles controlling typescale. There are 5 primary roles, `display`, `headline`, `title`,
+  `body`, and `label`. Each role additionally has 3 possible styles, `large`, `medium`, and
+  `small`, each with an `emphasized` variant. Values are Material's baseline and emphasized type
+  scale tokens, where `1sp` equals `0.0625rem`. Emphasized styles share the font, size, and line
+  height of their baseline style, and differ in weight and tracking. Line heights reference
+  `cw-LineHeight` roles, whose category `Typography` scopes select by language.
+roles:
+  display:
+    description: >
+      Roles controlling largest text on screen, reserved usually for short important text or
+      numerals.
+    roles:
+      large:
+        description: Largest typescale display text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 3.5625rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: -0.0125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-display-large
+          emphasized:
+            description: Emphasized variant of the large display style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-display-large-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-display-large-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-display-large
+      medium:
+        description: Medium typescale display text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 2.8125rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-display-medium
+          emphasized:
+            description: Emphasized variant of the medium display style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-display-medium-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-display-medium-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-display-medium
+      small:
+        description: Smallest typescale display text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 2.25rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-display-small
+          emphasized:
+            description: Emphasized variant of the small display style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-display-small-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-display-small-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-display-small
+  headline:
+    description: Roles controlling short, high-emphasis text.
+    roles:
+      large:
+        description: Largest typescale headline text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 2rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-headline-large
+          emphasized:
+            description: Emphasized variant of the large headline style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-headline-large-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-headline-large-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-headline-large
+      medium:
+        description: Medium typescale headline text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 1.75rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-headline-medium
+          emphasized:
+            description: Emphasized variant of the medium headline style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-headline-medium-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-headline-medium-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-headline-medium
+      small:
+        description: Smallest typescale headline text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 1.5rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-headline-small
+          emphasized:
+            description: Emphasized variant of the small headline style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-headline-small-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-headline-small-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-headline-small
+  title:
+    description: Roles controlling text used for short medium-emphasis text.
+    roles:
+      large:
+        description: Largest typescale title text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-brandFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 1.375rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-title-large
+          emphasized:
+            description: Emphasized variant of the large title style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-title-large-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-title-large-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-title-large
+      medium:
+        description: Medium typescale title text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-mediumWeight
+          size:
+            description: Text size.
+            type: length
+            value: 1rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.0125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-title-medium
+          emphasized:
+            description: Emphasized variant of the medium title style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-title-medium-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-boldWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-title-medium-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.009375rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-title-medium
+      small:
+        description: Smallest typescale title text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-mediumWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.875rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.00625rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-title-small
+          emphasized:
+            description: Emphasized variant of the small title style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-title-small-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-boldWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-title-small-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.00625rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-title-small
+  body:
+    description: Roles controlling text used for normal text.
+    roles:
+      large:
+        description: Largest typescale body text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 1rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.03125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-body-large
+          emphasized:
+            description: Emphasized variant of the large body style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-body-large-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-body-large-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.009375rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-body-large
+      medium:
+        description: Medium typescale body text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.875rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.0125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-body-medium
+          emphasized:
+            description: Emphasized variant of the medium body style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-body-medium-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-body-medium-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.015625rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-body-medium
+      small:
+        description: Smallest typescale body text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-regularWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.75rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.025rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-body-small
+          emphasized:
+            description: Emphasized variant of the small body style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-body-small-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-mediumWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-body-small-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.025rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-body-small
+  label:
+    description: Roles controlling text used within components or small text within content body.
+    roles:
+      large:
+        description: Largest typescale label text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-mediumWeight
+          weightProminent:
+            description: Text weight for prominent labels.
+            type: number
+            value: $cw-Typeface-boldWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.875rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.00625rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-label-large
+          emphasized:
+            description: Emphasized variant of the large label style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-label-large-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-boldWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-label-large-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.00625rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-label-large
+      medium:
+        description: Medium typescale label text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-mediumWeight
+          weightProminent:
+            description: Text weight for prominent labels.
+            type: number
+            value: $cw-Typeface-boldWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.75rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.03125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-label-medium
+          emphasized:
+            description: Emphasized variant of the medium label style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-label-medium-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-boldWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-label-medium-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.03125rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-label-medium
+      small:
+        description: Smallest typescale label text can be rendered with.
+        roles:
+          font:
+            description: Font family.
+            type: font-family
+            value: $cw-Typeface-plainFont
+          weight:
+            description: Text weight.
+            type: number
+            value: $cw-Typeface-mediumWeight
+          size:
+            description: Text size.
+            type: length
+            value: 0.6875rem
+          tracking:
+            description: Text tracking (space between characters).
+            type: length
+            value: 0.03125rem
+          lineHeight:
+            description: Line-height of text.
+            type: length
+            value: $cw-LineHeight-label-small
+          emphasized:
+            description: Emphasized variant of the small label style.
+            roles:
+              font:
+                description: Font family, equal to the baseline style.
+                type: font-family
+                value: $cw-Typescale-label-small-font
+              weight:
+                description: Text weight.
+                type: number
+                value: $cw-Typeface-boldWeight
+              size:
+                description: Text size, equal to the baseline style.
+                type: length
+                value: $cw-Typescale-label-small-size
+              tracking:
+                description: Text tracking (space between characters).
+                type: length
+                value: 0.03125rem
+              lineHeight:
+                description: Line-height of text, equal to the baseline style.
+                type: length
+                value: $cw-LineHeight-label-small