Skip to content

Commit a1cfb1c

Browse files
suenotclaude
andcommitted
fix: Android keyboard pushing content up (v0.7.2)
- Use visualViewport API to compute real viewport height on Android - Add interactive-widget=resizes-content viewport meta - Replace 100dvh with var(--app-height) CSS variable - Fix MessageInput safe-area-inset-bottom being overridden by padding shorthand Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent 9632ced commit a1cfb1c

10 files changed

Lines changed: 35 additions & 11 deletions

File tree

CHANGELOG.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
# Changelog
22

3+
## [0.7.2] - 2026-03-15
4+
### Bug Fixes
5+
- Fix Android keyboard pushing content up (visualViewport API + CSS var)
6+
- Fix MessageInput safe-area-inset-bottom being overridden
7+
38
## [0.7.1] - 2026-03-15
49
### Improvements
510
- Landing: replaced two-button language switcher with single toggle button

docs/changelog/v0.7.2.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# v0.7.2 - 2026-03-15
2+
3+
## Bug Fixes
4+
- Fix Android keyboard pushing content up by using visualViewport API
5+
- Add `interactive-widget=resizes-content` viewport meta for proper keyboard handling
6+
- Replace `100dvh` with `var(--app-height)` CSS variable computed from `visualViewport.height`
7+
- Fix MessageInput padding-bottom override (safe-area-inset-bottom was being ignored)

index.html

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,25 @@
44
<head>
55
<meta charset="UTF-8" />
66
<link rel="icon" type="image/svg+xml" href="/vasyapp.svg" />
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content" />
88
<link rel="preconnect" href="https://fonts.googleapis.com">
99
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
1010
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400&display=swap" rel="stylesheet">
1111
<title>Vasyapp</title>
12+
<script>
13+
// Fix Android keyboard pushing content up: use visualViewport to compute real height
14+
function updateAppHeight() {
15+
var vh = window.visualViewport ? window.visualViewport.height : window.innerHeight;
16+
document.documentElement.style.setProperty('--app-height', vh + 'px');
17+
}
18+
updateAppHeight();
19+
if (window.visualViewport) {
20+
window.visualViewport.addEventListener('resize', updateAppHeight);
21+
window.visualViewport.addEventListener('scroll', updateAppHeight);
22+
} else {
23+
window.addEventListener('resize', updateAppHeight);
24+
}
25+
</script>
1226
</head>
1327

1428
<body>

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "vasyapp",
33
"private": true,
4-
"version": "0.7.1",
4+
"version": "0.7.2",
55
"type": "module",
66
"scripts": {
77
"dev": "vite",

src-tauri/Cargo.lock

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src-tauri/Cargo.toml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
[package]
22
name = "telegram-client"
3-
version = "0.7.1"
3+
version = "0.7.2"
44
description = "A Tauri App"
55
authors = ["you"]
66
edition = "2021"

src-tauri/tauri.conf.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"$schema": "https://schema.tauri.app/config/2",
33
"productName": "Vasyapp",
4-
"version": "0.7.1",
4+
"version": "0.7.2",
55
"identifier": "com.suenot.vasyapp",
66
"build": {
77
"beforeDevCommand": "npm run dev",

src/App.css

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,8 +113,7 @@ body {
113113
.app {
114114
width: 100vw;
115115
height: 100vh;
116-
height: 100dvh;
117-
/* Fallback for browsers supporting dvh */
116+
height: var(--app-height, 100dvh);
118117
display: flex;
119118
overflow: hidden;
120119
}

src/components/Layout/MainLayout.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
.main-layout {
22
display: flex;
33
height: 100vh;
4-
height: 100dvh;
4+
height: var(--app-height, 100dvh);
55
width: 100vw;
66
overflow: hidden;
77
background-color: var(--bg-primary);
@@ -1065,7 +1065,7 @@
10651065
/* Fix content to cover screen */
10661066
top: 0;
10671067
left: 0;
1068-
height: 100dvh;
1068+
height: var(--app-height, 100dvh);
10691069
z-index: 20;
10701070
/* Above sidebar */
10711071
}

src/components/Messages/MessageInput.css

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
display: flex;
44
flex-direction: column;
55
position: relative;
6-
padding-bottom: env(safe-area-inset-bottom);
7-
padding: 0 16px 16px 16px;
6+
padding: 0 16px max(16px, env(safe-area-inset-bottom)) 16px;
87
max-width: 800px;
98
width: 100%;
109
margin: 0 auto;

0 commit comments

Comments
 (0)