Use kiosk mode with the compact header instead of the hiding options the custom sidebar provides, works great!
I just tried that and still the sidebar here does not load until a refresh.
Edit: actually hang on. I might need to change yaml on that pageā¦
Edit 2: Yea I added kiosk mode to the yaml on both pages and still does not work.
I only have this for my config:
custom_header:
kiosk_mode: true
sidebar:
digitalClock: true
digitalClockWithSeconds: true
sidebarMenu:
- action: navigate
active: true
name: Home
navigation_path: /hub-panel/home
etc
Maybe it has something to do with the bypass login? Or do you already use that? Maybe that makes any difference.
homeassistant:
name: yourname
auth_providers:
- type: trusted_networks
trusted_networks:
- 192.168.1.0/24
allow_bypass_login: true
- type: homeassistant
api_password: !secret http_password
I do use bypass as well. For casting to the hubs. I have an automation that casts a page to a shield on my bedroom TV when my alarm goes off that needed it too.
I have some stuff in ch that wraps around displaying info Iāll try n remove that. Thanks for helping !!!
Hmm, I also had issues with additional info in the custom header, (like time, outside temp etc). That prevented the header to load.
It worked well for months and all of a sudden it stopped working. Maybe it was the latest update of custom header or Core, donāt know for sure. For the Nest Hub simply create a new Lovelace interface and only use the kiosk mode, should be enough.
man i dont know. I took it out on both pages and have exactly like you. it just wont load the side without a damn refreshā¦
custom_header:
kiosk_mode: true
sidebar:
clock: false
digitalClock: true
sidebarMenu:
- action: navigate
name: Home
navigation_path: /lovelace/arbos-h
ome
Strange, its really ignoring the kiosk mode.
Maybe it has something to do with caching? Did you try to reboot your host?
Try create a new lovelace dashboard with only the basic info of the custom header and custom sidebar?
I use Lovelace in strorage mode.
try reinstalling the custom header via HACS?
good idea Ill try that. I use to use yaml mode but since this now im stuck in doing it in the guiā¦i use the raqw config but stull sucksā¦can you share your config for that? Id much rather have yaml mode back. Well I wanted that storage mode so first one is gui configuredā¦but I havent got around to figuring that outā¦tbis side bar killin me lol.
I just seen thisā¦yours works thoā¦
Iāll share my config later today, not home atm.
Well, I have three dashboards. One for my pc with The compact header, works. One for my phone in kiosk mode, also works, and one for the Nest Hubs in my living room and bedroom with kiosk mode enabled, and that also works without any issueā¦ Iāll get back to you later today;)
Appreciate it.
So this is the most important part of the raw config of the lovelace interface i use for the Nest Hub:
custom_header:
kiosk_mode: true
sidebar:
digitalClock: true
digitalClockWithSeconds: true
sidebarMenu:
- action: navigate
active: true
name: Home
navigation_path: /hub-panel/home
- action: navigate
active: true
name: Lights
navigation_path: /hub-panel/lights
- action: navigate
name: Media
navigation_path: /hub-panel/media
- action: navigate
name: Alarm
navigation_path: /hub-panel/alarmpanel
- action: navigate
name: Camera
navigation_path: /hub-panel/security
- action: navigate
name: Navigate
navigation_path: /hub-panel/navigate
style: |
:host {
--sidebar-background: 'rgba 50, 50, 50, .5';
--sidebar-text-color: #B9B9B9;
--face-color: 'rgba 50, 50, 50, .5';
--face-border-color: 'rgb 84, 84, 84';
--clock-hands-color: #000;
--clock-seconds-hand-color: #216491;
--clock-middle-background: 'rgb 4, 84, 84';
--clock-middle-border: #000;
--border-radius: 5px;
}
template: >
{% if "gft" in states('sensor.trash_today') %} <li>Vandaag GFT</li> {% endif
%}
{% if "papier" in states('sensor.trash_today') %} <li>Vandaag papier</li> {%
endif %}
{% if "plastic verpakkingsafval" in states('sensor.trash_today') %}
<li>Vandaag plastic</li> {% endif %}
{% if "restafval" in states('sensor.trash_today') %} <li>Vandaag
restafval</li> {% endif %}
{% if "gft" in states('sensor.trash_tomorrow') %} <li>Morgen GFT</li> {%
endif %}
{% if "papier" in states('sensor.trash_tomorrow') %} <li>Morgen papier</li>
{% endif %}
{% if "plastic verpakkingsafval" in states('sensor.trash_tomorrow') %}
<li>Morgen plastic</li> {% endif %}
{% if "restafval" in states('sensor.trash_tomorrow') %} <li>Morgen
restafval</li> {% endif %}
{% if states('sensor.current_lights_on_living_room') | float > 1 %}
<li>Beneden {{states('sensor.current_lights_on_living_room')}} lampen
aan</li> {% endif %}
{% if "1" in states('sensor.current_lights_on_living_room') %} <li>Beneden 1
lamp aan</li> {% endif %}
{% if states('sensor.current_lights_first_floor_on') | float > 1 %}
<li>Boven {{states('sensor.current_lights_first_floor_on')}} lampen aan</li>
{% endif %}
{% if "1" in states('sensor.current_lights_first_floor_on') %} <li>Boven 1
lamp aan</li> {% endif %}
{% if states('sensor.current_lights_second_floor_on') | float > 1 %}
<li>Zolder {{states('sensor.current_lights_second_floor_on')}} lampen
aan</li> {% endif %}
{% if "1" in states('sensor.current_lights_second_floor_on') %} <li>Zolder 1
lamp aan</li> {% endif %}
{% if "1" in states('sensor.current_windows_open') %} <li>Boven 1 raam
open</li> {% endif %}
{% if states('sensor.current_windows_open') | float > 1 %} <li>Boven
{{states('sensor.current_windows_open')}} ramen open</li> {% endif %}
{% if "playing" in states('media_player.sonos_woonkamer') %} <li>Sonos
Woonkamer actief</li> {% endif %}
{% if "playing" in states('media_player.sonos_kantoor') %} <li>Sonos Kantoor
actief</li> {% endif %}
{% if "playing" in states('media_player.sonos_badkamer') %} <li>Sonos
Badkamer actief</li> {% endif %}
{% if "armed_home" in states('alarm_control_panel.ha_alarm') %} <li>Alarm
thuis actief</li> {% endif %}
{% if "armed_away" in states('alarm_control_panel.ha_alarm') %} <li>Alarm
afwezig actief</li> {% endif %}
{% if "disarmed" in states('alarm_control_panel.ha_alarm') %} <li>Alarm
inactief</li> {% endif %}
{% if "pending" in states('alarm_control_panel.ha_alarm') %} <li>Alarm
bezig...</li> {% endif %}
{% if "on" in states('binary_sensor.updater') %} <li>Core update
beschikbaar!</li> {% endif %}
{% if "1" in states('sensor.hacs') %} <li>Er is 1 HACS Update
Beschikbaar</li> {% endif %}
{% if states('sensor.hacs') | float > 1 %} <li>Er Zijn
{{states('sensor.hacs')}} HACS Updates Beschikbaar</li> {% endif %}
{% if "on" in states('binary_sensor.door_sensor_front_door') %} <li>Voordeur
Geopend</li> {% endif %}
{% if "on" in states('binary_sensor.door_sensor_back_door') %}
<li>Achterdeur Geopend</li> {% endif %}
title: Nest Hub Panel Interface
views:
- badges: []
cards:
- entities:
- height: 80
size: 20
type: 'custom:gap-card'
type: 'custom:layout-card'
- cards:
- cards:
- color_type: icon
entity: input_boolean.lights_livingroom
icon: 'mdi:home-assistant'
show_name: false
tap_action:
action: toggle
template: living_room_navigate
type: 'custom:button-card'
- color_type: icon
entity: input_boolean.lights_dining
icon: 'mdi:silverware'
show_name: false
tap_action:
action: toggle
template: living_room_navigate
type: 'custom:button-card'
- color_type: icon
entity: input_boolean.lights_movietime
icon: 'mdi:movie-roll'
show_name: false
tap_action:
action: toggle
template: movie
type: 'custom:button-card'
type: horizontal-stack
- entities:
- height: 20
size: 20
type: 'custom:gap-card'
type: 'custom:layout-card'
- current: true
details: false
entity: weather.buienradar
forecast: true
type: 'custom:weather-card'
mode: vertical
style: |
ha-card {
font-variant: small-caps;
background-repeat: no-repeat;
background-color: rgba(50,50,50,0.3);
background-size: 100% 68px;
}
.card-header {
font-size: 20px;
}
type: 'custom:stack-in-card'
icon: 'mdi:home-assistant'
panel: false
path: home
theme: default
title: cast_overview
Is that what you mean by sharing my config? Or are you interested in another config?
Under Resources (Configurationā>Lovelace Dashboardsā>Resources) is the custom header correctly declared as a JavaScript Module? Do you also use the new path for HACS? /hacsfiles/ ?
Thanks. I verified the resource is correct. I meant in your configuration.yaml. You mentioned you use storage mode. I never used the GUI config until 107 and want yaml back.
I also upgraded custom header. I see a lot of guys on that thread have issues and some say the new beta fixed it but not for me
btw love the templates:)
here is mine in caseā¦
Ive been testing with kiosk mode and just disable sidebar. Ive tried different browsers as well/ā¦and of coarse I hold shift to clear cache when doing this.
custom_header:
disable_sidebar: true
header_text: >-
<style> #flipper {color:#999;} #flip {height:24px;overflow:hidden;} #flip >
div > div {color:#fff;height:24px;margin-bottom:24px;display:inline-block;}
#flip div:first-child {animation: show 10s linear infinite;} @keyframes show
{ 0% {margin-top:-144px;} 5% {margin-top:-96px;} 33% {margin-top:-96px;} 38%
{margin-top:-48px;} 66% {margin-top:-48px;} 76% {margin-top:0px;} 100%
{margin-top:0px;}} #flipper p {position:fixed;color:#999; } </style> <div
id=flipper><div id=flip><div><div> Currently -
{{states('sensor.dark_sky_temperature')}}F
{{states('sensor.dark_sky_hourly_summary')}}</div></div><div><div>
Chronovirus Numbers US - {{states('sensor.us_coronavirus_confirmed')}}
People and {{states('sensor.us_coronavirus_deaths')}}
Deaths</div></div><div><div> {{states('sensor.doors_open')}} Doors Open and
{{states('sensor.windows_open')}} Windows Open</div></div><div><div>
{{states('sensor.lights_on')}} Lights On</div></div><div><div> <style>
voice_hide: true
In configuration.yaml I have nothing going on for Lovelace. Did you also try without the header text? Mine was also ignoring the complete custom header with additional header configā¦ After that I am a little bit out of options tbhā¦ I have no clue what stops the custom header from loading. What do you see when you use the element inspector (f12) of your browser when you load for the first time?
yea Ive been testing without it. I dont understand, this is killing me.