🐛 [Page] Fix Toast centering on Safari

beefchimi · Jul 22, 2024 · 997a191 · 997a191
1 parent 662c219
commit 997a191
Showing 1 changed file with 8 additions and 3 deletions.
diff --git a/src/layouts/Page.astro b/src/layouts/Page.astro
@@ -8,6 +8,8 @@ import '@styles/utility.css';
 import {TOAST_TMPL_ID} from '@data/app';
 import Toast from '@components/Toast.astro';
 
+// import ToastTest from '@mock/ToastTest.astro';
+
 interface Props {
   id: string;
   title?: string;
@@ -112,10 +114,13 @@ const OG_IMAGE = '/assets/dulmage-social.png';
 </html>
 
 <style>
-  /* Horizontal centering is required for Toast components */
+  /*
+    Horizontal centering is required for Toast components.
+    `display grid / justify-items` does not work correctly in Safari.
+  */
   body {
-    display: grid;
-    justify-items: center;
+    display: flex;
+    justify-content: center;
   }
 </style>