commit 0e034ef7b8fd752df89eb0ca850520a875f1012b
parent df662797dbe9ad47ce2de43dc2c30cef714f07ec
Author: Hunter
Date: Tue, 29 Jul 2025 14:55:15 -0400
mobile: attempt to respond to orientation changes
Diffstat:
1 file changed, 23 insertions(+), 2 deletions(-)
diff --git a/index.html b/index.html
@@ -136,8 +136,8 @@
}
}
- /* Mobile keyboard state - hide preview when keyboard is open */
- @media (pointer: coarse), (pointer: none) {
+ /* Mobile keyboard state - portrait mode (height > width) */
+ @media (pointer: coarse) and (max-aspect-ratio: 1/1), (pointer: none) and (max-aspect-ratio: 1/1) {
body.mobile-keyboard-open .preview-pane {
display: none;
}
@@ -149,6 +149,20 @@
}
}
+ /* Mobile keyboard state - landscape mode (width > height) */
+ @media (pointer: coarse) and (min-aspect-ratio: 1/1), (pointer: none) and (min-aspect-ratio: 1/1) {
+ body.mobile-keyboard-open .preview-pane {
+ display: none;
+ }
+
+ body.mobile-keyboard-open .editor-pane {
+ width: 100%;
+ height: var(--visible-height, 100vh);
+ order: 1;
+ overflow: hidden;
+ }
+ }
+
</style>
</head>
<body>
@@ -472,6 +486,13 @@
if (!isMobileDevice()) return;
const currentHeight = window.visualViewport ? window.visualViewport.height : window.innerHeight;
+
+ // Detect potential orientation change: very large height difference when no keyboard activity
+ // Use a higher threshold to avoid interfering with keyboard detection
+ if (!wasKeyboardOpen && !isEditorFocused && Math.abs(initialViewportHeight - currentHeight) > 300) {
+ initialViewportHeight = currentHeight;
+ }
+
const heightDifference = initialViewportHeight - currentHeight;
const isKeyboardOpen = heightDifference > keyboardOpenThreshold;