fix: fix auto align center on announcement in mobile environment

eyeshot · Mar 10, 2024 · 825009f · 825009f
1 parent 6d92ff7
commit 825009f
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/app/src/components/app/Announcement.tsx b/app/src/components/app/Announcement.tsx
@@ -43,7 +43,7 @@ function Announcement() {
         </Button>
       </AlertDialogTrigger>
       <AlertDialogContent className={`announcement-dialog flex-dialog`}>
-        <AlertDialogHeader>
+        <AlertDialogHeader notTextCentered>
           <AlertDialogTitle
             className={"flex flex-row items-center select-none"}
           >

diff --git a/app/src/components/ui/alert-dialog.tsx b/app/src/components/ui/alert-dialog.tsx
@@ -50,11 +50,13 @@ AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
 
 const AlertDialogHeader = ({
   className,
+  notTextCentered,
   ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+}: React.HTMLAttributes<HTMLDivElement> & { notTextCentered?: boolean }) => (
   <div
     className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
+      "flex flex-col space-y-2 sm:text-left",
+      !notTextCentered && "text-center",
       className,
     )}
     {...props}