Sidebar item
#

Used as link in your VaSidebar.

Examples
#

Simple usage example
#

VaSidebarItem is used with VaSidebarContent (to create paddings) and VaSidebarTitle (to fill all remaining width in VaSidebarItem)

I'm default
I'm centered!
I'm active
Open in GitHub

Colors
#

You can change sidebar default colors

Success hover color
Danger text color
Warning active color (active)
Open in GitHub

Highlight active VaSidebarItem
#

It is possible to have multiple VaSidebarItem highlighted. You can choose your own way to highlight an active item. Even if you want to activate a few VaSidebarItems.

Home
Docs
Media
Open in GitHub

VaSidebarTitle and VaIcons
#

VaSidebarTitle used to fill all remaining free space in VaSidebarItem. We can also add any other components (like VaIcon, VaChip or VaButton).

Home
Docs (I'm active)
GO TO PARTY!
Something cool
New!
Open in GitHub

Advanced case with VaAccordion
#

VaSidebarItem can be used with VaAccordion and VaCollapses.

Home
Docs
Components
Open in GitHub

API
#

Props #

NameDescriptionTypesDefault
active

Boolean

false

activeClass

String

-

activeColor

String

"primary"

append

Boolean

-

borderColor

String

-

disabled

Boolean

false

exact

Boolean

-

exactActiveClass

String

-

hoverColor

String

-

hoverOpacity

Number

0.2

href

String

-

preset

String

-

replace

Boolean

-

tag

String

"span"

target

String

-

textColor

String

-

to

String | Object

-