From d41dbd5d2ec7dfc3923f7530f00f143038f69485 Mon Sep 17 00:00:00 2001
From: Christian Maddox <christian.maddox93@gmail.com>
Date: Thu, 5 Dec 2024 11:29:22 -0500
Subject: [PATCH] Fix style for disabled message box. (#579)

---
 assets/css/pa-messages.module.scss                | 12 +++++++-----
 assets/js/components/Dashboard/MessageTextBox.tsx |  5 ++++-
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/assets/css/pa-messages.module.scss b/assets/css/pa-messages.module.scss
index 536fb541..063d1719 100644
--- 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
index d2ca5dc1..8166d6fc 100644
--- 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}