fix iphone padding
This commit is contained in:
17
src/App.vue
17
src/App.vue
@@ -51,24 +51,35 @@ const submitPassphrase = (close: () => void) => {
|
||||
if (passphraseValid.value) close()
|
||||
}
|
||||
|
||||
const loading = computed(() => notes.value.length === 0 || passphraseRequired.value || !activeNotesSource.value)
|
||||
const loading = computed(
|
||||
() => notes.value.length === 0 || passphraseRequired.value || !activeNotesSource.value
|
||||
)
|
||||
provide('loading', loading)
|
||||
|
||||
const topBarHeight = 52
|
||||
const topBarHeightWithSafeArea = computed(() => `calc(${topBarHeight}px + var(--safe-area-top))`)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<TopBar
|
||||
:side-bar-collapsed="sideBarCollapsed"
|
||||
:height="topBarHeight"
|
||||
:style="{ height: topBarHeightWithSafeArea }"
|
||||
@toggle-side-bar="sideBarCollapsed = !sideBarCollapsed"
|
||||
class="pe-[var(--safe-area-right)] ps-[var(--safe-area-left)]"
|
||||
/>
|
||||
<!-- <div class="absolute bottom-0 left-0 right-0 top-[50px] mx-auto flex flex-grow"> -->
|
||||
<div class="mx-auto flex w-full max-w-app flex-grow">
|
||||
<div
|
||||
class="mx-auto flex w-full max-w-app flex-grow pe-[var(--safe-area-right)] ps-[var(--safe-area-left)]"
|
||||
>
|
||||
<Transition name="sidebar">
|
||||
<SideBar
|
||||
:view-modes="viewModes"
|
||||
:active-view-mode="activeViewMode"
|
||||
@set-view-mode="(viewMode) => (activeViewMode = viewMode)"
|
||||
@collapse="(collapse) => (sideBarCollapsed = collapse)"
|
||||
class="mt-[50px] bg-gray-100 px-3 py-6 transition-[width] delay-200 duration-0 max-sm:z-50 max-sm:border-x-[1px] max-sm:py-3 max-sm:transition-transform max-sm:delay-0 max-sm:duration-200"
|
||||
class="bg-gray-100 px-3 py-6 transition-[width] delay-200 duration-0 max-sm:z-50 max-sm:border-x-[1px] max-sm:py-3 max-sm:transition-transform max-sm:delay-0 max-sm:duration-200"
|
||||
:style="{ 'margin-top': topBarHeightWithSafeArea }"
|
||||
v-if="!sideBarCollapsed"
|
||||
/>
|
||||
</Transition>
|
||||
|
||||
Reference in New Issue
Block a user