Fix style for disabled message box. (#579)

mbta · Dec 5, 2024 · d41dbd5 · d41dbd5
1 parent c0ca44e
commit d41dbd5
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/assets/css/pa-messages.module.scss b/assets/css/pa-messages.module.scss
@@ -90,11 +90,6 @@
   margin-top: 141px;
 }
 
-.audioText {
-  height: 250px;
-  resize: none;
-}
-
 .reviewAudioCard {
   height: 250px;
   background-color: $cool-gray-15;
@@ -176,6 +171,13 @@
   }
 }
 
+.messageTextBox {
+  height: 250px;
+  resize: none;
+  --bs-secondary-bg: #{$bg-elevation-4};
+  --bs-border-color: #{$cool-gray-30};
+}
+
 .startEndItem {
   flex: 0 1 250px;
 }

diff --git a/assets/js/components/Dashboard/MessageTextBox.tsx b/assets/js/components/Dashboard/MessageTextBox.tsx
@@ -34,7 +34,10 @@ const MessageTextBox = ({
       <Form.Control
         required={required}
         id={id}
-        className={cx(paMessageStyles.audioText, paMessageStyles.inputField)}
+        className={cx(
+          paMessageStyles.messageTextBox,
+          paMessageStyles.inputField,
+        )}
         maxLength={maxLength}
         as="textarea"
         value={text}