fix: revert #660 + patch

zio/stable
patak 2022-12-30 19:16:23 +01:00
parent 6a5383b595
commit ff73614228
5 changed files with 6 additions and 10 deletions

View File

@ -4,14 +4,13 @@ defineProps<{
backOnSmallScreen?: boolean
/** Show the back button on both small and big screens */
back?: boolean
largeHeader?: boolean
}>()
</script>
<template>
<div relative :class="largeHeader ? 'mobile-padding-top-large-header' : 'mobile-padding-top'" sm:pt-0>
<div relative>
<div
fixed sm:sticky w-full top-0 z10
sticky top-0 z10
border="b base" bg-base
>
<div flex justify-between px5 py4>

View File

@ -40,11 +40,11 @@ const wideLayout = computed(() => route.meta.wideLayout ?? false)
</slot>
</div>
</aside>
<div class="w-full min-h-screen" :class="wideLayout ? 'lg:w-full sm:w-600px' : 'sm:w-600px'" sm:border-l sm:border-r border-base mobile-padding-bottom sm:pb-0>
<div class="w-full min-h-screen" :class="wideLayout ? 'lg:w-full sm:w-600px' : 'sm:w-600px'" sm:border-l sm:border-r border-base>
<div min-h="[calc(100vh-3.5rem)]" sm:min-h-screen>
<slot />
</div>
<div sm:hidden fixed w-full left-0 right-0 bottom-0 z-10 bg-base pb="[env(safe-area-inset-bottom)]" transition="padding 20">
<div sm:hidden sticky left-0 right-0 bottom-0 z-10 bg-base pb="[env(safe-area-inset-bottom)]" transition="padding 20">
<CommonOfflineChecker :small-screen="isHydrated.value" />
<NavBottom v-if="isHydrated.value" />
</div>

View File

@ -26,7 +26,7 @@ const tabs = $computed(() => [
</script>
<template>
<MainContent large-header>
<MainContent>
<template #title>
<span text-lg font-bold flex items-center gap-2 cursor-pointer @click="$scrollToTop">
<div i-ri:hashtag />

View File

@ -26,7 +26,7 @@ onActivated(() => {
</script>
<template>
<MainContent large-header>
<MainContent>
<template #title>
<NuxtLink to="/notifications" text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<div i-ri:notification-4-line />

View File

@ -101,8 +101,5 @@ export default defineConfig({
return res
}],
['box-shadow-outline', { 'box-shadow': '0 0 0 1px var(--c-primary)' }],
['mobile-padding-top', { 'padding-top': 'calc(4rem + 1px)' }], // in sm screen size header is fixed (instead of sticky) and parent have this padding, to prevent flickering in iOS Safari
['mobile-padding-top-large-header', { 'padding-top': 'calc(6.5rem + 1px)' }],
['mobile-padding-bottom', { 'padding-bottom': '3.5rem' }], // in sm screen size footer is fixed (instead of sticky) and parent have this padding, to prevent flickering in iOS Safari
],
})