fix: InlineMessage style (#5064)

Talend · Dec 18, 2023 · 43776f7 · 43776f7
1 parent e7c8941
commit 43776f7
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/.changeset/light-pans-join.md b/.changeset/light-pans-join.md
@@ -0,0 +1,5 @@
+---
+'@talend/design-system': patch
+---
+
+Fix minor side effect w/ InlineMessage component style when used in modal
diff --git a/...s/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.module.scss b/...s/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.module.scss
@@ -1,7 +1,9 @@
 @use '~@talend/design-tokens/lib/tokens';
 
 .inlineMessage {
-	display: inline;
+	align-items: center;
+	display: flex;
+
 	font: tokens.$coral-paragraph-m;
 	color: tokens.$coral-color-neutral-text;
 
@@ -13,10 +15,9 @@
 		margin-right: tokens.$coral-spacing-xxs;
 		width: tokens.$coral-sizing-xxxs;
 		height: tokens.$coral-sizing-xxxs;
-		display: inline-block;
+		display: inline-flex;
 		// Visually align icon in inline mode
 		position: relative;
-		top: 0.3rem;
 
 		svg {
 			width: tokens.$coral-sizing-xxxs;
@@ -51,5 +52,4 @@
 			top: 0.1rem;
 		}
 	}
-
 }