Added description for interactie messages for simulator

glific · Jul 16, 2021 · 4533384 · 4533384
1 parent 861ded5
commit 4533384
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/src/containers/Chat/ChatMessages/ListReplyTemplate/ListReplyTemplate.module.css b/src/containers/Chat/ChatMessages/ListReplyTemplate/ListReplyTemplate.module.css
@@ -30,12 +30,18 @@
   justify-content: space-between;
   text-transform: none !important;
   font-weight: 400 !important;
+  text-align: left;
+}
+
+.ListItemChat > span > div > :last-child {
+  font-size: 12px;
 }
 
 .ListItem {
-  font-size: 12px !important;
+  font-size: 11px !important;
   width: 100%;
   font-weight: 300 !important;
+  text-transform: none !important;
 }
 
 .ListItem > span {
@@ -47,6 +53,12 @@
   color: #073f24;
 }
 
+.ListItem > span > div > :last-child {
+  font-size: 9px !important;
+  text-align: left;
+  color: #073f24;
+}
+
 .Drawer {
   background: white;
   z-index: 100;

diff --git a/src/containers/Chat/ChatMessages/ListReplyTemplate/ListReplyTemplate.tsx b/src/containers/Chat/ChatMessages/ListReplyTemplate/ListReplyTemplate.tsx
@@ -53,7 +53,10 @@ export const ChatTemplate: React.SFC<TemplateProps> = (props) => {
               className={styles.ListItemChat}
               onClick={() => setCheckedItem(option.title)}
             >
-              <div>{option.title}</div>
+              <div>
+                <div>{option.title}</div>
+                <div>{option.description}</div>
+              </div>
               <div>
                 <Radio
                   value={option.title}
@@ -142,7 +145,10 @@ export const ListReplyTemplateDrawer: React.SFC<ListTemplate> = (props) => {
               className={styles.ListItem}
               onClick={() => setCheckedItem(option.title)}
             >
-              <div>{option.title}</div>
+              <div>
+                <div>{option.title}</div>
+                <div>{option.description}</div>
+              </div>
               <div>
                 <Radio
                   value={option.title}