diff --git a/packages/components/src/components/notification/_inline-notification.scss b/packages/components/src/components/notification/_inline-notification.scss index 757f715899a4..43d067aac8ed 100644 --- a/packages/components/src/components/notification/_inline-notification.scss +++ b/packages/components/src/components/notification/_inline-notification.scss @@ -132,10 +132,6 @@ } } - .#{$prefix}--inline-notification--info .bx--inline-notification__icon { - display: none; - } - .#{$prefix}--inline-notification--warning { @include notification--experimental($inverse-support-03, $inverse-02); } diff --git a/packages/components/src/components/notification/_toast-notification.scss b/packages/components/src/components/notification/_toast-notification.scss index dea871f671c3..12c727b30cde 100644 --- a/packages/components/src/components/notification/_toast-notification.scss +++ b/packages/components/src/components/notification/_toast-notification.scss @@ -26,7 +26,7 @@ display: flex; width: rem(288px); height: auto; - padding-left: $carbon--spacing-05; + padding-left: rem(14px); color: $inverse-01; margin-top: $carbon--spacing-03; margin-bottom: $carbon--spacing-03; @@ -122,8 +122,8 @@ .#{$prefix}--toast-notification__icon { flex-shrink: 0; - margin-right: $carbon--spacing-05; - margin-top: $carbon--spacing-04; + margin-right: rem(14px); + margin-top: rem(14px); } .#{$prefix}--toast-notification__details { diff --git a/packages/components/src/components/notification/notification.hbs b/packages/components/src/components/notification/notification.hbs index c9acbee78b61..1be055e09500 100644 --- a/packages/components/src/components/notification/notification.hbs +++ b/packages/components/src/components/notification/notification.hbs @@ -1,4 +1,4 @@ - {{#each items}} -
{{title}}
-{{subtitle}}
-{{subtitle}}
- - {{/is}} + {{#is type "warning"}} + {{ carbon-icon 'WarningFilled20' class=(add @root.prefix (add '--' (add ../variant '-notification__icon'))) }} + {{/is}} +{{title}}
+{{subtitle}}
{{subtitle}}
+ + {{/is}}