Mobile
No description available
---
import Mobile from "@components/navigation/mobile/mobile.astro";
---
<Mobile
logoAlt="null" logoSource="null" navData={
[
{
"name": "Home",
"path": "#",
"children": []
},
{
"name": "Products",
"path": "#",
"children": [
{
"name": "All Products",
"path": "#",
"children": []
},
{
"name": "Categories",
"path": "#",
"children": [
{
"name": "Electronics",
"path": "#"
},
{
"name": "Clothing",
"path": "#"
},
{
"name": "Home & Garden",
"path": "#"
}
]
},
{
"name": "Best Sellers",
"path": "#",
"children": []
},
{
"name": "New Arrivals",
"path": "#",
"children": []
}
]
},
{
"name": "Services",
"path": "#",
"children": [
{
"name": "Consulting",
"path": "#",
"children": []
},
{
"name": "Support",
"path": "#",
"children": []
},
{
"name": "Training",
"path": "#",
"children": []
}
]
},
{
"name": "Resources",
"path": "#",
"children": [
{
"name": "Blog",
"path": "#",
"children": []
},
{
"name": "Documentation",
"path": "#",
"children": []
},
{
"name": "Videos",
"path": "#",
"children": []
},
{
"name": "Help Center",
"path": "#",
"children": []
}
]
},
{
"name": "About",
"path": "#",
"children": [
{
"name": "Our Story",
"path": "#",
"children": []
},
{
"name": "Team",
"path": "#",
"children": []
},
{
"name": "Careers",
"path": "#",
"children": []
}
]
},
{
"name": "Contact",
"path": "#",
"children": []
}
]
}
/>---
blocks:
_component: navigation/mobile
logoSource: null
logoAlt: null
navData:
- name: Home
path: '#'
children: []
- name: Products
path: '#'
children:
- name: All Products
path: '#'
children: []
- name: Categories
path: '#'
children:
- name: Electronics
path: '#'
- name: Clothing
path: '#'
- name: Home & Garden
path: '#'
- name: Best Sellers
path: '#'
children: []
- name: New Arrivals
path: '#'
children: []
- name: Services
path: '#'
children:
- name: Consulting
path: '#'
children: []
- name: Support
path: '#'
children: []
- name: Training
path: '#'
children: []
- name: Resources
path: '#'
children:
- name: Blog
path: '#'
children: []
- name: Documentation
path: '#'
children: []
- name: Videos
path: '#'
children: []
- name: Help Center
path: '#'
children: []
- name: About
path: '#'
children:
- name: Our Story
path: '#'
children: []
- name: Team
path: '#'
children: []
- name: Careers
path: '#'
children: []
- name: Contact
path: '#'
children: []
---Overview
A mobile navigation component that opens as a full-screen overlay with expandable menu sections. Optimized for touch interactions. Commonly used inside Main Nav for mobile layouts.
Properties
No properties available. Make sure the component has a valid .cloudcannon.structure-value.yml file.