Share your Lovelace Projects (specifically ios/android versions)

@aFFekopp your UI looks absolutely awesome. Would you share some more details on how you adjusted the theme and styles for buttons / cards?

Currently I am using another Dark theme but would love to change

@postlund That’s really nice!

Out of curiosity, is the house custom or is it just a generic image :smiley: Also what are you using for the search bar?

Thanks!

I’ve aimed for simplicity :blush:

The house is sort-of dynamic. Garage port is “open” in the image when it’s open and those sort of things. It’s a custom card I’ve made myself. The search card is also a custom card I’ve made myself.

The search card is in HACS (but you need to install cardtools for it).

1 Like

Yes, I prefer simple :wink:

No real ETA, soon-ish I hope. I’m exploring some workaround for the scanning issues since a bunch of people have problems finding their devices. It becomes a bigger problem with tvOS than before.

Wow :astonished: :grinning:

Those are awesome cards :heart: Really surprised that I haven’t stumbled across those cards before, the search card is especially useful, I will definitely implement it into my UI.

Huge thanks!

1 Like

You can take a look at my configuration on GitHub.

3 Likes

hi @N-l1 , really digging your design. Would you mind sharing how you got your setup?

Just started with HA and looking at everyone’s else’ setups for inspiration and yours stands out to me.
Thanks

2 Likes

+1 @N-l1 :slight_smile:

1 Like

Thank you @NotYourAverageAl @Vasco :heart: !

That just made my day :dizzy: I’m planning on sharing my Home Assistant setup on GitHub very soon (themes, cards…) as I’m also working on a dark themed version. Hopefully I will be able to finish up quite soon, but as soon as I post my config on GitHub I will definitely notify you two.

Thanks again!

1 Like

big thanks to @aFFekopp, now my UI looks way more intuitive.

Before:

After:

4 Likes

nice! took you a month :wink:

how do you show multiple values in a row? (internet card, and the 3 radiator lines) would you be willing to share the configs for these?

could be a nice replacement for the extra badges I have been missing from custom-ui since ages…

This is the multiple-entity-row card: https://github.com/benct/lovelace-multiple-entity-row

Attached the config (the style applied is for the three dots that match the graph colors):

- type: entities
    style:
      .: |
        ha-card {
          border: solid 1px var(--border-color);
          font-family: Raleway;
        }
      "#states div":
        "multiple-entity-row":
          $: |
            div:nth-of-type(2) span::before {
               content: '';
               display: inline-block;
               width: 10px;
               height: 10px;
               -moz-border-radius: 5px;
               -webkit-border-radius: 5px;
               border-radius: 5px;
               background-color: #57a0ee;
               margin-right: 5px;
              }
            div:nth-of-type(3) span::before {
               content: '';
               display: inline-block;
               width: 10px;
               height: 10px;
               -moz-border-radius: 5px;
               -webkit-border-radius: 5px;
               border-radius: 5px;
               background-color: #00b59d;
               margin-right: 5px;
              }
            div:nth-of-type(4) span::before {
               content: '';
               display: inline-block;
               width: 10px;
               height: 10px;
               -moz-border-radius: 5px;
               -webkit-border-radius: 5px;
               border-radius: 5px;
               background-color: #ffa700;
               margin-right: 5px;
              }
    entities:
      - entity: sensor.speedtest_ping_int
        name: 1&1
        icon: mdi:speedometer
        hide_state: true
        type: custom:multiple-entity-row
        primary:
          entity: sensor.speedtest_download_int
          name: 'Download'
          unit: 'm/s'
        secondary:
          entity: sensor.speedtest_upload_int
          name: 'Upload'
          unit: 'm/s'
        tertiary:
          entity: sensor.speedtest_ping_int
          name: 'Ping'
2 Likes

thanks, very welcome card indeed! nice config also :+1:

1 Like

Do you mean the badges that were at the top? If yes this is still possible with lovelace.

no, I meant the extra_badge setup made possible by custom-ui, and of which I had a full setup…like here: Lights: no more color_temp and rgb_color together? or Multiple extra_badges in custom_ui?

Andrey added that in the mentioned future release and it gave us great options, which Lovelace has taken out again…

this multiple-entity-row re-instates that to some degree, so happy here!

Ah I see yeah kinda looks cool haha. Wouldn’t it be possible to create one with a lovelace template card? (There are quite a few on HACS). Never tried one though.

well, no more need… this is what the mentioned GitHub - benct/lovelace-multiple-entity-row: Show multiple entity states and attributes on entity rows in Home Assistant's Lovelace UI does now!

Ah alright :joy:

Wow your UI is awesome, really nice work :clap: :clap: :slightly_smiling_face: :slight_smile: !!!
Can’t wait for u to post your config, especially for the dark themed version. :thought_balloon:

1 Like

Much like @Tobi0892 - @aFFekopp’s Theme has inspired me to make a few changes to my lovelace

My Config is on GitHub:

5 Likes