From 537804bf5a0c06457678f42031ad0175bee18349 Mon Sep 17 00:00:00 2001
From: Pagebakers <eelco@appulse.nl>
Date: Sat, 25 Nov 2023 14:07:41 +0100
Subject: [PATCH] fix: nav-link line height

---
 .changeset/shy-rockets-kick.md                              | 6 ++++++
 apps/website/package.json                                   | 1 +
 .../mdx-components/codeblock/react-live-block.tsx           | 4 ++--
 apps/website/src/styles/theme.ts                            | 4 +---
 packages/saas-ui-theme/src/base/components/navbar.ts        | 1 +
 5 files changed, 11 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/shy-rockets-kick.md

diff --git a/.changeset/shy-rockets-kick.md b/.changeset/shy-rockets-kick.md
new file mode 100644
index 000000000..8c56fcc5a
--- /dev/null
+++ b/.changeset/shy-rockets-kick.md
@@ -0,0 +1,6 @@
+---
+'@saas-ui/theme': patch
+'@saas-ui/react': patch
+---
+
+Fixed NavLink line height
diff --git a/apps/website/package.json b/apps/website/package.json
index a5da5f084..8dd05e22a 100644
--- a/apps/website/package.json
+++ b/apps/website/package.json
@@ -26,6 +26,7 @@
     "@chakra-ui/system": "^2.6.1",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
+    "@fontsource-variable/inter": "^5.0.15",
     "@fontsource/inter": "^4.5.15",
     "@mapbox/rehype-prism": "^0.8.0",
     "@mdx-js/loader": "^2.3.0",
diff --git a/apps/website/src/docs/components/mdx-components/codeblock/react-live-block.tsx b/apps/website/src/docs/components/mdx-components/codeblock/react-live-block.tsx
index 00c34b4bf..f289ad087 100644
--- a/apps/website/src/docs/components/mdx-components/codeblock/react-live-block.tsx
+++ b/apps/website/src/docs/components/mdx-components/codeblock/react-live-block.tsx
@@ -162,11 +162,11 @@ function ReactLiveBlock({
   }, [frameRef, inline])
 
   const frame = inline ? (
-    <LiveCodePreview fontSize="sm" sx={sx} minH="200px" />
+    <LiveCodePreview fontSize="md" sx={sx} minH="200px" />
   ) : (
     <Frame ref={(ref) => setFrameRef(ref)} width="100%" height="100%">
       <FrameProvider>
-        <LiveCodePreview fontSize="sm" sx={sx} minHeight="$100vh" />
+        <LiveCodePreview fontSize="md" sx={sx} minHeight="$100vh" />
       </FrameProvider>
     </Frame>
   )
diff --git a/apps/website/src/styles/theme.ts b/apps/website/src/styles/theme.ts
index 0ac0e898a..604aaffca 100644
--- a/apps/website/src/styles/theme.ts
+++ b/apps/website/src/styles/theme.ts
@@ -2,7 +2,7 @@ import { extendTheme, ThemeTypings } from '@chakra-ui/react'
 
 import { theme as baseTheme } from '@saas-ui-pro/react'
 
-import '@fontsource/inter/variable.css'
+import '@fontsource-variable/inter'
 
 import { mode, transparentize, blacken } from '@chakra-ui/theme-tools'
 
@@ -78,8 +78,6 @@ const theme = extendTheme(
     fontSizes,
     fonts: {
       ...baseTheme.fonts,
-      body: 'InterVariable, sans-serif',
-      heading: 'InterVariable, sans-serif',
     },
     sizes: {
       ...baseTheme.sizes,
diff --git a/packages/saas-ui-theme/src/base/components/navbar.ts b/packages/saas-ui-theme/src/base/components/navbar.ts
index 3c431e895..d2a89074b 100644
--- a/packages/saas-ui-theme/src/base/components/navbar.ts
+++ b/packages/saas-ui-theme/src/base/components/navbar.ts
@@ -81,6 +81,7 @@ export const navbarTheme = defineMultiStyleConfig({
       borderRadius: 'md',
       transitionProperty: 'common',
       transitionDuration: 'normal',
+      lineHeight: 1,
       px: 3,
       h: 8,
       _focusVisible: {