feat: remove fontMessage use Inter

components/chat-message.tsx

@@ -3,7 +3,6 @@ import { User } from 'lucide-react'
 import remarkGfm from 'remark-gfm'
 import remarkMath from 'remark-math'
 
-import { fontMessage } from '@/lib/fonts'
 import { cn } from '@/lib/utils'
 import { CodeBlock } from '@/components/ui/codeblock'
 import { OpenAI } from '@/components/icons'
@@ -15,13 +14,7 @@ export interface ChatMessageProps {
 
 export function ChatMessage({ message, ...props }: ChatMessageProps) {
   return (
-    <div
-      className={cn(
-        'relative mb-4 flex items-start md:-ml-12',
-        fontMessage.className
-      )}
-      {...props}
-    >
+    <div className={cn('relative mb-4 flex items-start md:-ml-12')} {...props}>
       <div
         className={cn(
           'flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-full border',

components/empty-screen.tsx

@@ -1,6 +1,5 @@
 import { ArrowRight } from 'lucide-react'
 
-import { fontMessage } from '@/lib/fonts'
 import { useChatStore } from '@/lib/hooks/use-chat-store'
 import { cn } from '@/lib/utils'
 import { Button } from '@/components/ui/button'
@@ -25,13 +24,7 @@ export function EmptyScreen({ className }: React.ComponentProps<'div'>) {
   const { setDefaultMessage } = useChatStore()
 
   return (
-    <div
-      className={cn(
-        'rounded-lg border bg-background p-8',
-        fontMessage.className,
-        className
-      )}
-    >
+    <div className={cn('rounded-lg border bg-background p-8', className)}>
       <h1 className="mb-2 text-lg font-semibold">
         Welcome to Next.js Chatbot!
       </h1>

components/header.tsx

@@ -12,7 +12,7 @@ export async function Header() {
   const session = await auth()
 
   return (
-    <header className="sticky top-0 z-50 flex items-center justify-between w-full h-16 px-4 border-b shrink-0 bg-gradient-to-b from-background/10 via-background/50 to-background/80 backdrop-blur-xl">
+    <header className="sticky top-0 z-50 flex h-16 w-full shrink-0 items-center justify-between border-b bg-gradient-to-b from-background/10 via-background/50 to-background/80 px-4 backdrop-blur-xl">
       <div className="flex items-center">
         {/* @ts-ignore */}
         <Sidebar session={session}>
@@ -21,8 +21,8 @@ export async function Header() {
             <SidebarList session={session} />
           </Suspense>
         </Sidebar>
-        <div className="items-center hidden md:flex">
-          <Separator className="w-6 h-6 text-muted-foreground/50" />
+        <div className="hidden items-center md:flex">
+          <Separator className="h-6 w-6 text-muted-foreground/50" />
           <UserMenu session={session} />
         </div>
       </div>
@@ -33,7 +33,7 @@ export async function Header() {
           rel="noopener noreferrer"
           className={cn(buttonVariants({ variant: 'outline' }))}
         >
-          <GitHub className="w-4 h-4 mr-2" />
+          <GitHub className="mr-2 h-4 w-4" />
           <span>GitHub</span>
         </a>
         <a
@@ -41,7 +41,7 @@ export async function Header() {
           target="_blank"
           className={cn(buttonVariants())}
         >
-          <Vercel className="w-4 h-4 mr-2" />
+          <Vercel className="mr-2 h-4 w-4" />
           <span className="hidden sm:block">Deploy to Vercel</span>
           <span className="sm:hidden">Vercel</span>
         </a>

components/sidebar.tsx

@@ -24,8 +24,8 @@ export function Sidebar({ session, children }: SidebarProps) {
   return (
     <Sheet>
       <SheetTrigger asChild>
-        <Button variant="ghost" className="p-0 -ml-2 h-9 w-9">
-          <SidebarIcon className="w-6 h-6" />
+        <Button variant="ghost" className="-ml-2 h-9 w-9 p-0">
+          <SidebarIcon className="h-6 w-6" />
           <span className="sr-only">Toggle Sidebar</span>
         </Button>
       </SheetTrigger>

lib/fonts.ts

@@ -1,19 +1,10 @@
-import {
-  Lora as FontMessage,
-  JetBrains_Mono as FontMono,
-  Inter as FontSans
-} from 'next/font/google'
+import { JetBrains_Mono as FontMono, Inter as FontSans } from 'next/font/google'
 
 export const fontSans = FontSans({
   subsets: ['latin'],
   variable: '--font-sans'
 })
 
-export const fontMessage = FontMessage({
-  subsets: ['latin'],
-  variable: '--font-message'
-})
-
 export const fontMono = FontMono({
   subsets: ['latin'],
   variable: '--font-mono'