Badges in footer instead of header

Configuration Frontend
1

Is there a way to move the badges bar to the footer of Lovelace?

I use badges on my kiosk to indicate anything wrong in the house, like low batteries or unlocked doors. So every time you open or unlock a door, the badges bar appears and pushes the content of the screen down. I would much rather have the badges bar appear at the empty area at the bottom of the page just for aesthetics.

In general I actually think that having the badges as a footer overlay would make more sense as a default since the cards are always aligned at the top of the screen…

2

Card-mod can do it. See this example of them moved to the side:

https://user-images.githubusercontent.com/1299821/87724443-c79d2d80-c7bb-11ea-8692-2c4f06aad07a.png(image larger than 3 MB)

3

That’s perfect! Was that example code somewhere in the post? I just skimmed through it and didn’t see the picture you referenced.

I had been trying to use card-mod prior to asking on this forum, but was not able to get it working with my minimal CSS know-how.

4

This is it:

5

Thank you so so much!! Amazing community here.

6

You could also use badge-card and put the badges wherever you’d like.

1 Like