This card adds a sidebar to your interface which you can configure globally so every page has the sidebar. It can replace your top navigation but can also give extra functionality.
!!! It is work in progress hope some people wanna use it and test the card to help improve it 
!!!
Please visit the GitHub repository for installation and usage instructions.
Great work @DBuit - thanks!
Here are some initial observations:
action: toggle it works the first time but then trying to toggle again will not work unless you refresh the screen. I’ve tried this with a lock entity and a light entity and both behave the same waysidebarMenu but by looking at it you have no way of knowing the current state of the entity (same applies to light or another entity)Hey,
Thanks for trying it out. Will look at your findings!!
Just released small fix for error in HASS 0.106
I just updated the card and changed the structure. You now need to set the card in your views i did this so i get state updates of entities this way the toggle can work but you can also display an active state when a light is on. Like @mkhattab suggested.
I also added icon option for the menu, example:
- action: toggle
entity: light.beganegrond
name: Lichtstrip
state: light.beganegrond
icon: mdi:led-strip-variant
So the icon is new, and the state is used to toggle the item on or off based on the entities state.
Also the base configuration is different:
resources:
- url: /local/sidebar-card.js?v=0.0.1
type: module
sidebar:
title: "Sidebar title"
views:
- title: "Home"
cards:
- type: "custom:sidebar-card"
cards:
- type: "custom:homekit-card"
....
Before the html was injected so only the global sidebar: config was needed this is still needed! but you also need to add a card with type custom:sidebar-card this card as a cards option just place your current cards config in there and it should be all good!
New version is also on HACS if you don’t change your config with the cards in your view the sidebar won’t appear!
I like the idea of a custom side bar, but not to show the views…
I use tiles to go to the different views instead of putting it in the top header or the sidebar…
What i do would love is to replace the current sidebar , not sure if thats possible…
and to put in the items to go to the settings and stuff in yours…
@DBuit Thanks for considering my suggestion.
The ReadMe says sidebarMenu is optional but I can never get this card to work without having to add a sidebarMenu. I added it to the global view but I’m wondering how this will work under the individual views.
sidebarMenu or is it optional?cards:
- type: "custom:sidebar-card"
sidebarMenu:
Im confused. So do we add a card the regular way or does this card go in the raw config?
You need both the global config on the level as views just as it was before.
There you define what the sidebar should show so that is the place you define sidebarMenu for example.
In the views you wanna display the sidebar you set the sidebar-card as first card. This card only needs 1 more property and that is cards: so all other cards in this view go in there.
Hope this makes it more clear.
Forget about the changes i made yesterday XD
I will change it back today so only the global config on views level is needed and it will update based on entity states.
Hello guys,
I just released V0.1 wich changes back yesterdays work haha.
So only global configuration sidebar: is needed and it will be added everywhere and it also updates on entity state changes so stuff that @mkhattab metioned are possible now 
@DBuit it is still asking me for sidebarMenu
Here is my config (global- before defining my views):
sidebar:
title: "Home"
digitalClock: true
title: Home
views:
and this is the error I am getting:
Error: You need to define sidebarMenu
title: Home
digitalClock: true
breakpoints:
tablet: 1024
mobile: 768
type: 'custom:sidebar-card'```I also don’t know why it’s showing breakpoints in the error. I haven’t defined them as you can see
@mkhattab checked the code quick im wrong, it is set that you need sidebarMenu i will change that later!
Thanks mate. You rock!
Since V0.1, sidebar does not show anymore, even with the simpliest configuration.
If I understand correctly, just the global conf (in my ui-lovelace.yaml) is required. Am I right ?
EDIT: humm seems a cache problem, even after several CTRL-F5… anyway…
Thank for this great component. I will continue my tests
EDIT2: Just noticed that active state when using navigate action does not work
@jncanches you sure that the navigation path is exactly the same as the path the page is you are viewing? it just checks current url path with the path you have in the config.
Thanks @DBuit - working very well now!
The only small thing I’ve noticed so far is that lock entities do not seem to update the state in the sidebar. I’ve tried lights and switches and they reflect the state very well but lock does not work. It always appears yellow (on) irrespective of the actual state. Toggling the lock entity works but it’s just the state display which needs correction.
I think the problem is that when state equals to off OR unavailable it shows as off else is shows on buy locks uses locked and unlocked as States i Will add Dome config options to set the states