From 674e1fd1ffce7b0711fd9b96d486fb6f44659b4e Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 4 Nov 2023 12:02:41 +0800
Subject: [PATCH] Fix textarea styles leaked to other textareas

---
 src/components/compose.css | 20 +++++++++++---------
 src/components/compose.jsx |  1 +
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/components/compose.css b/src/components/compose.css
index ef6356c..4870063 100644
--- a/src/components/compose.css
+++ b/src/components/compose.css
@@ -136,16 +136,18 @@
   line-height: 1.4;
   border-color: transparent;
 
-  @media (width < 30em) {
-    margin-inline: calc(-1 * var(--form-padding-inline));
-    width: 100vw !important;
-    max-width: 100vw;
-    border-radius: 0;
-    border: 0;
-  }
+  &.compose-field {
+    @media (width < 30em) {
+      margin-inline: calc(-1 * var(--form-padding-inline));
+      width: 100vw !important;
+      max-width: 100vw;
+      border-radius: 0;
+      border: 0;
+    }
 
-  @media (min-width: 40em) {
-    max-height: 65vh;
+    @media (min-width: 40em) {
+      max-height: 65vh;
+    }
   }
 }
 #compose-container textarea:hover {
diff --git a/src/components/compose.jsx b/src/components/compose.jsx
index e504c1b..f5d8a64 100644
--- a/src/components/compose.jsx
+++ b/src/components/compose.jsx
@@ -1417,6 +1417,7 @@ const Textarea = forwardRef((props, ref) => {
   return (
     <text-expander ref={textExpanderRef} keys="@ # :">
       <textarea
+        class="compose-field"
         autoCapitalize="sentences"
         autoComplete="on"
         autoCorrect="on"