From 4b089c94b032afdc8fe4fd56eaec125b7708c3fa Mon Sep 17 00:00:00 2001 From: Chris Duncan Date: Sat, 26 Oct 2024 23:36:13 -0700 Subject: [PATCH] Fix styling for new body flex layout. --- app/pages/nemo-wallet.html | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/app/pages/nemo-wallet.html b/app/pages/nemo-wallet.html index e4e0e3d..ddd7036 100644 --- a/app/pages/nemo-wallet.html +++ b/app/pages/nemo-wallet.html @@ -457,30 +457,42 @@ --text-body: 'serif'; --text-heading: 'sans-serif'; } + * { + border: 0; + box-sizing: border-box; + margin: 0; + } body { + align-items: flex-start; background-color: var(--color-dark); color: var(--color-light); display: flex; fill: var(--color-blue); + flex-direction: column; font-family: var(--text-body); - font-size: 16px !important; /* prevents input focus zoom on mobile */ + font-size: calc(16px + (16px * 1vh)) !important; /* prevents input focus zoom on mobile */ height: 100vh !important; - margin: 0 !important; + justify-content: stretch; min-height: 100vh !important; + min-width: 100vw !important; max-height: 100vh !important; + max-width: 100vw !important; + width: 100vw !important } header { + flex: 0 1 auto; padding: 0.5rem; + width: 100%; } main { - height: 100%; + flex: 1 0 auto; + width: 100%; } nav { align-items: flex-end; - bottom: 0; display: flex; + flex: 0 1 auto; justify-content: space-evenly; - position: absolute; width: 100%; } h1, h2, h3, h4, h5, h6 { @@ -675,7 +687,7 @@ input[type='text'], select, select:focus { - font-size: 16px; /* required to prevent zoom on input focus on mobile */ + font-size: calc(16px + (16px * 1vh)) !important; /* prevents input focus zoom on mobile */ } label:has(+ :required)::after { color: red; -- 2.34.1