Fix CSS to avoid doubling the top border

user-interviews · Sep 6, 2024 · 3d9c3e3 · 3d9c3e3
1 parent ea946e7
commit 3d9c3e3
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/src/Accordion/AccordionCollapse.scss b/src/Accordion/AccordionCollapse.scss
@@ -16,3 +16,9 @@
     padding-top: 0px !important;
   }
 }
+ /* If the parent AccordionToggle has a border-bottom applied, remove the top one here */
+.borderBottom {
+  .AccordionCollapse {
+    border-top: none;
+  }
+}
diff --git a/src/Accordion/AccordionToggle.scss b/src/Accordion/AccordionToggle.scss
@@ -9,6 +9,10 @@
     grid-template-columns: auto 24px;
     grid-template-areas: 'content chevron-right';
     padding: 16px 24px;
+
+    &.borderBottom {
+      border-bottom: 1px solid var(--ux-gray-400);
+    }
 
     &.flush {
       padding: 16px 4px;
@@ -27,14 +31,6 @@
     }
   }
 
-  &.collapsed {
-    .AccordionToggle__container {
-      &.borderBottom {
-        border-bottom: 1px solid var(--ux-gray-400);
-      }
-    }
-  }
-
   &--chevron-lateral {
     .AccordionToggle__chevron-left {
       svg {