Custom Lovelace Card - Control lights better on tablets

[sciant]

It’s been a long time but hope it helps somebody:

• Add a “www” folder at hass root directory (/config). I recommend you use File Editor Add-on. Then restart hass.
• Download https://github.com/DBuit/hass-smart-home-panel-card/archive/refs/heads/master.zip and extract custom-smart-home-panel-card.js
• Upload the .js file to www folder. There’s an upload button on file editor
• Then go to settings, lovelace dashboards, resources. (Advanced settings has to be on) and click add resource. On url choose /local/custom-smart-home-panel-card.js on type choose JavaScript Module
  I recommend you to restart hass, it shouldn’t be necessary but better to be safe than sorry
• Then go to the dashboard you want the card on, click on edit dashboard, raw configuration editor (You have to click the 3dot icon in edit mode to see that button) and under “cards:” add the custom panel like this:
  
• Personalize it.
  Here is the custom card’s official documentation with a config example: GitHub - DBuit/hass-smart-home-panel-card: Home assistant smart home panel card
  And here is official hass info on how to use custom resources: Lovelace: Custom Cards | Home Assistant Developer Docs
  Here is how to register custom resources: https://developers.home-assistant.io/docs/frontend/custom-ui/registering-resources

[erik.u.gundersen (Erik Gundersen)]

I have added a dimmer entity but it seems to pick this up as a on/off… why is that. In the “default” config I can adjust brightness…

[nolesw (Nolan)]

Love the card. Made some mods to fit my needs.

[dmozingo (David)]

Followed all these directions and still getting this.

No card type configured
- type: custom:custom-smart-home-panel-card
  title: Kitchen
  icon: mdi:floor-lamp
  showButton: show
  buttonText: Test
  buttonPath: /lovelace/0
  background: '#1c1d1f'
  entities:
    - entity: null
    - entity: null

Can anyone help?

[nolesw (Nolan)]

I believe your indention is bad and don’t need the hyphen.

This ↓

No card type configured

• type: custom:custom-smart-home-panel-card
  title: Kitchen
  icon: mdi:floor-lamp
  showButton: show
  buttonText: Test
  buttonPath: /lovelace/0
  background: ‘#1c1d1f’
  entities:
  • entity: null
  • entity: null

Should be like this ↓

type: custom:custom-smart-home-panel-card
title: Kitchen
icon: mdi:floor-lamp
showButton: show
buttonText: Test
buttonPath: /lovelace/0
background: ‘#1c1d1f’
entities:

• entity: null
• entity: null

[hophopNL (Hophop)]

Looks great, could you please please share your config/js ?

[JimNX (Jim)]

@erik.u.gundersen

In the “default” config I can adjust brightness…

Did you ever figure this out? All of my dimmable bulbs show up as on/off only.

[JimNX (Jim)]

I just installed your custom card – it looks awesome, thank you! I have a couple lights added to it and they are all dimmable bulbs but the card shows them as on/off only. The default light cards can dim them. Any ideas?