diff --git a/src/components/containers/Banner/Banner.module.scss b/src/components/containers/Banner/Banner.module.scss index 3b3b3bd..60a709b 100644 --- a/src/components/containers/Banner/Banner.module.scss +++ b/src/components/containers/Banner/Banner.module.scss @@ -71,7 +71,7 @@ .bk-banner__actions { display: flex; - flex-flow: row-reverse wrap; + flex-direction: row-reverse; align-items: center; gap: bk.$spacing-1 bk.$spacing-7; @@ -103,6 +103,9 @@ } } + // Allow actions to wrap if there is a long message + &:has(.bk-banner__message) .bk-banner__actions { flex-wrap: wrap; } + // Variants &.bk-banner--informational { --bk-banner-color-foreground: #{bk.$theme-banner-informational-border-default};