robbertbos/waggle
robbertbos/waggle
1
0
Fork 0
Code Issues 1 Pull requests 3 Releases 14 Packages 2 Activity Actions

Fix the dangling --line-height-normal token in the reply preview #222

Merged
robbertbos merged 1 commit from fix-dangling-line-height-token into main 2026-08-05 16:06:18 +00:00
Conversation 0 Commits 1 Files changed 1 +1 -2
robbertbos commented 2026-08-05 13:49:21 +00:00
Owner
Copy link

Problem

main's CI (frontend-test) fails after the new-message composer merged: the
nlddTokens guardrail (added in 2a4fd4b, "Fail the build and the tests on a
silently broken design token") flags a var() without a fallback that resolves
to no defined property:

--line-height-normal at src/components/composer/ReplyComposer.vue:563

ReplyComposer.vue's .preview block (the rendered reply markdown) still used
font-size: var(--primitives-font-size-90); line-height: var(--line-height-normal).
--line-height-normal is one of the Waggle type-scale tokens removed in the
NLDD migration (#181), so it silently resolved to nothing. The composer branch
predated the guardrail, so it only surfaced once both landed on main.

Fix

Use the NLDD body font shorthand --primitives-font-body-md-regular-snug - the
same token base.css sets on body (18px / snug 1.5) - which bundles size and
line-height in one NLDD token. .preview is body reading text, so it now
matches the app's body typography instead of hand-setting size + a (broken)
line-height.

Guardrail test + the full frontend suite (651) pass; tsc and build clean.

## Problem main's CI (`frontend-test`) fails after the new-message composer merged: the `nlddTokens` guardrail (added in `2a4fd4b`, "Fail the build and the tests on a silently broken design token") flags a `var()` without a fallback that resolves to no defined property: ``` --line-height-normal at src/components/composer/ReplyComposer.vue:563 ``` `ReplyComposer.vue`'s `.preview` block (the rendered reply markdown) still used `font-size: var(--primitives-font-size-90); line-height: var(--line-height-normal)`. `--line-height-normal` is one of the Waggle type-scale tokens removed in the NLDD migration (#181), so it silently resolved to nothing. The composer branch predated the guardrail, so it only surfaced once both landed on main. ## Fix Use the NLDD body font shorthand `--primitives-font-body-md-regular-snug` - the same token `base.css` sets on `body` (18px / snug 1.5) - which bundles size and line-height in one NLDD token. `.preview` is body reading text, so it now matches the app's body typography instead of hand-setting size + a (broken) line-height. Guardrail test + the full frontend suite (651) pass; tsc and build clean.
Fix the dangling --line-height-normal token in the reply preview
All checks were successful
CI / release-scripts (pull_request) Successful in 6s
Details
security-scan / SBOM (trivy) (pull_request) Successful in 11s
Details
security-scan / Filesystem scan (trivy fs) (pull_request) Successful in 13s
Details
security-scan / JS SCA (npm audit) (pull_request) Successful in 20s
Details
security-scan / Python SAST (bandit) (pull_request) Successful in 20s
Details
CI / pre-commit (pull_request) Successful in 27s
Details
security-scan / Python SCA (pip-audit) (pull_request) Successful in 38s
Details
CI / backend-test (pull_request) Successful in 56s
Details
test-build / build (backend) (pull_request) Successful in 1m0s
Details
test-build / build (frontend) (pull_request) Successful in 1m6s
Details
test-build / build (pull_request) Successful in 0s
Details
CI / frontend-test (pull_request) Successful in 1m11s
Details
CI / e2e (pull_request) Successful in 3m23s
Details
CI / backend-test-postgres (pull_request) Successful in 4m42s
Details
CI / release-scripts (push) Successful in 5s
Details
security-scan / SBOM (trivy) (push) Successful in 11s
Details
security-scan / Filesystem scan (trivy fs) (push) Successful in 15s
Details
security-scan / JS SCA (npm audit) (push) Successful in 18s
Details
security-scan / Python SAST (bandit) (push) Successful in 22s
Details
CI / pre-commit (push) Successful in 27s
Details
security-scan / Python SCA (pip-audit) (push) Successful in 44s
Details
CI / backend-test (push) Successful in 55s
Details
publish-main / build (backend) (push) Successful in 1m0s
Details
publish-main / build (frontend) (push) Successful in 1m8s
Details
publish-main / build (push) Successful in 0s
Details
CI / frontend-test (push) Successful in 1m12s
Details
CI / e2e (push) Successful in 3m22s
Details
CI / backend-test-postgres (push) Successful in 4m33s
Details
292848388d
 
The reply message preview still used font-size: var(--primitives-font-size-90)
plus line-height: var(--line-height-normal), but --line-height-normal is one of
the Waggle type-scale tokens removed in the NLDD migration, so it resolved to
nothing. main's new nlddTokens guardrail (a var() without a fallback must
resolve to a defined property) caught it after the composer PR merged.

Use the NLDD body font shorthand --primitives-font-body-md-regular-snug (the
same token base.css sets on body: 18px / snug 1.5), which bundles the size and
line-height in one NLDD token.
robbertbos deleted branch fix-dangling-line-height-token 2026-08-05 16:06:18 +00:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels   
bug
Something is not working

  
duplicate
This issue or pull request already exists

  
enhancement
New feature

  
help wanted
Need some help

  
invalid
Something is wrong

  
nldd ds

   
question
More information is needed

  
wontfix
This won't be fixed

No labels
bug
duplicate
enhancement
help wanted
invalid
nldd ds
question
wontfix
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
robbertbos/waggle!222
No description provided.