Finalize CSS needed for arrows in accordion menus

diff --git a/scss/components/_accordion-menu.scss b/scss/components/_accordion-menu.scss
index f1ba251e72b6c373789354504d3b4012c5b134b7..af48090860bf472153d42f651c2e2894f7744aa7 100644 (file)
--- a/scss/components/_accordion-menu.scss
+++ b/scss/components/_accordion-menu.scss
@@ -7,19 +7,22 @@
 $accordionmenu-arrows: true;
 
 @mixin foundation-accordion-menu {
-  [data-accordion-menu] {
-    @if $accordionmenu-arrows {
-      .has-submenu > a {
-        position: relative;
+  @if $accordionmenu-arrows {
+    .is-accordion-submenu-parent > a {
+      position: relative;
 
-        &::after {
-          @include css-triangle(6px, $primary-color, down);
-          position: absolute;
-          top: 50%;
-          margin-top: -6px;
-          right: 1rem;
-        }
+      &::after {
+        @include css-triangle(6px, $primary-color, down);
+        position: absolute;
+        top: 50%;
+        margin-top: -4px;
+        right: 1rem;
       }
     }
+
+    .is-accordion-submenu-parent[aria-expanded="true"] > a::after {
+      transform-origin: 50% 50%;
+      transform: scaleY(-1);
+    }
   }
 }

diff --git a/scss/foundation.scss b/scss/foundation.scss
index 742bb212c2b1461e97ad40651565875f02d54dac..177cc8fdb6200df52e8f33b4f736b69e8cef18bc 100644 (file)
--- a/scss/foundation.scss
+++ b/scss/foundation.scss
@@ -63,6 +63,7 @@ $foundation-version: '6.0.0-alpha.1';
   @include foundation-visibility-classes;
   @include foundation-float-classes;
   @include foundation-accordion;
+  @include foundation-accordion-menu;
   @include foundation-badge;
   @include foundation-breadcrumbs;
   @include foundation-button-group;