30 lines
838 B
Vue
30 lines
838 B
Vue
<template>
|
|
<v-app>
|
|
<v-system-bar v-show="ui.safeArea.top > 0" color="primary" :order="1" :height="ui.safeArea.top" />
|
|
|
|
<router-view />
|
|
</v-app>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onMounted, ref } from "vue"
|
|
import { Capacitor } from "@capacitor/core"
|
|
import { useUI } from "@/stores/ui"
|
|
|
|
const ui = useUI()
|
|
|
|
function updateSafeArea() {
|
|
const topProperty = getComputedStyle(document.documentElement).getPropertyValue("--safe-area-top")
|
|
ui.safeArea.top = parseInt(topProperty.replace("px", ""))
|
|
const bottomProperty = getComputedStyle(document.documentElement).getPropertyValue("--safe-area-top")
|
|
ui.safeArea.bottom = parseInt(bottomProperty.replace("px", ""))
|
|
}
|
|
|
|
onMounted(() => {
|
|
updateSafeArea()
|
|
for (let idx = 1; idx <= 10; idx++) {
|
|
setTimeout(() => updateSafeArea(), 250 * idx)
|
|
}
|
|
})
|
|
</script>
|