* refactor: eslint config adjusted for better diff's * refactor: stricter linting + dependencies updated * refactoring: paragraph component - component - docs * refactoring: heading component - component - docs * Update docs/components/heading.md Co-authored-by: Ilya Artamonov <ilya.sosidka@gmail.com> * refactoring: link component - component - docs * refactoring: image component - component - docs * refactoring: alert component - component - docs * refactoring: avatar component - component - docs * refactoring: removed unnecessary code - component names come from the file name * refactoring: breadcrumb component - component - docs * refactoring: accordion component - component - docs * refactoring: buttom component - component - docs * refactoring: badge component - component - docs * refactoring: card component - component - docs * refactoring: order of components in docs updated * refactoring: unnecessary semicolons removed * refactoring: button group component - component - docs * refactoring: carousel component - component - docs * refactoring: dropdown component - component - docs * refactoring: footer component - component - docs * refactoring:list-group component - component - docs * refactoring: modal component - component - docs * refactoring: navbar component - component - docs * refactoring: pagination component - component - docs * refactoring: progress component - component - docs * refactoring: rating component - component - docs * refactoring: spinner component - component - docs * refactoring: table component - component - docs * refactoring: tabs component - component - docs * feat: Updated pagination examples * lint: Lister fixes * feat: Sidebar component and some fixes * feat: Input component * feat: Some fixes * feat: Some fixes * chore: update deps * refactor: removed old Modal component * refactor: radio component and some fixes * fix: fixed path error * refactor: Range component * refactoring: timeline component - component - docs * refactor: Select component * refactoring: toast component - component - docs * refactoring: tooltip component - component - docs * refactoring: sidebar component - component - docs * refactoring: input component - component - docs * refactoring: fileInput component - component - docs * refactoring: select component - component - docs * refactoring: textarea component - component - docs * refactoring: checkbox component - component - docs * refactoring: radio component - component - docs * refactoring: toggle component - component - docs * refactoring: range component - component - docs * local configs linted * documentation quick start updated * flowbite-themable refactored to fit new linters and style guide * random linter fixes * refactoring: toast-provider component - component - docs * final linter fixes * lint: Linter fixes * fix: Fixed types * fix: Fixed card component * docs: Updated card examples * fix: Fixed tabs * refactor: Heading component refactoring * Fwb rename - few fixes after component review (#237) * fix: button documentation * fix: model type in range examples * chore: Toast marked as WIP --------- Co-authored-by: Sqrcz <naorniakowski@slashlab.pl> Co-authored-by: Sqrcz <naorniakowski@gmail.com>
76 lines
3.4 KiB
Vue
76 lines
3.4 KiB
Vue
<template>
|
|
<div class="vp-raw flex flex-col relative">
|
|
<fwb-sidebar class="!h-full relative">
|
|
<fwb-sidebar-item>
|
|
<template #icon>
|
|
<svg
|
|
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"
|
|
aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="currentColor"
|
|
viewBox="0 0 22 21"
|
|
>
|
|
<path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z" />
|
|
<path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z" />
|
|
</svg>
|
|
</template>
|
|
<template #default>
|
|
Dashboard
|
|
</template>
|
|
</fwb-sidebar-item>
|
|
<fwb-sidebar-item>
|
|
<template #icon>
|
|
<svg
|
|
class="flex-shrink-0 w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"
|
|
aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="currentColor"
|
|
viewBox="0 0 18 18"
|
|
>
|
|
<path
|
|
d="M6.143 0H1.857A1.857 1.857 0 0 0 0 1.857v4.286C0 7.169.831 8 1.857 8h4.286A1.857 1.857 0 0 0 8 6.143V1.857A1.857 1.857 0 0 0 6.143 0Zm10 0h-4.286A1.857 1.857 0 0 0 10 1.857v4.286C10 7.169 10.831 8 11.857 8h4.286A1.857 1.857 0 0 0 18 6.143V1.857A1.857 1.857 0 0 0 16.143 0Zm-10 10H1.857A1.857 1.857 0 0 0 0 11.857v4.286C0 17.169.831 18 1.857 18h4.286A1.857 1.857 0 0 0 8 16.143v-4.286A1.857 1.857 0 0 0 6.143 10Zm10 0h-4.286A1.857 1.857 0 0 0 10 11.857v4.286c0 1.026.831 1.857 1.857 1.857h4.286A1.857 1.857 0 0 0 18 16.143v-4.286A1.857 1.857 0 0 0 16.143 10Z"
|
|
/>
|
|
</svg>
|
|
</template>
|
|
<template #default>
|
|
Kanban
|
|
</template>
|
|
<template #suffix>
|
|
<span class="inline-flex items-center justify-center px-2 ml-3 text-sm font-medium text-gray-800 bg-gray-100 rounded-full dark:bg-gray-700 dark:text-gray-300">Pro</span>
|
|
</template>
|
|
</fwb-sidebar-item>
|
|
<fwb-sidebar-dropdown-item>
|
|
<template #icon>
|
|
<svg
|
|
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"
|
|
aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="currentColor"
|
|
viewBox="0 0 22 21"
|
|
>
|
|
<path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z" />
|
|
<path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z" />
|
|
</svg>
|
|
</template>
|
|
<template #trigger>
|
|
E-commerce
|
|
</template>
|
|
<template #default>
|
|
<fwb-sidebar-item class="pl-11">
|
|
Products
|
|
</fwb-sidebar-item>
|
|
<fwb-sidebar-item class="pl-11">
|
|
Sign In
|
|
</fwb-sidebar-item>
|
|
<fwb-sidebar-item class="pl-11">
|
|
Sign Up
|
|
</fwb-sidebar-item>
|
|
</template>
|
|
</fwb-sidebar-dropdown-item>
|
|
</fwb-sidebar>
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import { FwbSidebar, FwbSidebarDropdownItem, FwbSidebarItem } from '../../../../src/index'
|
|
</script>
|