Side
No description available
---
import Side from "@components/navigation/side/side.astro";
---
<Side
navData={
[
{
"name": "Getting Started",
"path": "#",
"children": [
{
"name": "Introduction",
"path": "#",
"children": []
},
{
"name": "Installation",
"path": "#",
"children": []
},
{
"name": "Quick Start",
"path": "#",
"children": []
}
]
},
{
"name": "Components",
"path": "#",
"children": [
{
"name": "Blocks",
"path": "#",
"children": [
{
"name": "Hero",
"path": "#"
},
{
"name": "Footer",
"path": "#"
},
{
"name": "Main Nav",
"path": "#"
}
]
},
{
"name": "Elements",
"path": "#",
"children": [
{
"name": "Button",
"path": "#"
},
{
"name": "Icon",
"path": "#"
}
]
},
{
"name": "Typography",
"path": "#",
"children": []
}
]
},
{
"name": "Guides",
"path": "#",
"children": [
{
"name": "Theming",
"path": "#",
"children": []
},
{
"name": "Styling",
"path": "#",
"children": []
}
]
},
{
"name": "About",
"path": "#",
"children": []
}
]
}
/>---
blocks:
_component: navigation/side
navData:
- name: Getting Started
path: '#'
children:
- name: Introduction
path: '#'
children: []
- name: Installation
path: '#'
children: []
- name: Quick Start
path: '#'
children: []
- name: Components
path: '#'
children:
- name: Blocks
path: '#'
children:
- name: Hero
path: '#'
- name: Footer
path: '#'
- name: Main Nav
path: '#'
- name: Elements
path: '#'
children:
- name: Button
path: '#'
- name: Icon
path: '#'
- name: Typography
path: '#'
children: []
- name: Guides
path: '#'
children:
- name: Theming
path: '#'
children: []
- name: Styling
path: '#'
children: []
- name: About
path: '#'
children: []
---Overview
Displays a vertical sidebar with expandable sections for organizing navigation links. Commonly used in documentation sites with nested menus.
Properties
No properties available. Make sure the component has a valid .cloudcannon.structure-value.yml file.