Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-25 02:13:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(core): app height exceeds viewport of mobile (#7706)

Browse Source 
TL;DR
use `100dvh` instead of `100vh`.

https://stackoverflow.com/a/72245072

PS: The `100dvh` is tested in Firefox in macOS

## Before
iPad
<img src="https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/MyRfgiN4RuBxJfrza3SG/c81548ed-7ca0-4f88-af7c-cce498958a28.png" width="250">

Phone
<img src="https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/MyRfgiN4RuBxJfrza3SG/4559554d-6f3f-445f-82c1-39a0dc2eb664.png" width="250">

## After
iPad
<img src="https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/MyRfgiN4RuBxJfrza3SG/51fe97f9-f488-432c-9866-20524efd08de.png" width="250">

Phone
<img src="https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/MyRfgiN4RuBxJfrza3SG/a05cce56-38a5-47df-a0c6-f757d94ef6b8.png" width="250">
This commit is contained in:
L-Sun
2024-08-05 03:42:15 +00:00
parent e3878ae8bf
commit 545bd032a7
1 changed files with 1 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/frontend/core/src/components/workspace/index.css.ts
View File

@@ -3,7 +3,7 @@ import { globalStyle, style } from '@vanilla-extract/css';
export const appStyle = style({ export const appStyle = style({
width: '100%', width: '100%',
position: 'relative', position: 'relative',
height: '100vh', height: '100dvh',
flexGrow: '1', flexGrow: '1',
display: 'flex', display: 'flex',
backgroundColor: cssVar('backgroundPrimaryColor'), backgroundColor: cssVar('backgroundPrimaryColor'),