fix(styles): small fix when the badge is dismissible and has a nested…

… badge
swisspost · Aug 31, 2023 · f811b40 · f811b40
1 parent dd5d2c7
commit f811b40
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/packages/styles/src/placeholders/badge.scss b/packages/styles/src/placeholders/badge.scss
@@ -30,6 +30,14 @@
     padding-right: 24px/16px + badge.$badge-padding-x;
   }
 
+  &:has(> .badge) {
+    padding-right: 24px/16px + badge.$badge-padding-x;
+  }
+
+  &:has(> .badge + .btn-close) {
+    padding-right: 48px/16px + badge.$badge-padding-x;
+  }
+
   > .badge {
     padding: $size-micro;
     height: badge.$badge-nested-height;
@@ -38,6 +46,9 @@
     background-color: badge.$badge-nested-bg-color;
     border-color: badge.$badge-nested-border-color;
     font-size: badge.$badge-nested-font-size;
+    &:has(+ .btn-close) {
+      right: badge.$badge-padding-x + 24px/16px;
+    }
   }
 
   > .badge,