Merge pull request #205 from rebeccaalpert/message-background

fix(Message): Remove background and adjust padding for Bot messages
patternfly · Oct 10, 2024 · cc77a75 · cc77a75
2 parents d953ff5 + eeb9e35
commit cc77a75
Showing 1 changed file with 7 additions and 3 deletions.
diff --git a/packages/module/src/Message/TextMessage/TextMessage.scss b/packages/module/src/Message/TextMessage/TextMessage.scss
@@ -5,8 +5,7 @@
 // Need to inline shorter text
 .pf-chatbot__message-text {
   width: fit-content;
-  padding: var(--pf-t--chatbot-message--type--padding);
-  background-color: var(--pf-t--chatbot-message--type--background--color--default);
+  padding: var(--pf-t--chatbot-message--type--padding) 0 var(--pf-t--chatbot-message--type--padding) 0;
   border-radius: var(--pf-t--chatbot-message--type--border--radius);
 
   .pf-v6-c-content,
@@ -22,7 +21,7 @@
   }
 
   code {
-    background-color: initial; // this is a temporary fix while design works out what kind of tokens they want to use for the message bubbles; PF does not offer the variety of grays required
+    background-color: var(--pf-t--chatbot-message--type--background--color--default);
     font-size: var(--pf-t--global--font--size--body--default);
   }
 }
@@ -31,6 +30,7 @@
   .pf-chatbot__message-text {
     background-color: var(--pf-t--chatbot-message--type--background--color--primary);
     color: var(--pf-t--chatbot-message--type--text--color--primary);
+    padding: var(--pf-t--chatbot-message--type--padding);
 
     .pf-v6-c-content,
     .pf-v6-c-content--small,
@@ -39,5 +39,9 @@
     a {
       color: var(--pf-t--chatbot-message--type--text--color--primary);
     }
+
+    code {
+      background-color: initial;
+    }
   }
 }