I was able to remove a ton of blank cards by defining the margins/blank cards in the main view and using the button card templates: https://gitlab.shane.app/home-server/hass-config/blob/d9056ee85165b5de3a6f706236427a53777808de/lovelace/views/main.yaml
No need to apologize, it happens to everyone. I am just thankful that you are sharing your setup, I am learning a lot (even if you move so fast en changing your code it hard to keep track 
)
Yes I know, the more I do this the faster some stuff goes. However I only do it because most of the time I forget to back it up and so I am stuck on rewriting the things I started changing. Honestly it motivates me to continue looking for better solutions.
Anyways, I would suggest you to either clone or just simply download the entire repo to your computer. That way you can continue working on what you were working on. And it might make it easier to compare files.
I donât think I will do a lot of redesigning any time soon now. I will most probably just declutter a bunch of code and add new features. But I am pretty happy where it is at atm.
I have downloaded the repo so thatâs not a issue. But as you say, you fins beter solutions and I am al up for that as well and I am learning a lot of new ways to do things from you and use the basic setup but whit changes that suits me.
By the way @jimz011, have you done anything special to get all that !include to work? I have a hard time to get !include to work in more then one level
1 Like
Nothing special no, the includes all work fine, itâs just the spacing in particular which can be a pain. Another thing is that includes have to match or nothing will load.
One of my subs said I should share a blank secrets.yaml as that would make the setup run out of the box (unfortunately I donât have a test environment setup at the moment so I can not test this).
I will upload the blank file later today. It should make startup a lot easier when copying from zero.
Changes (27/07/2019)
Minor changes only, rearranged themes, you will have to adjust your automations to use the correct name. Naming looks better in the HA menuâs now.
- Rearranged themes, themes.yaml and themes folder have changed files, please update your automations as well.
- Added a new theme, just for testing purposes to see how fast I can create new colors. This took me less than 10 minutes.
- Uploaded a dummy secrets.yaml file. This should help starting this setup when copying the entire repo. It will make troubleshooting a lot easier and will help you to get you going a LOT faster!
Screens of the included experimental theme below:
4 Likes
Hello Fellow HA users/addicts/hobbyists. I have been getting a LOT of questions lately about my lovelace configuration, but also a lot of questions about other stuff related to HA. For this purpose I have set up some whatsapp and discord channels. These channels are free to join and are meant for all of us to help each other out. These channels are not official channels! If you happen to have whatsapp you can also join the whatsapp group (Dutch only)
The discord channel has 4 channels with 4 languages (English, Dutch, French and German). Feel free to use any of the channels you desire as long as you speak the correct language in their designated channels. If you want to join the discord server please click on the following link:
There is also a Dutch Whatsapp channel if you prefer that (or join em both)
Enjoy!
1 Like
Just want to chime in and say thanks again for all of your work. Iâve learned a ton just reading through your files and have used your ideas as the base for my own setup. I appreciate your documentation and thoroughness.
1 Like
âŚAnd just like that I actually have a roadblock I have hit! My labels (from light-template) have disappeared completely when they used to work just fine. I even tried solving the issue by one for one copying the light-template.yaml code but they labels are still missing.
Has anyone else ran into this issue?
Edit: Solved the issue when I realized I had updated Button-Card.
âlabel_template:â is now just âlabel:â and there has to be three brackets â[[[â before and â]]]â after the template.
label: >
[[[
var bri = Math.round(entity.attributes.brightness / 2.55);
return (bri ? bri : '0') + '%';
]]]
1 Like
Yes, that is correct. I havenât updated the repo with this yet. But that is correct.
After almost 2 weeks of silence there is a very large update coming. This update will improve performance MASSIVELY. No more conditional cards for multi users. Instead they will be hidden views. Setup will function exactly like you were used to but better, faster and with more attention to detail.
At the same time, I have changed a lot of small design elements to make the setup more consistent. This means that heigths and styles have changed on some pages and should be the same design on every page in my setup.
And because I was busy working on this, I have also made it better for use with ipads in landscape mode. Yes the prefered mode will still be portret mode l, but many parts of the setup will now have support for landscape mode.
Here is a teaser:
Expect this to be up tonight or tomorrow. Stay tuned!
8 Likes
My sincere apologies for the massive rework and the really long change notes, but I feel this is important and I am pretty sure that this update will be (despite the rework) appreciated greatly as it has gotten so much easier, enjoy!
Changes (05/08/2019) (*note: This setup will work perfectly fine with 0.97.x however themes only seem to work when I throw an automation at it (this means it will be set for all users), the dynamic standard themes (day/night) will work just fine, though for now setting a theme per user does not work. If setting globally use the lovelace button I created and the corresponding automations (or make your own)! It probably has to do with the way I have themed this and might require a rewrite.
A very very great summer to all of you, I hope you enjoy your summer. Today I have a great update for all of you. This update is massive! Why? Well remember that I wanted to experiment with conditional cards and more users? Well guess what I was not satisfied with the result. Yes I was satisfied with how it looked, but not the way it was coded. It was extremely slow to a point my old iPad Air wouldnât want to load this setup anymore. So this time around I have rewritten every single page in the setup and boy you are going to love this! (sorry for the ones that were adopting my previous setup, but this will make your life, and mine, a lot easier).
So lets talk about what has changed. For this release I have changed a lot of simple stuff. My setup was way too complicated and even I got lost in it. Now it is as simple as this: Every menu item (what used to be popup cards) are now just separate views. This is far easier to maintain. Extremely easy to edit and even easier to get it running as you can now work view by view. Performance has gone up massively. It loads about 2 to 3 times faster than the previous setup whilst having added a bit more features. The setup will work EXACTLY the same as before and you might not see the difference at first glance. I have worked out a lot of small details that were bugging me and I have redesigned the top part of the screen on every page so that the setup is now consistently the same on every view.
What does this mean for multi-user setup? Well nothing! It means you donât need input_booleans and a bunch of conditional cards anymore to reach te same result. What does it mean for my old setup? Well, I suggest starting over! (I am terribly sorry). But after a week of testing, this is actually a config I am comfortable with to say I will not change the way this works. Obviously I will be continuing working on the setup. But I am actually very very happy on how the current method turned out. You might wonder if you see all those tabs in the header then? Well no, the header is hidden on smartphones now. And on an ipad/tablet the header only shows the first 5 tabs (just like it used to be). All other tabs are hidden, you will not be able to swipe to them by accident and you will not be able to access them from the header at all. Everything will look and feel exactly like it was, just better! Ofcourse for convenience the first 5 tabs (which were already there) are still swipable.
All Changes:
- Completely rewritten lovelace setup for performance, ease of use and code reduction
- Removed almost 2000 lines of code (with the same end result yay)
- Added a quickmenu to every page for quickaccess to common views, the buttons change depending on the view you are on.
- Added a dog picture elements on the frontpage
- Groundwork for a decent landscape tablet mode, at the moment most of the elements are already great for use on a tablet in landscape mode. Unfortunately some elements will still look better on portret mode like the vacuum control panel. But nevertheless it is looking really great for the future. For screenshots please check the home assistant community website: Homekit Infused 5 (HKI) v2023.1.3
- Removed the header on all devices. My ipad still has a header which is added to the exceptions with CCH
- Removed all conditional-cards that functioned as a popup card to use the new views instead
- All input_booleans that had a name are replaced with a dummy one. Buttons will now just navigate you to the right view.
- Changed titles, headers etc to be more consistent with the rest of the setup.
- Now when the alarm is activated, the frontpage buttons will hide and the weather panel will be changed with a quickaccess menu, this is to prevent accidental presses in the interface whilst not being home and will prevent the alarm from going off for no reason but human error e.g. phone is unlocked, in your pants and you accidentally press a light button in your pocket, light turns on, sensor gets tripped, boom alarm goes off!. (this has never happened to me, but still this change is nice). The weather bar at the top will become a quickmenu with camera/menu/alarm buttons. So you can quickly access your cameraâs and alarm system. And if you really really have to whilst the alarm is activated, you can still go into the menu where you have access to everything.
- Decluttered A LOT, this includes the blank-card I used to create a gap between the borders of the screen. Each button is now 1 line! (I have had many suggestions to use a decluttering card for this, but I actually think this is much easier as it is just a single line, just make sure the path is correct)
- Minor changes to the vacuum control center to look better on the provided dark theme
- Added missing wallpapers and moved all unused images to another folder. This will make searching for the right image so much easier no?
- Many many little bugfixes and changes to detail.
Videos from this release:
Full Video: (a full overview of my setup on a smartphone)
Tablet View: (srry my tablet is slow and old but you get the idea)
Quick Menu: (this is visible on all other views by default and is non-swipable, except for the homescreen)
Alarm Interface Lock: (the quick menu will popup automatically when the alarm is activated)
4 Likes
Really great work!!
I will upload voiced videos with explanations soon. I might also do a video on my smarthome if that interests people. Nothing special though.
But first up will be detailed videos on this setup and as to why I made some decisions. Keep in mind that I am not a youtuber so please forgive me if the quality of the videos arenât that professional XD.
You can expect these videos very soon in the upcoming week.
2 Likes
Hi! Awesome work! 
I wonder what this is?
- namesensor: !secret jimsensor
It is a sensor with my email address in it. Didnât want to make my email address public 
1 Like
Do you ever see this error in the web console? I removed the card-loader as I noticed you removed them also in .97 and I donât have those errors I had before but now I get this error sometimes,
ReferenceError: regeneratorRuntime is not defined
EDIT: Nevermind, finally tracked it down to the tracker-card
Hi! i am trying to get climate.yaml to work but all i get is the button and nothing happens when i press it.
I am using MILL heaters and Sensibo AC controller.
Is there anything i am missing?
Here is my code: (or your code 
)
title: Climate
path: climate
cards:
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: back_button
variables:
- title: Climate Control
- name: Thermostat
- button-name: weather
- icon: weather-sunny
- path: weather
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: climate_card
variables:
- entity: climate.kjokken
- type: custom:decluttering-card
template: climate_card
variables:
- entity: climate.thale
- !include ../decluttering_templates/blank-card.yaml
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: switch_button_card
variables:
- entity: input_boolean.turn_on_ac
- name: Thale
- icon: radiator
- aspect_ratio: 2/1
- show_label: false
- margin-right: 120px
- size: 15%
- type: custom:decluttering-card
template: switch_button_card
variables:
- entity: input_boolean.turn_on_ac
- name: AC Stue
- icon: radiator
- aspect_ratio: 2/1
- show_label: false
- margin-right: 120px
- size: 15%
- !include ../decluttering_templates/blank-card.yaml
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: climate_card
variables:
- entity: climate.kjokken
- type: custom:decluttering-card
template: climate_card
variables:
- entity: climate.vetle
- ambient_temperature: sensor.romtemperatur_vetle
- !include ../decluttering_templates/blank-card.yaml
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: switch_button_card
variables:
- entity: input_boolean.turn_on_ac
- name: Kjøkken
- icon: radiator
- aspect_ratio: 2/1
- show_label: false
- margin-right: 120px
- size: 15%
- type: custom:decluttering-card
template: switch_button_card
variables:
- entity: input_number.vetle_ovn_temp
- name: Vetle
- icon: radiator
- aspect_ratio: 2/1
- show_label: false
- margin-right: 120px
- size: 15%
- !include ../decluttering_templates/blank-card.yaml
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: header_text
variables:
- content: '##### Temperature'
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: romtemperatur_kjokken
- name: Kjøkken
- line_color: '#ffb414'
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: romtemperatur_thale
- name: Thale
- line_color: '#ffb414'
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: romtemperatur_vetle
- name: Vetle
- line_color: '#ffb414'
- !include ../decluttering_templates/blank-card.yaml
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: temperatur_stue
- name: Stue
- line_color: '#ffb414'
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: temperatur_drivhus
- name: Drivhus
- line_color: '#ffb414'
- type: custom:button-card
color_type: blank-card
aspect_ratio: 1/1
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: header_text
variables:
- content: '##### Humidity'
- type: horizontal-stack
cards:
- !include ../decluttering_templates/blank-card.yaml
- type: custom:decluttering-card
template: mini-graph-card
variables:
- entity: fuktighet_stue
- name: Stue
- line_color: '#1427ff'
- type: 'custom:button-card'
color_type: blank-card
styles:
card:
- height: 10px
How does this target the Tablet? Do you sign into the tablet with a dedicated user called âHome Assistantâ?
That is correct. It will show the same for all other users, except for the ipad. I did this so it looks better on ipad and second it adds a camera view to the frontpage just for ipads/tablets.