Fix font in dropdowns

components/Dropdown.tsx

@@ -12,6 +12,7 @@ import {
 import { HeroIcon } from "../lib/types";
 import { ChevronRightIcon } from "@heroicons/react/20/solid";
 import classNames from "../lib/classNames";
+import { inter } from "../lib/font";
 
 type DropdownItem = {
   onClick?: () => void;
@@ -45,7 +46,8 @@ const itemStyles = (disabled?: boolean, isSubMenuTrigger?: boolean) =>
   classNames(
     "group py-2 px-2.5 rounded-md flex items-center justify-between gap-2 text-left w-full text-sm disabled:opacity-50 transition duration-75 dropdown-menu-item",
     isSubMenuTrigger && "cursor-default dropdown-menu-subtrigger",
-    disabled && "opacity-40 cursor-default"
+    disabled && "opacity-40 cursor-default",
+    inter.className
   );
 
 const contentStyles =

lib/font.ts

@@ -0,0 +1,6 @@
+import { Inter } from "@next/font/google";
+
+export const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+});

pages/_app.tsx

@@ -7,17 +7,12 @@ import WelcomeModal from "../components/WelcomeModal";
 import axios from "axios";
 import splitbee from "@splitbee/web";
 import type { AppProps } from "next/app";
-import { Inter } from "@next/font/google";
 import { SchemaContext } from "../lib/context";
 import { Toaster } from "react-hot-toast";
 import { classNames } from "react-cmdk";
 import { useEffect, useState } from "react";
 import { useRouter } from "next/dist/client/router";
-
-export const inter = Inter({
-  subsets: ["latin"],
-  variable: "--font-inter",
-});
+import { inter } from "../lib/font";
 
 splitbee.init();