From cb6bf751e9855460edd535c3c56292d03a6ba544 Mon Sep 17 00:00:00 2001
From: inc2734 <inc@2inc.org>
Date: Fri, 27 Aug 2021 14:25:28 +0900
Subject: [PATCH] fix #143

---
 src/css/object/component/_drawer.scss   | 57 +++++++++++++------------
 src/css/object/component/_dropdown.scss | 57 +++++++++++++------------
 2 files changed, 60 insertions(+), 54 deletions(-)

diff --git a/src/css/object/component/_drawer.scss b/src/css/object/component/_drawer.scss
index bf5df20a..afa346dd 100644
--- a/src/css/object/component/_drawer.scss
+++ b/src/css/object/component/_drawer.scss
@@ -126,52 +126,55 @@ Drawer component
     opacity: 0 !important;
   }
 
-  &__menu {
+  &__menu,
+  &__submenu {
     @include _list-unstyled();
+
+    > *:not(:first-child) {
+      @include _margin-top(.5, false);
+    }
   }
 
   &__item,
   &__subitem {
     position: relative;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
     overflow: hidden;
 
     &--has-submenu {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+
+      > * {
+        flex: 1 1 auto;
+      }
+
       > a {
-        padding-right: 1rem;
+        @include _padding-right(.5);
         max-width: calc(100% - 42px);
       }
-    }
-
-    > a {
-      flex: 1 1 auto;
-    }
 
-    > .#{$_prefix}c-drawer__toggle {
-      flex: 0 0 auto;
-      max-width: 42px;
-      width: 100%;
-      overflow: hidden;
-    }
+      > .#{$_prefix}c-drawer__toggle {
+        flex: 0 0 auto;
+        max-width: 42px;
+        width: 100%;
+        overflow: hidden;
+      }
 
-    > .#{$_prefix}c-drawer__submenu {
-      flex: 1 1 100%;
+      > .#{$_prefix}c-drawer__submenu {
+        flex: 1 1 100%;
+      }
     }
   }
 
-  &__item {
-    @include _margin(.5, 0, 0, 1);
-  }
-
   &__submenu {
-    @include _list-unstyled();
-    margin-left: 1em;
-  }
+    @include _margin-top(.5, false);
+    @include _margin-left(.5, false);
 
-  &__subitem {
-    @include _margin(.5, 0, 0);
+    &[aria-hidden="true"] {
+      display: none;
+      visibility: hidden;
+    }
   }
 
   &__toggle {
diff --git a/src/css/object/component/_dropdown.scss b/src/css/object/component/_dropdown.scss
index 3b59aad5..71173f58 100644
--- a/src/css/object/component/_dropdown.scss
+++ b/src/css/object/component/_dropdown.scss
@@ -61,52 +61,55 @@ Dropdown component
     transition-timing-function: ease-out;
   }
 
-  &__menu {
+  &__menu,
+  &__submenu {
     @include _list-unstyled();
+
+    > *:not(:first-child) {
+      @include _margin-top(.5, false);
+    }
   }
 
   &__item,
   &__subitem {
     position: relative;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
     overflow: hidden;
 
     &--has-submenu {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+
+      > * {
+        flex: 1 1 auto;
+      }
+
       > a {
-        padding-right: 1rem;
+        @include _padding-right(.5);
         max-width: calc(100% - 42px);
       }
-    }
-
-    > a {
-      flex: 1 1 auto;
-    }
 
-    > .#{$_prefix}c-dropdown__toggle {
-      flex: 0 0 auto;
-      max-width: 42px;
-      width: 100%;
-      overflow: hidden;
-    }
+      > .#{$_prefix}c-dropdown__toggle {
+        flex: 0 0 auto;
+        max-width: 42px;
+        width: 100%;
+        overflow: hidden;
+      }
 
-    > .#{$_prefix}c-dropdown__submenu {
-      flex: 1 1 100%;
+      > .#{$_prefix}c-dropdown__submenu {
+        flex: 1 1 100%;
+      }
     }
   }
 
-  &__item {
-    @include _margin(.5, 0, 0, 1);
-  }
-
   &__submenu {
-    @include _list-unstyled();
-    margin-left: 1em;
-  }
+    @include _margin-top(.5, false);
+    @include _margin-left(.5, false);
 
-  &__subitem {
-    @include _margin(.5, 0, 0);
+    &[aria-hidden="true"] {
+      display: none;
+      visibility: hidden;
+    }
   }
 
   &__toggle {