I think it is because the clock doesn’t have a p > span and it just get formatted with the last p (text) formatting. I can’t figure out a way to get around this… any ideas?
Has anyone figured out how to put navigation buttons in the sidebar yet?
I need to add a few more views (Security, Weather, Media, etc) and ideally would like to have nav buttons under the greeting and above the bottom buttons (I have no need for the active devices section as the main dashboard shows me what is on).
My first couple attempts haven’t worked out and I can’t seem to get the buttons lining up correctly. I haven’t figured out how to place things where I want them with CSS yet.
I’ve created the button templates, I am just struggling to place the buttons correctly. If anyone has any guidance, it’d be greatly appreciated.
I tried a grid card with custom:button-cards however the buttons were spaced out huge and I couldn’t figure out how to close the gaps. Mind you, I didn’t do much with the themes.yaml
I did try the sidebar card initially, however I cannot designate it to a grid area. It renders before all other cards. I’m sure I could make it work somehow but I think I’d prefer to have the nav native in the grid. If I can’t get the buttons to work, I’ll try the sidebar card again and just match the style.
Just need to figure out why the buttons went all crazy and huge when I added a 1 column grid card to the sidebar.
Hi @Mattias_Persson greate and huge work! Is there any instructions how to install this or i have to figure it out by myself ? Just asking to not spend a lot of time trying tu implement it if there is some guide.
Hi, I’m looking for some css help. (I’ve been trying to learn from other sources on the net so as not to bug the community but the context is different in the examples I am seeing so I’m having a difficult time translating the help into my specific situation)
Does this css place that card at the bottom of the container? If yes… if I have multiple cards with that code, how does it keep the cards in order. For example in Mattias theme, he has the clock, then a conditional card and then the grid. Is it just the order the cards are in the code?
In my case, I am trying to show a weather card under the clock:
For those wanting an alarm tile, made one myself. It’s not as elegant as @Mattias_Persson could make, with all sorts of fancy animated svg icons and style, but it’s a start. Going to improve over time, but fits my needs for now. I do a popup to show me a full sized alarm panel card with all buttons etc. But it shows me the state, icon dynamically and added some color + animation to the tile when triggered etc.
I’ve also managed to make 2 garbage tile (left one showing what is being picked up today and right one showing what garbage container I should put that night, for garbage to be picked up the next day).
Hi friend.
How did you make your photo appear.
I can’t make mine show. I create a person, I use it on the card and it tells me if I am or not. I thought changing the name of the image to mine but I don’t see it.
Thanks
I was just wondering, as a theme newbie, if there is somewhere like an overview of more homemade custom icons and animations that match @Mattias_Persson’s design?
I already found an icon for Sonos here in the thread, but it’s a bit tedious and confusing to have to read through everything.
I’m building a new system for a wall mounted tablet and after seeing this there’s no question that this UI looks every bit as sleek and clean as a commercial product. Well done @Mattias_Persson
How do I install this? I have seen the various components on GitHub? Is this a fully manual process; e.g. create the structure in custom_components, edit configuration.yaml, ui-lovelace.yaml etc?
How Mattias added the people in configuration I thought it was like this. If you add the people in configuration you cannot add it. But so I could. Thank you
I’m just cramming in cards over the markdown card, I think it’ll be easier if you replace that grid area with a vertical stack and place your cards in that instead.