Usage
<template>
<fmv-drawer :align="align">
<fmv-sidebar :align="align"
type="dark"
variant="bg-dark">
<div class="sidebar-p-y">
<div class="sidebar-heading">Applications</div>
<!-- Apps menu -->
<fmv-sidebar-menu :menu="apps"
class="sm-active-button-bg" />
<!-- Components menu -->
<div class="sidebar-heading">Components</div>
<fmv-sidebar-menu :menu="components" />
</div>
</fmv-sidebar>
</fmv-drawer>
</template>
<script>
import {
FmvDrawer,
FmvSidebar,
FmvSidebarMenu
} from 'fmv-layout'
export default {
components: {
FmvDrawer,
FmvSidebar,
FmvSidebarMenu
},
data() {
return {
align: 'start',
apps: [{
label: 'Student',
route: '/',
icon: {
type: 'md-icon',
id: 'account_box'
}
}],
components: [{
id: 'uiComponents',
label: 'User Interface',
icon: {
type: 'md-icon',
id: 'tune'
},
open: false,
children: [{
label: 'Forms',
route: '/components/ui/forms'
}]
}]
}
}
}
</script>Frontend Matter
Beautifully crafted Bootstrap themes and templates for modern web apps.
Copyright 2020 © All rights reserved.
Illustrations by Freepik Storyset