@mayker, is there a thread for the Lovelace Swipe Navigation plugin? I have a couple questions …
Be kind , it needs a rewrite and is next on the list once Custom Header winds down a bit.
Yea, I switched over to custom header instead of using compact-custom-header. Somehow I overlooked the big giant triangles and large lettering that stated custom-card-header is deprecated and replaced by custom header haha
Yes, this time it worked. Weird. I think I added extra quotes around the string in the first version. Thank you for fixing this for me.
Hi @mayker
latest version solved the active tab issue but introduced another, that is to say, on the mobile device iPhone:
If I click a tab, (and the indicator shows the clicked tab) it doesn’t always change to that tab.
secondly, very often, swiping to a tab currently out of sight, and clicking that tab, the browser does go to that tab, but the tab menu keeps moving left and right, and ends up without having the active tab in sight…
Can’t see the logic yet, and it doesnt happen all the time, but something isn’t right, on mobile.
my mobile settings:
- conditions:
user_agent: iPhone
config:
menu_hide: true
# voice_hide: false
options_hide: true
so I would think nothing special
let me know if this is on the radar, or you need a bug issue on GitHub
Hi,
I have the old version installed, but since a newer version of HA I cannot go to the lovelace config ui anymore.
How can I remove the old version?
Br,
Johannes
If you mean an old version of this project, Custom Header: add ?disable_ch
to the end of your URL
If you mean Compact Custom Header: add ?disable_cch
I found it already, with Edge I was able to go into the Lovellace-UI and change to the new plugin.
Br,
Johannes
This is something that I’ve observed on both the iOS app and in Safari when not using Custom Header, so I’m not sure there’s much I can do about that one. As for the others though (tabs moving around etc), I’m working on it now.
Hi,
HACS show that I have 1.1.3 version but DevTools on Chrome say 1.1.0.
Is it normal or is it suggesting I have a problem (my cache have been cleared and Home Assistant restarted already)
Also, I have lots of errors in DevTools
Thanks for this great addon !
Have you tried uninstalling with HACS and then reinstalling? Also, be sure you don’t have a device that is connected and still using the old version (refresh it)
I’ve been experimenting with @iantrich’s example of displaying the weather on the options button and found that, for me in Google Chrome, padding-bottom was tending to affect the text around it (possibly due to it affecting the height of the icon element). What ended up working for me was doing it like this:
button_text:
options: >-
{{ hours12 }}:{{ minutesLZ }} {{ AMPM }} - <ha-icon style='top: -5px'
icon='mdi:weather-{%- if is_state('weather.dark_sky', 'partlycloudy')
-%}partly-cloudy {%- elif is_state('weather.dark_sky', 'clear-night')
-%}night {%- else -%}{{states('weather.dark_sky')}}{%- endif
-%}'></ha-icon> {{states.weather.dark_sky.attributes.temperature }}°
This uses the top css attribute to set the position of the icon to 5 pixels above the button, which corrects the alignment for me without affecting anything else on the button.
how odd this works for you. If I do that it shows like this:
im wondering if there isn’t a css setting to set it to vertically centered, so we dont have to set specific pixels? wouldn’t vertical-align: middle
work?
well, I guess it does
should have thought about that immediately …
It looks like how it looks depends on the particular icon. I tested it with the icon hardcoded as mdi:weather-pouring and it looked like yours. With mdi:weather-partly-cloudy, which is what it is currently here, it looks like:
Where did you put the vertical-align: middle
? I tried that on the ha-icon like this:
button_text:
options: >-
{{ hours12 }}:{{ minutesLZ }} {{ AMPM }} - <ha-icon style='vertical-align: middle'
icon='mdi:weather-{%- if is_state('weather.dark_sky', 'partlycloudy')
-%}partly-cloudy {%- elif is_state('weather.dark_sky', 'clear-night')
-%}night {%- else -%}{{states('weather.dark_sky')}}{%- endif
-%}'></ha-icon> {{states.weather.dark_sky.attributes.temperature }}°
but that made it look like this:
indeed like this:
button_text:
options: >-
{{ time }} - <ha-icon icon='{{states('sensor.weather_icon')}}' style='vertical-align: middle';></ha-icon> - {{states('sensor.temp_current') }}°
Unfortunately, not all browsers are created equal. Many CSS options render differently depending on the browser, you can see this by viewing this site in multiple browsers. For me the star renders in a slightly different spot using the vertical-align
demo in every browser I’ve tried (and none looked like their sample images below the demo).
Usually it’s not a big deal, but with something this small even one pixel difference is noticeable. It will take some tweaking to make it look how you want in the browser of your choice.
Hello folks,
So I setup my config this way. My goal is to restrict Sarah’s access to only one tabs with url pathway sea. However, once she logs in she can see all the tabs. LL UI specifies user by their unique ID number is this the case with custom header? If not how can I go about fixing this. Any help will be greatly appreciated. On the side note it is my first time using CH.
header_text: Home
conditions:
user: Sarah
config:
hide_help: true
menu_hide: true
show_tabs:
- sea
hide_tabs:
- admin
- mp
- cam
default_tab:
- sea
Are you sure that the user’s name (not username) is in fact “Sarah”? Also, there is no reason to use hide tabs and show tabs at the same time and you don’t need to specify a default tab if there is only one available tab. Try the config below and check that it is the correct user’s name.
header_text: Home
exceptions: # <-- You were missing this.
- conditions:
user: Sarah
config:
hide_help: true
menu_hide: true
show_tabs:
- sea
Edit: you’re also missing “exceptions” in your config.
https://maykar.github.io/custom-header/#configuration/exceptions
Thanks for prompt reply. The name shown in her user profile is Sarah with capital “S”. She uses “sarah” (with small “s”) to log into HA, which I assume is her username. Am I correct? Let me give it a shot and I will get back to you.
Oops, I am blind. It is working like charm. Thank you so much for the help.