Add top-level headers to sidenav (flutter#9161)

Closes flutter#9011
atsansone · Jul 31, 2023 · 376ca39 · 376ca39
1 parent 9ef9389
commit 376ca39
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/src/_data/sidenav.yml b/src/_data/sidenav.yml
@@ -62,12 +62,12 @@
       permalink: /codelabs
 
 - divider
+- header: User interface
 
-# TODO(parlough): Rename to Layouts      
-- title: User interface
+- title: Layout
   permalink: /ui/layout
   children:
-    # TODO(parlough): Move to top-level entry
+    # TODO(parlough): Move to top-level entry (https://github.com/flutter/website/issues/9160)
     - title: Building user interfaces
       permalink: /ui
     - title: Layout introduction
@@ -244,6 +244,7 @@
       permalink: /ui/animations/overview
 
 - divider
+- header: Development
 
 - title: Data & backend
   permalink: /data-and-backend

diff --git a/src/_includes/sidenav-level-1.html b/src/_includes/sidenav-level-1.html
@@ -4,7 +4,9 @@
   {%- for entry in include.nav -%}
     {% if entry == 'divider' -%}
       <li aria-hidden="true"><div class="sidebar-primary-divider"></div></li>
-    {% else -%}
+    {% elsif entry contains 'header' -%}
+      <li class="nav-header">{{entry.header}}</li>
+    {% elsif entry contains 'children' -%}
       {% assign id = 'sidenav-' | append: forloop.index -%}
       {% if forloop.index == active_entries[0] -%}
         {% assign isActive = true -%}

diff --git a/src/_sass/components/_sidebar.scss b/src/_sass/components/_sidebar.scss
@@ -98,6 +98,10 @@
       padding: 0 $site-sidebar-side-padding;
     }
 
+    > .nav-header {
+      padding-top: bootstrap.bs-spacer(1);
+    }
+
     > .nav-item {
       &:first-child {
         > .nav-link {