šŸ”¹ Card-mod - Super-charge your themes!

What?

No, that is the problem. By hiding the header we lose the ability to edit the UI. That is the functionality we want back.

2 Likes

Itā€™s not hiding the header.
Itā€™s making it compact, you keep the edit mode:



@Pirol62 where should it be moved?
Really sorry if Iā€™m having a hard time understanding your issue.

Bug report: card-mod-view has stopped working in 0.116, it needs to account for hui-masonry-view.
Another bug report: You canā€™t style an element inside of shadow roots if it gets deleted and recreated.

Right. Thereā€™s the confusion. You are talking about something completely different. We are talking about adding this to our theme:

  card-mod-root: |
    app-toolbar {
      display: none;
    }

And the fact that it makes the UI uneditable.

Oh. If you use the compact header option instead that should basically do the same thing, but with hiding it in a different way and applying more styles. It does that by setting height to 0 for app-toolbar, and using position to move away the buttons back into usable range.

For the compact header option on the bottom with mobile, does the overflow menu, voice button, and sidebar button matter to you, or do you like a clean, empty header?

  • I like buttons
  • I like a clean header
  • Other, will write down below

0 voters

Iā€™m not sure what yes or no refer to, so I chose other: no the buttons donā€™t matter, yes I want a clean empty header :stuck_out_tongue:

If the majority does want the buttons, I underatand. I would very much appreciate the code in that case to implement it myself.

Sorry, fixed that.

1 Like

The hui-view element has changed the way it works.
Card-mod is still applied to the same place, and should still be applied to the same place - that way it can work even with the new custom views - but themes need to be changed.

@tom_l Next time someone asks someone for a screenshot of what is happening and youā€™re someone else and have a screenshot of nothing happening (?) when you donā€™t even do anything(?), and certainly not the thing thatā€™s discussed (?) - try to provide some context right away and youā€™ll save us all some time.

I have the whole Soft UI cocept going on a few different dashboards designed for different formats and all are using KTibowā€™s dark and light theme set appropriately for sun.sun state with an automation. My problem is that I need some things happening on different dashboards based on the user signed in. How can I, for example, completely disable Header and sidebar for user X but only on Dashboard A? I know I could assign the devices using dashboard A their own theme, but then I lose the dark/light autochanging automation since it will no longer be backend selected. Iā€™m currently at the dentist office with my 3 kids and typing this on my phone, so hopefully it makes sense. Lol

Edit: edited for your sanityā€¦ Some stuff made no sense.

Using Jinja2 templates

Ok but you are never allowed to update your themes again because having to re add all my custom stuff everytime you improve your themes would drive me around the bend. Deleting the single column stuff everytime is enough. Lol

Themes werenā€™t designed for this. Someone needs to add a mod that lets you define jinja2 variables that themes can use

1 Like

Agreed. Someone please take over Custom Header. Thatā€™s how I do all this now.

And, yes, I realize I am being a whiney little baby man right now.

Regarding the survey ā€¦ in my case what I use is the mobile, I would like a header with only the side menu button :sweat_smile:

Okay, so making a new survey. Check all buttons you still want around on mobile devices. (On desktop it wonā€™t change)

  • None at all
  • Sidebar button
  • Voice button
  • Overflow button (think: button you press that opens a menu so you can edit the dashboard)

0 voters

This is pretty much what I was getting at yesterday.

Iā€™m probably only going to add to the confusion, and Iā€™m sorry in advance for that :-).
But what I want is:

  1. On mobile, where horizontal screen real-estate is so very precious: none at all
  2. On desktop, where I have plenty of horizontal and do all my editing: overflow button
    Thank you for any/all efforts!!!

Itā€™s okay, I just updated it. Sorry, didnā€™t realize it was unclear.

3 Likes

Ah. Now you have a great learning opportunity!

https://www.w3schools.com/css/css3_mediaqueries.asp
https://www.w3schools.com/css/css3_mediaqueries_ex.asp

2 Likes