CommunityRule/community-rule
2
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Adopt remaining typography token classes (CR-24)

Browse Source 
Map exact size/weight/line-height combos onto existing text-* utilities across cards, sections, navigation, modals, controls, and create-flow. Leave unmappable combos hardcoded for design review.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilallo
2026-08-17 11:40:10 -06:00
co-authored by Cursor
parent cb0adf2049
commit 2321a1e761
75 changed files with 229 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/unit/ContentContainer.test.jsx
+7 -17
View File
@@ -74,8 +74,7 @@ describe("ContentContainer", () => {
expect(title).toHaveClass(
"font-bricolage",
"font-medium",
"text-[18px]",
"leading-[120%]",
"text-xx-small-display",
"text-[var(--color-content-inverse-brand-royal)]",
);
});
@@ -86,10 +85,7 @@ describe("ContentContainer", () => {
const description = screen.getByText(/This is a test article description/);
expect(description).toBeInTheDocument();
expect(description).toHaveClass(
"font-inter",
"font-normal",
"text-[12px]",
"leading-[16px]",
"text-x-small-paragraph",
"text-[var(--color-content-inverse-brand-royal)]",
);
});
@@ -148,19 +144,13 @@ describe("ContentContainer", () => {
const author = screen.getByText("Test Author");
expect(author).toHaveClass(
"font-inter",
"font-normal",
"text-[10px]",
"leading-[14px]",
"text-xx-small-paragraph",
"text-[var(--color-content-inverse-brand-royal)]",
);
const date = screen.getByText("April 2025");
expect(date).toHaveClass(
"font-inter",
"font-normal",
"text-[10px]",
"leading-[14px]",
"text-xx-small-paragraph",
"text-[var(--color-content-inverse-brand-royal)]",
);
});
@@ -217,7 +207,7 @@ describe("ContentContainer", () => {
expect(title).toHaveClass("text-[18px]", "leading-[22px]");
const description = screen.getByText(/This is a test article description/);
expect(description).toHaveClass("text-[12px]", "leading-[16px]");
expect(description).toHaveClass("text-x-small-paragraph");
});
it("applies correct responsive sizing for responsive breakpoint", () => {
@@ -227,10 +217,10 @@ describe("ContentContainer", () => {
expect(icon).toHaveClass("w-[60px]", "h-[30px]");
const title = screen.getByText("Test Article Title");
expect(title).toHaveClass("text-[18px]", "leading-[120%]");
expect(title).toHaveClass("text-xx-small-display");
const description = screen.getByText(/This is a test article description/);
expect(description).toHaveClass("text-[12px]", "leading-[16px]");
expect(description).toHaveClass("text-x-small-paragraph");
});
it("has proper accessibility attributes", () => {