feat(InlineMessage): add new type TASK-987 (#5305)

Add new "info" type to `InlineMessage` (basically a blue color).
kobotoolbox · Nov 27, 2024 · 4f5af46 · 4f5af46
1 parent 0474aed
commit 4f5af46
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/jsapp/js/components/common/inlineMessage.scss b/jsapp/js/components/common/inlineMessage.scss
@@ -50,6 +50,11 @@
   .k-icon {color: colors.$kobo-amber;}
 }
 
+.k-inline-message--type-info {
+  background-color: colors.$kobo-bg-blue;
+  .k-icon {color: colors.$kobo-blue;}
+}
+
 // We need a bit stronger specificity here
 .k-inline-message p.k-inline-message__message {
   margin: 0;

diff --git a/jsapp/js/components/common/inlineMessage.tsx b/jsapp/js/components/common/inlineMessage.tsx
@@ -5,7 +5,7 @@ import Icon from 'js/components/common/icon';
 import './inlineMessage.scss';
 
 /** Influences the background color and the icon color */
-export type InlineMessageType = 'default' | 'error' | 'success' | 'warning';
+export type InlineMessageType = 'default' | 'error' | 'success' | 'warning' | 'info';
 
 interface InlineMessageProps {
   type: InlineMessageType;