fix: nav-link line height

saas-js · Nov 25, 2023 · 537804b · 537804b
1 parent 0a14812
commit 537804b
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 5 deletions.
diff --git a/.changeset/shy-rockets-kick.md 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
@@ -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
@@ -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
@@ -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
@@ -81,6 +81,7 @@ export const navbarTheme = defineMultiStyleConfig({
       borderRadius: 'md',
       transitionProperty: 'common',
       transitionDuration: 'normal',
+      lineHeight: 1,
       px: 3,
       h: 8,
       _focusVisible: {