feat. 이벤트 네비게이션 추가

layers/layouts/default.vue

@@ -1,5 +1,16 @@
 <script setup lang="ts">
 const isLoading = ref(true)
+const maintRef = ref<HTMLElement>()
+
+const { height: viewportH } = useWindowSize()
+const { bottom: mainBottom } = useElementBounding(maintRef)
+
+const pinToMain = computed(() => {
+  if (!mainBottom.value) return false
+  return mainBottom.value <= viewportH.value
+})
+
+provide('pinToMain', pinToMain)
 
 onMounted(() => {
   isLoading.value = false
@@ -9,15 +20,8 @@ onMounted(() => {
 <template>
   <LayoutsHeader />
   <AtomsLoadingSimple :is-loading="isLoading" />
-  <main id="LayoutsMain">
+  <main id="LayoutsMain" class="relative">
     <slot />
   </main>
-
   <LayoutsFooter />
 </template>
-
-<style scoped>
-#LayoutsMain {
-  @apply relative min-h-[200px] md:min-h-[800px] z-[90];
-}
-</style>