diff --git a/src/components/ui/TextArea.tsx b/src/components/ui/TextArea.tsx
index f91b428689fc8270ee0a521e22c938d2257648bf..d61e43c79eddab2b543f864169fd6fcea0206a68 100644
--- a/src/components/ui/TextArea.tsx
+++ b/src/components/ui/TextArea.tsx
@@ -1,7 +1,3 @@
-// import classNames from "classnames";
-// import { memo } from "preact/compat";
-// import styles from "./TextArea.module.scss";
-// import { useState, useEffect, useRef, useLayoutEffect } from "preact/hooks";
 import styled, { css } from "styled-components";
 
 export interface TextAreaProps {
diff --git a/src/context/Theme.tsx b/src/context/Theme.tsx
index a348dd02a1cb01b6044a322bf6f7869044e5f9e5..f0e6db40478006edf4af7cc16b88e38373ddce5f 100644
--- a/src/context/Theme.tsx
+++ b/src/context/Theme.tsx
@@ -2,6 +2,7 @@ import { isTouchscreenDevice } from "../lib/isTouchscreenDevice";
 import { createGlobalStyle } from "styled-components";
 import { connectState } from "../redux/connector";
 import { Children } from "../types/Preact";
+import { useEffect } from "preact/hooks";
 import { createContext } from "preact";
 import { Helmet } from "react-helmet";
 
@@ -126,6 +127,14 @@ function Theme(props: Props) {
         ...props.options?.custom
     };
 
+    useEffect(() => {
+        const resize = () => document.documentElement.style.setProperty('--app-height', `${window.innerHeight}px`);
+        resize();
+
+        window.addEventListener('resize', resize);
+        return () => window.removeEventListener('resize', resize);
+    }, []);
+
     return (
         <ThemeContext.Provider value={theme}>
             <Helmet>
diff --git a/src/lib/TextAreaAutoSize.tsx b/src/lib/TextAreaAutoSize.tsx
index 46c4e9f71f7ff5aa2e7fe93e5d625074218b9fb5..bfc515b071a8dd63f5f3f3709f4c74e0b431368a 100644
--- a/src/lib/TextAreaAutoSize.tsx
+++ b/src/lib/TextAreaAutoSize.tsx
@@ -1,6 +1,7 @@
-import TextArea, { DEFAULT_LINE_HEIGHT, DEFAULT_TEXT_AREA_PADDING, TextAreaProps, TEXT_AREA_BORDER_WIDTH } from "../components/ui/TextArea";
 import { useEffect, useRef } from "preact/hooks";
 import { internalSubscribe } from "./eventEmitter";
+import { isTouchscreenDevice } from "./isTouchscreenDevice";
+import TextArea, { DEFAULT_LINE_HEIGHT, DEFAULT_TEXT_AREA_PADDING, TextAreaProps, TEXT_AREA_BORDER_WIDTH } from "../components/ui/TextArea";
 
 type TextAreaAutoSizeProps = Omit<JSX.HTMLAttributes<HTMLTextAreaElement>, 'style' | 'value'> & TextAreaProps & {
     forceFocus?: boolean
@@ -33,6 +34,7 @@ export default function TextAreaAutoSize(props: TextAreaAutoSizeProps) {
             ref.current.focus();
         }
 
+        if (isTouchscreenDevice) return;
         if (autoFocus && !inputSelected()) {
             ref.current.focus();
         }
diff --git a/src/pages/RevoltApp.tsx b/src/pages/RevoltApp.tsx
index f59844df02e5c5482460c68bbefe72621a886f31..9b8cbcd66e9e8ba04684ec9ae3766ffec83e8556 100644
--- a/src/pages/RevoltApp.tsx
+++ b/src/pages/RevoltApp.tsx
@@ -41,7 +41,7 @@ export default function App() {
     return (
         <OverlappingPanels
             width="100vw"
-            height="100vh"
+            height="var(--app-height)"
             leftPanel={inSpecial ? undefined : { width: 292, component: <LeftSidebar /> }}
             rightPanel={(!inSettings && inChannel) ? { width: 240, component: <RightSidebar /> } : undefined}
             bottomNav={{
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
index 3335848c389579b438161092a26bd1d748c76b68..14024c1681fa7d10df538442187d4bc0b0798642 100644
--- a/src/styles/_variables.scss
+++ b/src/styles/_variables.scss
@@ -1,3 +1,4 @@
 :root {
+    --app-height: 100vh;
     --sidebar-active: var(--secondary-background);
 }