Compact Custom Header

Share your Projects! Dashboards & Frontend
717

wouldn’t that be 'var(--paper-item-icon-color)'

718

cool. You do breath in between releases do you…? relax…

1 Like
719

I love @mayker ‘s work but @RomRider is just KILLING it in the new features stakes! I hope neither of them burn out and take some time to enjoy the roses.

720

OH, IT’S ON like donkey kong! You’re going down @RomRider! :smile:

Once I work out the kinks of the current features I’m going to slow down considerably.

I hadn’t noticed that someone took up button-card, need to check out the new features. I stopped using it a while back when development on it slowed and entity-buttons were introduced.

2 Likes
721

You will be astonished at what he’s done with it!

722

@mat44150 @_BaQs
Finally uploaded my final theme! Summer breeze

3 Likes
723

I second this. RomRider’s progress on custom button card has been nothing short of inspiring. It’s as if he’s unlocked potential in Lovelace that no one thought of let alone knew was possible.

724

For sure, CCH and custom button-card have been the two biggest drivers for me to get serious about building out my Lovelace setup. Thanks to @mayker and @RomRider for the continued great work!

4 Likes
725

I second this, both the best cards available!

3 Likes
726

Is anyone else finding that swipe_prevent_default: true has no effect in Safari on iOS when swiping from the edges? This is on -

  • CCH 1.0.3b7
  • iOS 12.2
  • iPhone 7
  • HA 0.92.0

Yep, I’ve cleared my cache.

          - type: custom:compact-custom-header #Compact Custom Header
            main_config: true
            header: true
            options: show
            chevrons: true
            menu: show
            active_tab_color: rgb(181, 142, 49)
            tab_indicator_color: rgb(181, 142, 49)
            exceptions:
              - conditions:
                  user_agent: Macintosh
                config:
                  hide_tabs: 8 to 17
                  voice: false
              - conditions:
                  user_agent: iPad
                config:
                  show_tabs: 0 to 7
                  notifications: hide
                  voice: false
                  menu: show
                  options: show
              - conditions:
                  user_agent: iPhone
                config:
                  show_tabs: 8 to 17
                  notifications: hide
                  voice: false
                  menu: hide
                  options: hide
                  swipe: true
                  swipe_wrap: true
                  swipe_animate: swipe
                  swipe_prevent_default: true
                  swipe_amount: 20
727

Swipe from edge on iOS/safari happens at the OS/app level and cannot be prevented unfortunately.

728

Figured that was the case. You might want to add this tidbit as a note to iOS users on the wiki. I suspect I won’t be the only one who inquires about this.

Thanks for the quick response.

1 Like
729

Updates v1.0.4:

  • Hyphen no longer required for single entries to conditional templates.
  • Provide logs on conditional template errors.
  • Prevent conditional styling to header while in edit mode.
  • Swipe navigation now ignores swipes on header (would previously animate, but not navigate).
2 Likes
730

Yes that works for me, thanks.

731

But…

I am being plagued by errors in my logs

http://192.168.1.25:8123/frontend_latest/app.7bd99ba1.js:2:60391 Uncaught TypeError: Cannot convert undefined or null to object
Connection lost. Reconnecting…

Which I hate to say I think might be being caused by CCH.

Now, I have spent a good few hours on this today, commenting out sections and reloading, adding card-loader, removing all custom cards and frankly I am not sure anymore if I am coming or going. However eventually I decided to remove CCH and I think the errors went away.

Take good note of my use of italics because I am NOT at this stage confident enough to say for sure but I would be grateful if you could consider if this is a possibility and if so how I could help you troubleshoot what is going on or provide you with anything that might help.

I had my suspicions that something was amiss after the 1.0.3 update as at least one of my views changed it’s layout apparently immediately after the upgrade for no obvious reason.
EDIT: I take this bit back, after yet more fiddling I have found out why that was happening - honestly these custom-cards have a mind of their own!

I know you are taking a step back from this so I completely understand if this is too much to ask especially if I am the only one experiencing this. However, if anyone else is reading this, with the new way the log is shown (in hassio) you might be missing the errors as they only appear once with a counter showing how many times it has happened.

1 Like
732

If you check your text logs, they are all there. Also, have you tried card-loader? It’s a custom card that forces cards to load in a specific order. It recently got rid of a few of my errors.

EDIT: You have, I didn’t read your full post. Please ignore me.

733

Searching your issue and this popped up:

Do you experience the same thing as the people in the comments here?

I don’t think that this is coming from CCH (could be wrong). I will look into it though.

734

Keep CCH commented out in your resources section for a while and be sure to interact with HA a good bit, click around to history, hassio tab, etc. and see if the error pops up again. If it does, then we can rule CCH out.

1 Like
735

Hi @mayker,

Is it possible to use Compact Custom Header for setting a different Lovelace UI view for Mobile and Tablet respectively?

Because the width of tablet is wider, causing all my card components to spread across wide width.

Thanks.

736

Yes, make an exception config for the tablet and mobile. If they are always the same tablet and mobile device use user_agent, if not use media_query. Then hide views/tabs to show certain views to one and not the other.