From b4872a47e7144178cb9357b4777f01913f7d18e4 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Mon, 6 May 2024 22:18:19 +0800
Subject: [PATCH] fix: #61 fix font family problem

---
 src/client/components/ui/dropdown-menu.tsx | 6 +++---
 src/client/utils/dom.ts                    | 2 ++
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/client/components/ui/dropdown-menu.tsx b/src/client/components/ui/dropdown-menu.tsx
index cedf9a7..2eb0ef7 100644
--- a/src/client/components/ui/dropdown-menu.tsx
+++ b/src/client/components/ui/dropdown-menu.tsx
@@ -5,8 +5,8 @@ import {
   ChevronRightIcon,
   DotFilledIcon,
 } from '@radix-ui/react-icons';
-
 import { cn } from '@/utils/style';
+import { rootEl } from '@/utils/dom';
 
 const DropdownMenu = DropdownMenuPrimitive.Root;
 
@@ -49,7 +49,7 @@ const DropdownMenuSubContent = React.forwardRef<
   <DropdownMenuPrimitive.SubContent
     ref={ref}
     className={cn(
-      'z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white p-1 text-zinc-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-zinc-800 dark:bg-zinc-950 dark:text-zinc-50',
+      'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white p-1 text-zinc-950 shadow-lg dark:border-zinc-800 dark:bg-zinc-950 dark:text-zinc-50',
       className
     )}
     {...props}
@@ -62,7 +62,7 @@ const DropdownMenuContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
 >(({ className, sideOffset = 4, ...props }, ref) => (
-  <DropdownMenuPrimitive.Portal>
+  <DropdownMenuPrimitive.Portal container={rootEl}>
     <DropdownMenuPrimitive.Content
       ref={ref}
       sideOffset={sideOffset}
diff --git a/src/client/utils/dom.ts b/src/client/utils/dom.ts
index 1fdb127..3519e3a 100644
--- a/src/client/utils/dom.ts
+++ b/src/client/utils/dom.ts
@@ -11,3 +11,5 @@ export function stopPropagation(e: Event) {
 export function preventDefault(e: Event) {
   e.preventDefault();
 }
+
+export const rootEl = document.getElementById('root');