From 135a8a00fc4d0013d2caec585e8c911817870abc Mon Sep 17 00:00:00 2001
From: Neko Ayaka <neko@ayaka.moe>
Date: Wed, 4 Dec 2024 00:01:51 +0800
Subject: [PATCH] style: screensafearea

---
 packages/stage/src/layouts/default.vue | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/packages/stage/src/layouts/default.vue b/packages/stage/src/layouts/default.vue
index f7b1d18..f295004 100644
--- a/packages/stage/src/layouts/default.vue
+++ b/packages/stage/src/layouts/default.vue
@@ -1,5 +1,19 @@
+<script setup lang="ts">
+import { useScreenSafeArea } from '@vueuse/core'
+
+const { top, right, bottom, left } = useScreenSafeArea()
+</script>
+
 <template>
-  <main text="gray-700 dark:gray-200" h-full font-sans>
+  <main
+    text="gray-700 dark:gray-200" h-full font-sans
+    :style="{
+      paddingTop: `${top.value}px`,
+      paddingRight: `${right.value}px`,
+      paddingBottom: `${bottom.value}px`,
+      paddingLeft: `${left.value}px`,
+    }"
+  >
     <RouterView />
   </main>
 </template>