[F] Fix mobile view height causing button to be invisible when browser url bar is not hidden
This commit is contained in:
@@ -3,6 +3,7 @@
|
|||||||
import "@fontsource/roboto"
|
import "@fontsource/roboto"
|
||||||
import 'virtual:uno.css'
|
import 'virtual:uno.css'
|
||||||
import "../style/app.sass"
|
import "../style/app.sass"
|
||||||
|
import "../style/app.scss"
|
||||||
import "../style/material.scss"
|
import "../style/material.scss"
|
||||||
import '@unocss/reset/normalize.css'
|
import '@unocss/reset/normalize.css'
|
||||||
import '@unocss/reset/tailwind-v4.css'
|
import '@unocss/reset/tailwind-v4.css'
|
||||||
@@ -52,7 +53,7 @@
|
|||||||
<meta property="twitter:image" content="https://amaoke.app/images/meta.png" />
|
<meta property="twitter:image" content="https://amaoke.app/images/meta.png" />
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<div class="vbox h-screen min-h-screen box-border overflow-hidden relative max-w-1200px mx-auto">
|
<div id="layout-view" class="vbox box-border overflow-hidden relative max-w-1200px mx-auto">
|
||||||
{@render children()}
|
{@render children()}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -10,6 +10,9 @@ body
|
|||||||
margin: 0
|
margin: 0
|
||||||
background: rgb(var(--m3-scheme-background))
|
background: rgb(var(--m3-scheme-background))
|
||||||
|
|
||||||
|
#layout-view
|
||||||
|
height: var(--svh)
|
||||||
|
|
||||||
.hbox
|
.hbox
|
||||||
display: flex
|
display: flex
|
||||||
flex-direction: row
|
flex-direction: row
|
||||||
|
|||||||
@@ -0,0 +1,3 @@
|
|||||||
|
:root { --svh: 100vh; --dvh: 100vh; --svw: 100vw; --dvw: 100vw; }
|
||||||
|
@supports (height: 100svh) { :root { --svh: 100svh; --svw: 100svw; } }
|
||||||
|
@supports (height: 100dvh) { :root { --dvh: 100dvh; --dvw: 100dvw; } }
|
||||||
Reference in New Issue
Block a user