Merge pull request #81 from 01-binary/issue#80

Issue#80

Author: 01-binary

.changeset/lucky-pans-hunt.md

@@ -0,0 +1,5 @@
+---
+"notion-to-jsx": patch
+---
+
+update font-family inheritance

apps/renderer-storybook/.storybook/preview.css

@@ -0,0 +1,4 @@
+/* 스토리북 글로벌 스타일 */
+html, body, * {
+  font-family: 'Pretendard', 'Noto Sans KR', sans-serif !important;
+}

apps/renderer-storybook/.storybook/preview.ts

@@ -1,6 +1,9 @@
 import type { Preview } from '@storybook/react';
 import 'notion-to-jsx/dist/index.css';
 
+// 글로벌 폰트 스타일 적용
+import './preview.css';
+
 const preview: Preview = {
   parameters: {
     controls: {

packages/notion-to-jsx/src/components/Renderer/components/RichText/styles.css.ts

@@ -3,10 +3,6 @@ import { recipe } from '@vanilla-extract/recipes';
 import { vars } from '../../../../styles/theme.css';
 
 export const richText = recipe({
-  base: {
-    fontFamily: 'inherit',
-  },
-
   variants: {
     bold: {
       true: {

packages/notion-to-jsx/src/components/Renderer/components/Typography/styles.css.ts

@@ -4,7 +4,6 @@ import { vars } from '../../../../styles/theme.css';
 // 공통 타이포그래피 스타일
 const baseTypography = {
   color: vars.colors.text,
-  fontFamily: vars.typography.fontFamily.base,
   lineHeight: vars.typography.lineHeight.base,
   selectors: {
     '&:focus-visible': {

packages/notion-to-jsx/src/index.ts

@@ -1,4 +1,2 @@
 export * from './components/Renderer';
 export * from './types';
-// export * from './components/MemoizedComponents';
-// export * from './styles/theme';

packages/notion-to-jsx/src/styles/reset.css.ts

@@ -11,6 +11,8 @@ globalStyle('*::before, *::after', {
   boxSizing: 'border-box',
 });
 
+
+
 // HTML과 body 요소
 globalStyle('html, body', {
   height: '100%',

packages/notion-to-jsx/src/styles/theme.css.ts

@@ -1,4 +1,7 @@
-import { createTheme, createThemeContract } from '@vanilla-extract/css';
+import {
+  createTheme,
+  createThemeContract,
+} from '@vanilla-extract/css';
 
 /**
  * 이 변수는 테마의 구조만 정의하며, 실제 값은 없습니다.
@@ -100,7 +103,7 @@ export const vars = createThemeContract({
 const commonThemeValues = {
   typography: {
     fontFamily: {
-      base: 'ui-sans-serif -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif',
+      base: 'inherit',
       code: 'SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace',
     },
     fontSize: {