What are your tablet settings in the sidebar code ?
sidebar:
active: true
width:
mobile: 0
tablet: 25
desktop: 11
breakpoints:
mobile: 768
tablet: 768
desktop: 1024
What are your tablet settings in the sidebar code ?
sidebar:
active: true
width:
mobile: 0
tablet: 25
desktop: 11
breakpoints:
mobile: 768
tablet: 768
desktop: 1024
hey all, I tried to add a sidebar with just icons but the spacing was all over the bloody place, no matter what I tried, the only way to get it to look right was having words with it.
Has anyone managed to get it working with just icons, I basically want to maximise my tablet real estate.
hi!
I’m having trouble coloring the sidebar.
I think I’m using the right codes but I can’t see the changes in the sidebar.
I also tried to put the original theme but I don’t notice any changes
is there any way to make the background transparent?
sidebar:
clock: false
digitalClock: true
date: true
dateFormat: DD/MM/YYYY
hideTopMenu: false
hideHassSidebar: false
breakpoint:
tablet: 1024
desktop: 1024
width:
tablet: 30
desktop: 20
style: |
:host {
--sidebar-background: #6600FF;
--sidebar-text-color: #000000;
--face-color: #6600FF;
--face-border-color: #FF0000;
--clock-hands-color: #000;
--border-radius: 5px;
box-shadow: inset -38px -3px 11px -28px var(--light-primary-color);
border-radius: 15px 0px 0px 15px;
I struggled with transparency so I just made it the same colour as the rest.
.sidebarMenu li {
color: var(--sidebar-text-color, #000);
}
Hope that helps
+1 for me too pls
I just installed this, great work. Is it possible to change the position of the template message? I would like it above the side menu.
I don’t have a title. Would it be possible to use template message as the title? So that good morning etc is shown at the top.
Hi, does anybody know how to open a browser mod popup window from the sidebar menu? The readme doesn’t go into too much detail on that. I can get it to work from the bottomCard but not from the main menu items.
I got it working in the end. For anyone that is stuck this is how I formatted mine. Obviously change the card type to suit your requirements.
- action: call-service
service: browser_mod.popup
service_data:
content:
type: custom:stack-in-card
cards:
- type: custom:stack-in-card
im having trouble with the icons, they are only visible when i click the names:
sidebar:
theme: Caule Black Green Glass
width:
mobile: 10
tablet: 10
desktop: 10
digitalClock: false
hideTopMenu: true
date: false
sidebarMenu:
- action: navigate
navigation_path: /koket-ny
name: home
active: true
icon: mdi:sofa
- action: navigate
navigation_path: /koket-ny/test-1
name: Huset
icon: mdi:ab-testing
active: true
and so on.
Where did you add this code?
I have managed to change the active icon colour and background colour but I can’t get the active font colour to work. Also trying to change size of clock and date, also make them bold but can’t get this to work either.
Any help appreciated. This is my code
Edit: I got the time and date in bold, there was a ; missing. Still can’t get the selected menu text to change colour. This is what I have:
Edit: Got it working, changed text-color to color.
kiosk_mode:
kiosk: true
sidebar:
title: null
digitalClock: true
date: true
bottomcard: true
style: |
:host {
--sidebar-background: rgb(225, 225, 225)!important;
--sidebar-text-color: rgb(0, 0, 0)!important;
--sidebar-icon-color: rgb(0, 0, 0)!important;
}
.sidebarMenu li.active {
background-color: #000000!important;
text-color: #FFFFFF!important;
font-weight: bold;
}
.sidebarMenu li.active ha-icon {
color: #FFFFFF!important;
}
.digitalClock {
text-align: center;
padding-bottom: 1px;
padding-top: 20px;
font-size: 80px!important;
font-weight: bold;
line-height: 100px;
}
.date {
text-align: center;
font-weight: bold;
}
h1 {
text-align:center;
}
How did you make the sensor to show how many lights or media players are on?
are just helpers or did you use some kind of intigration.
Also intressted in the one about the bins
how do i get the custom card to show under goedenmiddag? now it shows at the bottom and is only visible on desktop on tablet it just drops of and is not visible.
Hello. How to use the sidebar with the new sections functionality? Thank you
background: none;
Is there a way to put weather under the clock?