shadcn/uiのdialogにフォントが効かない事象が発生したのでメモ

shadcn/uiのdialogにフォントが効かない事象が発生したのでメモ

Radix UIもしくはShadcn/UIのDialogやDropdownを使用してコンポーネントを使っているとき、フォントのクラスを指定しても効かなかった。
whats fontなどのフォントを調べれる拡張機能などを使って調べたら、font-noto-sansを指定してもフォントはMeiryoと表示された

これの解決方法は_app.tsxなどに直接styleタグを書くことで解決する

export default function App({ Component, pageProps }: AppProps) {
  return (
    <>
    <style
        jsx
        global
        >{`:root { --font-noto-sans: ${notoSans.style.fontFamily};}}`}</style>
      <FontProvider>
        <Component {...pageProps} />
      </FontProvider>
    </>
  );
}

最後に

間違っていること、別のやり方あればコメントに書いていただけると幸いです。
よろしくお願いいたします。