My Current Lovelace/Frontend

So as to not be left out of the discussion (FOMO), here are some screenshots of my current frontend running on a Win10 NuVision 8" tablet. It isn’t mounted, yet, but will be eventually (once I convince the wife that it would be more than geek chic to do so). I’m running a highly modified version of the oled.yaml theme found on here somewhere. Using fonts from Google Fonts, FWIW. The mobile shots are from my iPhone XS running in a progressive web app from my home screen (there have been quite a few updates to PWAs in iOS 12 in case you’ve had issues in the past).

6 Likes

Very nice.
Not sure about the cameras in the bedrooms though, looking at putting some IR motion sensors in there instead.
But I do like your frontend. Well done.

1 Like

They’re in my kids’ rooms and I make sure that everything is locked down/random ports/good passwords. Not saying unhackable…just not low-hanging fruit. My kids move around too much at night so motion would cause too many false alerts.

Thanks!

So far i have only 2 cameras setup. Both at the front of the house. As we own a double story house I have one looking out the front, but it has a poor view on the driveway, so the 2nd is for the driveway. Looking at another for the front door, one for the pool and another for large back entertaining area.
Looking at wifi for the rest of the cameras as cabling in a 2 story is a pain, and lan over powerline is not workable due to the way our wiring is setup regards the junction box.

Without going down the privacy debate rabbit hole, I have young kids and want to see what their doing when not sleeping. When they get older, that’ll obviously change a bit.

Sorry mate didn’t mean to hijack your post.

No worries here.

I am going to slightly hijack this.
I see that you have a panel that says Master Closet Motion/Light/Level/Temperature.

Can you explain what the setup is in the Master Closet.
I have been working through about a 1/2 dz ways to configure my 12’x16’ master closet.
You are the first one that I have seen in a post.
Thanks
Carltonb

I have a Tuya wifi light switch that happens to be outside my master closet (so a traditional motion switch wouldn’t work). I also have a Philips Hue motion sensor on the inside of the closet. Those sensors also have light and temperature sensors built in. Using the custom component for Hue sensors, it exposes all three sensors. I just show all of them.

Does that answer your question?

I thinking that is the best one i’v seen so far.
very, very nice work chipriley

Refael

Wow. Thank you, sir! I feel like I still have a lot of work to do.

I really like the “Stuff turned on” card. That’s a nice idea I’ll probably look to implement. Could you share the config for it?

i spend a lot time perfecting the deign of my one frondend,
but nothing compered to yours!

god dam (sorry my language) you’r good

Refael

1 Like

Ha! That one is definitely a bit of hackery. It’s an entity-filter card wrapped in a custom:card-modder card along with a custom:fold-entity-row card to roll it all up by default. Note that the entity-filter card has a special type in order to work with the fold-entity-row card. All of that thanks to @thomasloven and his custom cards.

- type: custom:card-modder
    style:
      background-image: url("/local/cardbackK.png")
      background-repeat: no-repeat
      background-color: rgba(50,50,50,0.6)
      background-size: cover
      box-shadow: 1px 3px 4px black
      font-family: Assistant, sans-serif
    card:
      type: entities
      show_header_toggle: false
      title: Stuff Turned On/Running
      entities:
        - type: custom:hui-entity-filter-card
          entities:
            - entity: light.kitchen_5
              icon: mdi:fridge
            - entity: light.laundry_room_2
              icon: mdi:ceiling-light
            - entity: light.family_room_ceiling_lights
              icon: mdi:ceiling-light
            - light.family_room_lamp
            - switch.family_top_light_load
            - switch.living_room_floods
            - light.living_room_lamp
            - entity: light.office_2
              icon: mdi:ceiling-light
            - entity: sensor.downstairs_thermostat_hvac_state
              icon: mdi:thermostat
              name: Downstairs Nest
            - entity: sensor.upstairs_thermostat_hvac_state
              icon: mdi:thermostat
              name: Upstairs Nest
            - switch.master_top_light_load
            - light.master_lamp
            - light.xxxxxx
            - light.front_porch_2
            - light.back_porch_2
            - light.driveway_2
            - switch.77024362cc50e3ca73ba
            - entity: alarm_control_panel.abode_alarm_system
              name: House Alarm
          show_empty: "true"
          state_filter:
            - "on"
            - "heating"
            - "cooling"
            - "armed_away"
            - "armed_home"
          card:
            type: custom:fold-entity-row
            head:
              type: divider
              style:
                background-color: rgba(0,0,0,0)
            group_config:
              secondary_info: last-changed
2 Likes

Thanks so much. You really thought “out of the box” for this one.
Appreciate it.

Actually, someone else already had the idea because @thomasloven had exactly what I wanted to do in his README. Maybe it was him but someone else thought of it. I just followed instructions. :grinning:

1 Like

Hi @chipriley, what cameras do you use?

Thanks.

Looks like you need to use “background_image: true” in your compact-custom-header config. It will remove the bar at the bottom of your page.

Thanks mayker.

Those are two Amcrest IP cameras and an Arlo camera. Not the best but workable.