Skip to content

Conversation

matgalla
Copy link
Contributor

@matgalla matgalla commented Sep 8, 2025

Related Issue: #11555

Summary

Converts raw values to semantic line-height tokens for the following:

Fixed line-heights:

n3h: [new semantic token]
n2h: [new semantic token]
n1h: [new semantic token]
0h: [new semantic token]
1h: [new semantic token]
2h: [new semantic token]
3h: [new semantic token]
4h: [new semantic token]
5h: [new semantic token]
6h: [new semantic token]
7h: [new semantic token]
8h: [new semantic token]

Relative line-heights

n3-wrap: --calcite-font-line-height-relative-snug
n2-wrap: --calcite-font-line-height-relative-snug
n1-wrap: --calcite-font-line-height-relative-snug
0-wrap: ...-snug
1-wrap: ...-snug
2-wrap: ...-snug
3-wrap: ...-tight
4-wrap: ...-tight
5-wrap: ...-tight
6-wrap: ...-tight
7-wrap: ...-tight
8-wrap: ...-tight

@matgalla matgalla self-assigned this Sep 8, 2025
@github-actions github-actions bot added the enhancement Issues tied to a new feature or request. label Sep 8, 2025
@matgalla
Copy link
Contributor Author

matgalla commented Sep 8, 2025

@jcfranco @benelan Any other considerations to make when updating the Tailwind config?

@driskull Will this properly address the inability to change the line-heights mentioned in #11555

Copy link
Member

@driskull driskull left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉

@jcfranco jcfranco changed the title feat(tailwind-config): add line-height tokens to font sizes feat(tailwind): switch text utils to use line-height token CSS props Sep 9, 2025
Copy link
Member

@jcfranco jcfranco left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊
🌊🌊🚢🚢🚢🌊🚢🌊🌊🚢🌊🚢🚢🚢🌊🚢🚢🚢🌊🌊🌊🌊🚢🚢🚢🌊🚢🚢🚢🚢🚢🌊🚢🌊
🌊🚢🌊🌊🌊🌊🚢🌊🌊🚢🌊🌊🚢🌊🌊🚢🌊🌊🚢🌊🌊🌊🌊🚢🌊🌊🌊🌊🚢🌊🌊🌊🚢🌊
🌊🌊🚢🚢🌊🌊🚢🚢🚢🚢🌊🌊🚢🌊🌊🚢🚢🚢🌊🌊🌊🌊🌊🚢🌊🌊🌊🌊🚢🌊🌊🌊🚢🌊
🌊🌊🌊🌊🚢🌊🚢🌊🌊🚢🌊🌊🚢🌊🌊🚢🌊🌊🌊🌊🌊🌊🌊🚢🌊🌊🌊🌊🚢🌊🌊🌊🌊🌊
🌊🚢🚢🚢🌊🌊🚢🌊🌊🚢🌊🚢🚢🚢🌊🚢🌊🌊🌊🌊🌊🌊🚢🚢🚢🌊🌊🌊🚢🌊🌊🌊🚢🌊
🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊🌊

@jcfranco
Copy link
Member

jcfranco commented Sep 9, 2025

@matgalla FYI, I updated the PR title for clarity.

@matgalla matgalla marked this pull request as ready for review September 11, 2025 17:09
@jcfranco jcfranco added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label Sep 12, 2025
@matgalla matgalla marked this pull request as draft September 12, 2025 19:57
@jcfranco
Copy link
Member

Belated update: @matgalla pointed out a screen diff issue after we updated the Tailwind text utilities’ line-height values from relative units (rem) to fixed units (px). I think the --calcite-font-line-height-relative-<x> set needs to be expanded (to add missing entries) and used in the Tailwind config instead.

@matgalla
Copy link
Contributor Author

Yeah, -relative might not be the ideal term to use if we want to support % and rem values. We'll either want to differentiate or add another modifier term to indicate rems

Copy link
Contributor

This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions.

@github-actions github-actions bot added the Stale Issues or pull requests that have not had recent activity. label Sep 24, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement Issues tied to a new feature or request. pr ready for visual snapshots Adding this label will run visual snapshot testing. Stale Issues or pull requests that have not had recent activity.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants