chakra-ui / chakra-ui-docs

Documentation website for chakra ui
https://chakra-ui.com
MIT License
300 stars 478 forks source link

docs: Fix font usage in Next.js (App) #1679

Closed mseberio closed 6 months ago

mseberio commented 6 months ago

📝 Description

In the "Next.js (App)" section, change fonts.rubik.className to fonts.rubik.variable so that it works as expected.

⛳️ Current behavior (updates)

The current documentation uses fonts.rubik.className this makes the font apply to the entire site. This way, if we import more than one font, the entire website will be seen with the last imported font.

<html lang='en' className={fonts.rubik.className}>

🚀 New behavior

After merging this PR, the code example in the documentation will be fixed by changing to fonts.rubik.variable, this allows us to have control in theme.ts of the font that is used as shown in the documentation example.

<html lang='en' className={fonts.rubik.variable}>

💣 Is this a breaking change (Yes/No):

No.

📝 Additional Information

This change is a minor fix to the documentation and does not affect the functionality of the Chakra UI. Ensures that the example works as expected.

vercel[bot] commented 6 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
chakra-ui-docs ✅ Ready (Inspect) Visit Preview Dec 7, 2023 1:32am