Dashboards: add page on sections view (#31691)

* Dashboards: add page on sections view

* Add note about grouping

* Rephrase

* Add yaml

* Update source/_includes/asides/dashboards_navigation.html

Co-authored-by: Klaas Schoute <hello@student-techlife.com>

* Update source/_dashboards/sections.markdown

---------

Co-authored-by: Klaas Schoute <hello@student-techlife.com>

source/_dashboards/sections.markdown

@@ -0,0 +1,30 @@
+---
+type: view
+title: Sections (experimental)
+sidebar_label: Sections (experimental)
+description: "Lets you organize your cards in sections on a grid."
+---
+
+The sections view lets you organize your cards in sections on a grid.
+It allows you to group card directly in sections, without having to use horizontal or vertical stack cards.
+
+There are a few options to rearrange cards. You can move cards within the section, 
+move them from one section into another or even move the entire section.
+You can also copy and paste cards.
+
+To see how it works, check out the demo:
+
+<lite-youtube videoid="XyBy0ckkiDU" videoStartAt="2047" videotitle="A Home-Approved Dashboard - Chapter 1: What about Grace?" posterquality="maxresdefault"></lite-youtube>
+
+{% configuration %}
+type:
+  required: false
+  description: "`sections`"
+  type: string
+{% endconfiguration %}
+
+## Related topics
+
+- [Masonry view](/dashboards/masonry/)
+- [Panel view](/dashboards/panel/)
+- [Sidebar view](/dashboards/sidebar/)

source/_includes/asides/dashboards_navigation.html

@@ -6,7 +6,7 @@
     <ul class="divided sidebar-menu">
       <li>{% active_link /dashboards/ Introduction %}</li>
       <li>
-        {% active_link /dashboards/dashboards/ Multiple Dashboards %}
+        {% active_link /dashboards/dashboards/ Multiple dashboards %}
       </li>
       <li>
         {% active_link /dashboards/views/ Views %}
@@ -46,12 +46,12 @@
     <h1 class="title delta">Advanced</h1>
     <ul class="divided sidebar-menu">
       <li>{% active_link /dashboards/features/ Features %}</li>
-      <li>{% active_link /dashboards/header-footer/ Headers & Footers %}</li>
+      <li>{% active_link /dashboards/header-footer/ Headers & footers %}</li>
       <li>{% active_link /dashboards/actions/ Actions %}</li>
       <li>
         <a
           href="https://developers.home-assistant.io/docs/frontend/custom-ui/custom-card/"
-          >Developing Custom Cards
+          >Developing custom cards
           <i class="icon-external-link"></i>
         </a>
       </li>