Added smooth transition to sidebar navigation

Author: squidfunk

src/templates/assets/stylesheets/main/components/_nav.scss

@@ -385,7 +385,7 @@
       background-color: transparent;
     }
 
-    // Toggle for nested navigation
+    // Hide nested navigation
     &__toggle ~ & {
       display: flex;
       opacity: 0;
@@ -522,14 +522,32 @@
       }
     }
 
-    // Hide toggle for nested navigation
+    // Hide nested navigation
     &__toggle ~ & {
-      display: none;
+      display: grid;
+      grid-template-rows: 0fr;
+      visibility: collapse;
+      opacity: 0;
+      transition:
+        grid-template-rows 250ms cubic-bezier(0.86, 0, 0.07, 1),
+        opacity            250ms,
+        visibility           0ms 250ms;
+
+      // Navigation list
+      > .md-nav__list {
+        overflow: hidden;
+      }
     }
 
     // Show nested navigation when toggle is active or indeterminate
     &__toggle:is(:checked, :indeterminate) ~ & {
-      display: block;
+      grid-template-rows: 1fr;
+      visibility: visible;
+      opacity: 1;
+      transition:
+        grid-template-rows 250ms cubic-bezier(0.86, 0, 0.07, 1),
+        opacity            150ms 100ms,
+        visibility           0ms;
     }
 
     // Hide navigation title in nested navigation