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

Align hero lockup type with Display and Paragraph styles.

Browse Source 
Use 110% heading line-height, 14px subhead under 430, and pin Bricolage optical size so Medium stays Medium.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilallo
2026-08-18 18:59:15 -06:00
co-authored by Cursor
parent fc5e3e8d6c
commit c0342a3b2d
3 changed files with 26 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/components/type/ContentLockup.test.tsx
+21
View File
@@ -24,4 +24,25 @@ describe("ContentLockup", () => {
screen.getByText("Help your community make important decisions."),
).toBeInTheDocument();
});
it("uses Display line-height and Small/Paragraph on the hero lockup", () => {
renderWithProviders(
<ContentLockup
variant="hero"
title="Collaborate"
subtitle="with clarity"
description="Help your community make important decisions."
/>,
);
const title = screen.getByRole("heading", { name: "Collaborate" });
expect(title.className).toContain("max-sm:leading-[110%]");
expect(title.className).toContain("font-medium");
const description = screen.getByText(
"Help your community make important decisions.",
);
expect(description.className).toContain("text-small-paragraph");
expect(description.className).toContain("sm:text-large-paragraph");
});
});