#frontend-archived

1 messages · Page 20 of 1

velvet bloom
#

i can probably remove it now its working.

unborn rune
#

you know a workaround for my issue

split granite
unborn rune
#

i use exact this card

#

this views works in browser mode but not on tablet whether in the browser or app

#

works only on pc

pulsar shore
#

any recomendations for making nice dashboards? with lots of sensors and switches?

unborn venture
#

With the original media card they dont do that... I would like another option.

#

They create like another window and in the background you still see the dashboard

thorn granite
#

You could have a look through hacs, but as Luca says the media browser is the easiest way.

unborn venture
#

Does anyone have any idea?

velvet bloom
#

anyone using flex-table-card by any chance?

narrow bloom
#

I have a card I've created using apex charts and entities cards(for the readout) and I'd like to get the header name on the right to be aligned right with card-mod; however I am seemingly unable to do so.

#

This is my code:

verbal flame
velvet bloom
narrow bloom
#

Ugh. Realized "justify-content" was being set on the header, I tried align and text-align to no avail

      justify-content: right;
    }```
#

Result:

lapis linden
mossy otter
#

Is there some kind of guide to how to create your own theme

#

or at least some kind of crib sheet to all the different paremeters? can't find anything on the official deocumenation

thorn granite
daring night
#

looking for help from the awesome ha crew...

Is it possible to use a {template value} to provide a url path in a card, eg, see example attachment picture glance card - I'm trying to compute the url path - this template renders the correct/dynamic url to the latest youtube video posted by DrZzs (via youtube sensor). the sensor works like a charm and I can see the correct url in dev tools... but if I drop the template syntax in the card, (tried a few variations), it never renders the actual url, just is treated as a text string? it doesnt like it if i remove the quotes too.

any help or suggestions, much appreciated, M

vast crane
daring night
tame oriole
#

when i run {{ states('binary_sensor.multisensor_6_motion_detection') }} i get the output of on or off. is it possible to get the "clear" or "detected" like the logbook shows?

dark dirge
#

If you write the template that way

#

You can't get the translated states from a template

tame oriole
#

hm. so if it says on or off, im going to have to write something to replace the text basically ?

#
{% if is_state('binary_sensor.multisensor_6_motion_detection', 'on') %}
            Detected
          {% else %}
            Clear
          {% endif %}
#

?

dark dirge
#

Could be shorter, but yes

tame oriole
#

impress me by telling me how to make it shorter lol

dark dirge
#

iif(is_state(xxx), 'Detected', 'Clear')

tame oriole
#
if(is_state('on'),'Detected', 'Clear')

?

dark dirge
#

No

#

What you had above for the test

tame oriole
#

oh

#

{{ 'Detected' if is_state('binary_sensor.multisensor_6_motion_detection', 'on') else 'Clear' }}

dark dirge
#

That's one way. Read further

tame oriole
#

{{ iif('binary_sensor.multisensor_6_motion_detection', "Detected", "Clear", "None") }}

dark dirge
#

Doubtful

#

Your test is a string

tame oriole
#

that one is really confusing lol

dark dirge
#

Just read the examples

tame oriole
#

i am

dark dirge
#

That's not it I

#

Here:
{{ iif(is_state('light.kitchen', 'on'), 'Yes', 'No') }}

tame oriole
#

{{ iif(is_state('binary_sensor.multisensor_6_motion_detection', 'on'), 'Detected', 'Clear') }}

#

gotcha

dry wind
#

I've been having this weird issue on Desktop for a couple of days now, every time I reload/open homeassistant my main dashboard doesn't load properly, but as soon as I resize the window (like in this example I open devtools to resize it) it fixes itself. I'm on 2023.7.1 using Firefox 115.0.2. Not a cache issue, but it only seems to happen with firefox#

faint vortex
#

Anyone had this issue where HA will load like this until I click on another dashboard or page in a dashboard? Not really sure where to even start in figuring it out

dry wind
#

:')

polar kelp
faint vortex
#

was actually thinking about you as I use card mod and some others, but it happens on absolutely any view even dashboards that have nothing of yours on them or absolutely any custom cards. The interesting thing is it only happens on first load, then never again unless I refresh

polar kelp
#

Still, though. My stuff does some really weird things sometimes, so that could still be it.

tacit cave
#

Every frontend update is a pucker

dry wind
#

thats pretty much the same issue i have as well. Resizing the window fixes it without issues, until I reload

#

I don't think I'm using any custom cards

dry wind
#

@faint vortex are you also using fireforx?

faint vortex
#

Yepp

unborn rune
#

hello i got a big problem with my frotend, i cant change everything or edit another cards in my dashboard 😦 anyone know this issue?

tacit cave
#

clear your cache and refresh the page

unborn rune
#

yep 😦

vast crane
#

Could you be more exactly specific what you're trying to do and what's not working?

misty mango
#

Does anyone know how I can use multiple Icons for one entity with multiple states?

I have door sensors Of which I am displaying the state on my dashboard [trough mushroom chips],
But what I want to do is use a different Icon depending on the current state.
is such a thing possible?

tribal galleon
#

Does anyone know how I can use multiple

shut robin
#

hey guys, i have quick one - i have a dashboard that i have sitting in a browser window on my pc that for some reason slows down very quickly - it gets to the point where it seems like if i leave it open for more than half an hour, it becomes unresponsive (kinda like how sites are sometimes like "do you want to wait for this page or stop it from loading?"), and the only way to fix it is to fully close that tab and reopen it

other tabs are fine - i can leave my energy dashboard running all day (it has power/energy flow cards which have movements happening all the time)

does anyone know of a way i can figure out why it's slowing down, or how to fix it? i'm still quite new to all this so i'm not sure what logs would help or even where to look, can but provide whatever's needed for it

misty mango
shut robin
#

most of the mini buttons are just light entities, but the tv remote and washing machine mini icon both open up a browser mod thing that has some stuff on it as a popup window

also the washing machine mini icon has a bunch of logic in it because it changes colour/state when the washing machine is on, and the middle bit spins too when it's on using some logic i found on a forum post somewhere

#

i suspect it's probably the remote, because sometimes when i load in, the lounge card takes a bit to load in compared to everything else, but i don't know how to prove it or check if there's a certain part of it that's slowing everything down

misty mango
#

I would suggest to try and copy the dashboard to a new one, and remove things 1 by 1 to see if you can find the culprit

shut robin
#

that's a good idea - i'll give it a shot

unborn rune
#

anyone use auto reload card from hacs ?

#

i got this in my card type: 'custom:auto-reload-card'
delay_in_minute: 1 it doesnt work

solemn narwhal
#

Is there a way to open the history tab instead of the more-info by default for a card?

red vale
#

anyone can point me to what card type and configuration is needed to create these cards for my blinds? Thanks

golden mistBOT
#

@modern yarrow I converted your message into a file since it's above 15 lines :+1:

red vale
feral rivet
#

Is it possible to place a custom: fold-entity card inside either a mushroom card or a custom: button card?

tacit cave
#

not sure about mushroom card, but button-card yes.

echo robin
#

Quick question: Im looking to use the name of an entitity as a title and have a entities style card displaying all the values from the sensors, which are there for an overview of the irrigation control. I'd also like the icons to change color, which I know is possible via the custom button card, Im just not sure on how to structure it so it looks similar to the entities card with a title.

#

Similar to this, with the text in the title based on the following template: {{ state_attr('sensor.peach','friendly_name') }}

main locust
#

What are the current popular HA themes?

mystic timber
#

Is it possible to add in sidebar-card next to 'room name' the temperature sensor so I can know what temperature each room has?

for example where I wrote "here"

feral rivet
tacit cave
#

you don't need the fold entity example, just an example of a nested card

#
- type: custom:button-card
  aspect_ratio: 1/1
  custom_fields:
    graph:
      card:
        type: sensor
        entity: sensor.sensor1
        graph: line
        style: |
          ha-card {
            box-shadow: none;
          }
  styles:
    custom_fields:
      graph:
        - filter: opacity(50%)
        - overflow: unset
    card:
      - overflow: unset
    grid:
      - grid-template-areas: '"i" "n" "graph"'
      - grid-template-columns: 1fr
      - grid-template-rows: 1fr min-content min-content

  entity: light.test_light
  hold_action:
    action: more-info
thick dagger
#

Hey everyone, I've been trying to find if anyone else is having this issue but ever since the last update to the mushroom cards anytime I tap a button on my dashboard the tap action is no longer working

 cards:
              - type: custom:mushroom-light-card
                entity: light.living_room_lights
                name: Living Room
                show_brightness_control: true
                collapsible_controls: true
                tap_action:
                  action: toggle
#

when I tap it, it just does nothing

tacit cave
#

When in doubt clear cache and refresh page

thick dagger
#

yeah I've tried that on every device 🙂

tacit cave
#

Doesn’t tap action default to toggle on lights?

thick dagger
#

it was defaulting to the more info card

#

and well I don't need that on a kiosk 🙂

#

this is a nested card

golden mistBOT
#

@thick dagger I converted your message into a file since it's above 15 lines :+1:

solemn narwhal
thick dagger
#

rolled back to a backup prior to the mushroom update and my toggles work again

solemn narwhal
#

Yea that still just brings up the generic more info. Ex:

solemn narwhal
tribal galleon
#

If you remove the title it will only show the graph and times.

scenic ocean
#

Is there a way to see when was sensor updated even if the same is the same as the last one?

vast crane
#

Yes it has a last_updated property that contains that value. Where do you want to see it?

scenic ocean
#

I was hoping to see every update in the history view, or something like that

#

I'm trying to debug the update rate of a sensor

#

The last_updated property isn't enough...

vast crane
#

actually I think maybe I'm wrong. IIUC last updated isn't really when a sensor "updates", its anytime it changed a state or attributes. if state and attributes are identical, I think last_updated is not updated.

#

There's nothing that really tracks when something polls but does not write state.

swift halo
#

How can I create a card that contains a button to navigate to another dashboard?

vast crane
#

That's a basic feature of the button card. Just choose tap-action:navigate, and choose your dashboard from the dropdown.

tribal galleon
#

You can also "disable" actions if you want.yaml tap_action: action: none

timid beacon
#

Damn, found this crazy bug with more-info card and card_mod. It'll cause the elements on the card to infinitely replicate which will eventually destroy your tabs resources

#

Weird, can't reproduce all of a sudden

unborn rune
#

hello i got a issue with my calendar 😦
hope some can help me 🙂
i want to add a clock and this destroy my frontend.
You can see it on pictures 🙂

#

and with clock

#

how i can fix it ? 😦

random relic
#

What is wrong with it? How would you want it to look?

tacit cave
#

Was gonna say, looks fine to me

#

Maybe it’s the other cards because they look wonky?

tribal galleon
#

Wondering if there is a layout issue. Like they're supposed to be in defined spots but the order of the cards doesn't have them showing in the right order affecting widths. Or using stack-in-card. (It makes sense in my head but not in text....)

random relic
#

Hm. Tested by adding a calendar, weather and a clock and as I used the buttons in the calendar upper right, I could no longer get a full-widget calendar. It was cut in half vertically

#

Impossible(?) to restore normal look

tribal galleon
#

What happens when you remove the clock card? Does it go back to being correct?

random relic
#

Same thing. Right after removal Calendar was restored, but as soon as I used the buttons it was wonky again

#

Seems to be the Calendar somehow. I removed all else, same. And then changed the dash to 1 card, also wonky

tribal galleon
#

Wait.hassian, you were able to duplicate Paddy's issue?

random relic
#

Yes I am

#

Or not exactly. Mine is cut in half. His looks like increaed amount of spaces in each row. That I don't see, mine is all symetrical

tribal galleon
#

So is it two cards not playing nice with each other or strictly a calendar card issue?

random relic
#

I have only seen it with the Calendar. One of the buttons sets the "Events" view, so belive two calendars are set side-by-side

#

Oh, it is reproducible with the Calendar alone, yes

unborn rune
#

Maybe a calendar Bug ? 2 Guys the same Problem ?

rocky gyro
#

How do I configure lovelace?
I'm trying to add the mini-graph-card

vivid trout
#

does anyone know of any bar card that is resized in picture entities? overwise my card is going to be extra long 😛 and ill have to do percentages with images 😛

terse agate
#

Hey, is it possible to set the title of a picture-glance card dynamic? I tried something like this but it dosn't work. Has title to be a static value?

fiery ledge
#

Don’t use custom card secondary-info myself but got a support question on that card using state-color.

#

Found 1 issue in that repo, but maybe users here also found a solution yet? Seems to be completely ignoring that for now?

tribal galleon
earnest lagoon
#

Where does the yaml live for dashboards added via the UI? I don't like editing the yaml in the narrow UI editor window

tame oriole
#

is there a way to add entities into markdown cards alongside other custom code? like if i wanted to do some custom lines of stuff, but then add an entity after it?

type: entities
entities:
  - entity:
lyric prairie
earnest lagoon
charred orchid
#

hey guys, I have a problem with hacs addon floorplan, but the issue is generic i think.
To be sure /hacsfiles/ is a short-cut to /www/community/ so leaving the url as is should work.
how do I verify that this shortcut works?
ls - l in the root or inside the config dir doesn't show me this shortcut.

charred orchid
#

ok, I just updated ha from 2023.4 to 2023.7 and it started to work

plain mural
#

Is it possible to use a sensor.name state in a frontend card title?

tame oriole
#

looking to figure out how i can get the bulb current color for use in a Markdown card. currently when you add an entity card, it shows up. but again i want to create this in a markdown card

vital burrow
#

Maybe converting the light's rgb_color attribute to hex and using that as font color?

tame oriole
#

yeah is there a way to do that without creating helpers?

vital burrow
#

{{ '#%02x%02x%02x' % state_attr('light.aaron_s_room_light_4', 'rgb_color') }}

tame oriole
#

ooh i think that works
<td align="right"><font color="{{ '#%02x%02x%02x' % state_attr('light.aaron_s_room_light_4', 'rgb_color') }} "><ha-icon icon="mdi:thermometer"></ha-icon></font>

vital burrow
#

<font> is depreciated in HTML, but I haven't been able to get <span style="color:#ffffff;"> working in a markdown card.

tame oriole
#

i use font color today and it works

#

i color my icons with it

#

i couldnt get span style working either

#

looks good thanks. i had to add and IF/ELSE to make it black when the light is off because it errored out. but its good now.

digital lynx
#

why does a timer in the UI of home assistant show a countdown of 00.31.30 when its set to 30 minutes??? where is the 1,5 minute come from?

tribal galleon
vital burrow
#

%02x converts a number into a hex with a leading 0, if it would be one digit otherwise

#

If value = 11
%x % value converts to hex b
%02x % value converts to hex 0b
%03x % value converts to hex 00b

tribal galleon
#

Still seems like sorcery. I might try to incorporate something like that into a Javascript function I have in Node-RED. I had difficulty working with RGB (strings vs objects). The quick fix was a RegEx function. msg.payload.data.rgb_color = rgb_out.replace(/[^\d,]/g, '').split(',');.

mystic timber
#

Is it possible to add in sidebar-card next to 'room name' the temperature sensor so I can know what temperature each room has?

for example where I wrote "here"

golden mistBOT
#

@steel moon I converted your message into a file since it's above 15 lines :+1:

vast crane
hollow osprey
#

Did you ever find out the issue? I have done a rebuild, but have not messed with trying to recreate the dashboards. Lot of work there of someone like me without a lot of knowledge in the area. So didn't want to start messing with it and break something.

BTW, any idea where the dashboards are kept in the HA backups?

ember forge
hollow osprey
hollow osprey
digital lynx
polar kelp
#

Make sure your computers get their time from the same NTP source.

rustic lynx
#

I have question the Minimalist UI dont have all mdi icons ?

tribal galleon
#

Newest addition to my tablets' dashboard. Simple HTML placed in the /www/ folder. Automations to control Fully Kiosk Browser: before shutdown show the HTML, after startup button.press Load Start URL. (The start URL one is also useful for when Lovelace tries to display but not all elements are loaded yet resulting in errors.)

tribal galleon
rustic lynx
#

"mdi:Filmstrip"

#

this dont show up

#

the icon show up on my studio code but not on the UI

tribal galleon
#

try mdi:filmstrip. It works for me. (Doesn't work with the capital F.)

rustic lynx
#

yaa works 😄

#

nice

#

thanks

tribal galleon
pallid zephyr
#

If /hacsfiles maps to config/www/community and /local maps to config/www, does anything map to config/custom_components? Buried under there seems to be where lovelace-layout-card.js is, which I'm trying to preload in frontend/extra_module_url. Tired of "Custom element doesn't exist".

rustic lynx
#

this card existe on Minimalist ui ?

atomic glacier
tribal galleon
#

@atomic glacier Did you just use an image or HTML? I went with HTML so, in theory, it should scale accordingly.

atomic glacier
#

Ah...gotcha. I just got back from vacation. Haven't implemented it yet, I've been using MP4 loop screens during restarts and timeouts. Should be easy to swap around and see what looks better...I'll keep you posted when I hook it up, prolly later tonight or tomorrow

tribal galleon
#

Here's what I threw together. It is just a two cell table centered vertically and horizontally. Image came from https://www.pngwing.com/en/free-png-pbiov
In its current form, it may not translate well for portrait orientation. But, I imagine, it wouldn't take much to implement some way of handling that with mediaquery or something.
EDIT: Just rotated Amazon Fire 10 and it shows okay. Shows Home Assistant is restarting. on three lines instead of two.

golden mistBOT
#

@tribal galleon I converted your message into a file since it's above 15 lines :+1:

tribal galleon
#

For the automations, I did add a three-second delay to the beginning of the one for startup and a three-second delay at the end of the shutdown just to make everything play nicely together. (The shutdown one needed the delay because the webserver would go down before FKB had a chance to actually load the HTML.)

atomic glacier
tribal galleon
#

Okay. So you don't use FKB but accomplish the same thing through browser_mod?

atomic glacier
#

Yeah, mostly bc I have all of my kiosk automations running on the old browser_mod...(and yes @polar kelp it still works 😂 )|| <---I just ignore all the errors👻 ||
All of the motion activated and screensavers, clock screens and video screens were way b4 the FBK integration came out, (several years old 🫢 ) showing my age here 🫣 just a bit short on time lately to bring it all up to current. 92+ popups created the old way and takes a bit to rework them and it's pretty much all or none unless I wanna break it all 🤓 and start from scratch 😩

bronze spindle
#

I've created a vertical-stack card using the custom-card front-end add-on and I'm wondering how I can get rid of this middle grey line?

atomic glacier
#

@bronze spindle custom:stack-in card or custom:vertical-stack

bronze spindle
#

type: custom:vertical-stack-in-card

atomic glacier
#

yep...that works...a bit braindead tonight over here LOL

bronze spindle
#

ah, we're only midday Sunday here in Australia

tribal galleon
#

I had to add a little bit of card mod when I was testing stack-in-card. I still got borders around button cards (contained within a horizontal stack card). So, the layout was stack-in-card with two horizontal cards each with three button cards. Add this to each button card: yaml card_mod: style: | ha-card { border: none; }

bronze spindle
#

sweet! that got rid of it, thank you 🙂

tribal galleon
#

I also used the above posted card mod on the stack-in-card when I put a custom:auto-entities card inside it. This way, the border was removed around the stack but I had custom:button-cards appear for each light that is currently turned on.

#

After I turned some lights off:

fiery ledge
#

Why not set border none in your theme and be done with it? On the stack-in-card: I did away with that, as there is nothing we can’t do using entities or vertical-stack. ( and card-mod). With the ever changing core Dashboard it pays to be as core as possible ….

shrewd thunder
#

(crap, forgot to take out the ping for the reply, sorry)

fiery ledge
#

Set it in your theme…

shell kelp
#

hey, I'm trying to access the state of one of my entity but I'm not sure how to do it

#
  if(entity.input_boolean.air_conditioner)
    return "rgba(var(--color-theme),0.05)";
  else
    return "rgba(var(--color-theme),0.5)";
]]]```
#

something like this, but entity.input_boolean.air_conditionerdoes not work

tribal galleon
shell kelp
#

I think it's using the custom:button-card

tribal galleon
#

@shell kelp Try thisyaml [[[ if (states['input_boolean.tester'].state === 'on') return "rgba(var(--color-theme),0.05)"; else return "rgba(var(--color-theme),0.5)"; ]]]

shell kelp
tribal galleon
#

The custom:button-card uses Javascript so that's what the code is. Obviously, there's the docs for the card on Github. This thread has some good examples https://community.home-assistant.io/t/fun-with-custom-button-card/238450. Also, search this room for my username and button-card. I've posted a lot of examples and screenshots. Really, that's how I figured it out was by looking at examples and asking questions.

#

Also, as a shortcut, if you've defined the entity for the custom:button-card, you can use something like this instead if (entity.state == "on")

shell kelp
#

Would you know how to color the background of the icon ? This - background-color: "rgba(var(--color-green),0.5)"only color half of it

golden mistBOT
#

@shell kelp I converted your message into a file since it's above 15 lines :+1:

shell kelp
#

nvm found the issue, I have to use ```img_cell:

  • background-color: "rgba(var(--color-green), 0.5)"```
tribal galleon
#

@shell kelp Looking at your yaml, a lot of the stuff you have in quotes does not need to be in quotes, such as type: "custom:button-card" and entity: "input_boolean.air_conditioner". Also, this is a good example where you've defined the entity in the card but end up repeating yourself in the IF statement. if (entity.state == "off") should work.

shell kelp
#

what's the general rules about what need to be in quotes ?

tribal galleon
#

Not sure of the rules specifically, but I would say generally, if you have the first part such as type, entity, or icon (something that is followed by a colon), you should not need to use quotes.

#

Also, you might consider looking into state styling instead of the Javascript method. Since your entity is defined and you have relatively basic on/off criteria. Something like this might be easier to set up. ```yaml
state:

  • value: 'off'
    operator: '=='
    icon: mdi:lightbulb-auto-outline
    state_display: Automations are off.
    styles:
    icon:
    - color: red
  • value: 'on'
    operator: '=='
    icon: mdi:lightbulb-auto
    state_display: Automations are on.
    styles:
    icon:
    - color: green```The operator is optional here since == is default, but I leave it in the just for good measure.
    EDIT: Corrected syntax for icon name. Had it under styles where it doesn't belong.
shell kelp
#

Thanks

#

Also it looks like some colors are already predefined (probably in a css), do you know where I could find the full list ?

#

Colors such as var(--color-theme)

tribal galleon
#

Those are going to be defined in your theme which is under /config/themes. If you want standard CSS names, I like this page for reference: http://davidbau.com/colors/

dire heron
#

Is there a bug or design that when I choose a different default dashboard on any given device, my overview dashboard disappears from that device.

#

Honestly, I’m hoping it’s a feature because I’m taking advantage of it. I cleared my Overview tab and I’m turning it into an intro/tutorial for new guests, (my wife & I host a lot and have lots of friends & family stay with us when they’re in town, so this is perfect for giving them a few important tidbits that they can eventually get rid of).

dire heron
dark dirge
#

Disappears how? From the sidebar?

vale vine
#

why every time i try to copy a yaml code with ctrl + c and then paste it, it wont work?
(macbook)

tribal galleon
#

Have you tried a different browser? Works for me in Firefox on PC.

rustic lynx
#

this card existe on Minimalist ui ?

polar kelp
wind sail
#

Hi all !
I'd like to manage my lovelace dashboard through git, and publish the changes to HA when I push.
Is there a way to reload lovelace dashboard from disk, without restarting HA ? frontend.reload_themes doesn't do it.

vivid trout
#

can i get state_image to use script in card like [[[ if (entity.state <= 10) return '/local/ioniq2/10.png'; else if (entity.state <= 20) return '/local/ioniq2/20.png'; else if (entity.state <= 30) return '/local/ioniq2/30.png';

#

or should i be using a inbetween logic? say 0 to 10

dire heron
dire heron
somber vale
#

hi guys, so I just set up HomeAssistant and added HACS with the custom cards thing

in the installation it says "Add the configuration to your ui-lovelace.yaml"

But I don't have a ui-lovelace.yaml file. What am I missing?

dark dirge
#

Those instructions aren't meant for you

#

Ignore that part

rustic lynx
bleak fox
#

hi! does anyone have experience with using a custom card inside another custom card (within minimalist)?

it works when used in the regular dashboard but i'm getting an error No card type configured

i'm guessing i need to import the other custom card at the top of the yaml file i'm using it in but I can't figure out how to do that...

dire heron
#

Now I’m only clues 90% of the time instead of 95%. But I’m slowly starting to figure out HomeAssistant and loving learning it all.

atomic glacier
#

@tribal galleon I tweaked it a bit and this is what the mobile looks like. Will probably do the same for the wall mounts 🫡 Thanks for the inspiration to get me off my lazy butt 😂

vivid trout
#

ok I know this is wrong, because it wont work, is there anyway to do this state_image: | [[[ if (entity.state <= 10) return 'image: /local/ioniq2/10.png'; else if (entity.state <= 20) return 'image: /local/ioniq2/20.png'; else if (entity.state <= 30) return 'image: /local/ioniq2/30.png'; else if (entity.state <= 40) return 'image: /local/ioniq2/40.png'; else if (entity.state <= 50) return 'image: /local/ioniq2/50.png'; else if (entity.state <= 60) return 'image: /local/ioniq2/60.png'; else if (entity.state <= 70) return 'image: /local/ioniq2/70.png'; else if (entity.state <= 80) return 'image: /local/ioniq2/80.png'; else if (entity.state <= 90) return 'image: /local/ioniq2/90.png'; else if (entity.state <= 100) return 'image: /local/ioniq2/100.png'; else return 'image: /local/ioniq2/centre-squares.png'; ]]]

vale vine
#

hi there, i just made a button that lets me go back to the main page right, but i also added the option that if i hold it it will open a popup with browser mod that will show me all the other pages/tabs i have. Why when i click one of those tabs nothing happens?

golden mistBOT
#

@vale vine I converted your message into a file since it's above 15 lines :+1:

verbal flame
# rustic lynx

i really like this card aswell. Where did you find it?

dire heron
#

Sadly, I think it was just a PhotoShop Concept, and not a real thing.

swift halo
#

How do I call a service from a footer button in a card?

#

... maybe I can make an ordinary card button and look at the yaml it generates and copy that 🤔

dusky kayak
#

Hey friends, how could I create a card that tells me that a device is on based on the power consumption? 🤔 The easy way I'm not that skilled:)

tacit cave
#

There is no easy way, it'll be an automation or a template binary sensor

dusky kayak
#

😅 😅 OH i

stoic geyser
#

i have a Konnected Alarm Panel Pro. it is configured with HA so i can see the zone sensors, and the alert outputs. now, how do i setup an alarm panel card so i can arm/disarm the alarm, and so forth?

stoic geyser
#

i just created a status card showing all the zones, and their status, but still need help on the alarm part.

stoic geyser
#

i think i am figuring it out...

tribal galleon
#

@dusky kayak If you're just looking for a visual representation, this is what I use to show a dumb TV being on. It looks at the power usage of a smart plug. ```yaml
type: custom:mushroom-chips-card
chips:

  • type: template
    content: >
    {{ ((states("sensor.tv_plug_active_power") | int) > 5) | iif("TV is
    on", "TV is off") }}
    icon: >
    {{ ((states("sensor.tv_plug_active_power") | int) > 5) |
    iif("mdi:television", "mdi:television-off") }}
    icon_color: >
    {{ ((states("sensor.tv_plug_active_power") | int) > 5) | iif('green',
    'red') }}```
stoic geyser
rustic lynx
#

but i think i will try to make it my self

atomic glacier
bitter bolt
#

can i make buttons appear and disappear based on a state? like when a media player is on a certain input, i want one of my lovelace pages to dynamically change remote buttons from tv remote to media player remote..or can i have the buttons glow or something?

reef knot
#

anyone have any idea why my kitchen dot does not want to show the cover image of whats playing or the media controls. I have tried two different media players and still the same result. My OCD is kis kiing me..

slim grove
#

Hello all, noob here. I want to get started designing dashboard cards. So far I've encountered two new things I know nothing about: What is Lovelace? Why should I install HACS?

reef knot
#

Hacs has some cool things that don’t come with ha. I’m using a few things from there in my first few days with ha

slim grove
#

@reef knot Unnerstood. What sort of cool things? Do I need a Lovelace thingie or is that just the /front end object now?

reef knot
#

Lovelace is front end. I got my monoprice 6 zone amp working the way I wanted from a hacs integration.

slim grove
#

@reef knot Thanks for your advice. Next time someone contacts you for help, provide some assistance instead of showing what you know.

dusty summit
# slim grove Hello all, noob here. I want to get started designing dashboard cards. So far I'...

To expand on what you've been told. HACS is a way to manage custom code additions to Home assistant. For installation and updates. There's no requirement to use it, and everything you do with it can be done manually. It's just a little more effort, rather than a limited number of button pushes. Lovelace is what you're using on the dashboard. if you're going to be building custom cards, then you'll need to get to know it better. if you're just plugging configuration into other people's cards, less so.

random relic
#

Front end is not very responsive for some controls. Is there a way of making it poll more often? Or is that up to the sensors?

bleak fox
velvet minnow
#

Is it possible to have some sort of yaml card templates, i have a few pretty complex cards that i want to reuse where only the entity changes.

tacit cave
#

Decluttering card

#

Or yaml anchors

velvet minnow
#

yaml anchors seems interesting, not really sure where i should place those definitions without hass saying there is invalid yaml. Is there a special place for this within hass?

lyric prairie
tacit cave
velvet minnow
tacit cave
#

packages does not work for the UI

#

decluttering templates might also require all yaml

#

I don't use that so I can't really answer that

velvet minnow
#

Ouch, so there isn't really a way to reuse complex components other that copying them around with the UI enabled?

tacit cave
#

you can copy/paste cards

#

that's about it

#

seems like it's time to graduate to yaml

velvet minnow
#

Big oof haha, just migrated my entire YAML config to the UI based one 😬

digital marsh
velvet minnow
dusty summit
#

chat gpt is also good at giving you something which totally doesn't work 😉 and then annoys the piss out of people trying to help.

digital marsh
#

you need to correct its work but it gives you something 90% done that sort of works 😆

#

I reckon I could do 5 jobs at once and just farm it all out to ai and correct the mistakes

plain pike
#

🤮

prisma fog
#

How can I have a fullscreen camera view in the dashboard? i.e. a camera feed that fills the whole dashboard

tacit cave
#

change your view to panel. It's an option on the view

prisma fog
tacit cave
#

you can do anything with stacked cards or picture elements, picture glance, etc

unique lagoon
#

I'm trying to use the decluttering card and trying to split those into their own yaml.
This is at the top of my dashboard config:
decluttering_templates: !include_dir_named "config/templates-decluttering/"
but I only get this error:
Unable to parse YAML: YAMLException: unknown tag !<!include_dir_named>
I've been trying to research if using !include_dir_named is possible, and I have found several posts of people doing it exactly like this without getting the error. Can anyone help?

lyric prairie
#

This works only when you build a dashboard in Yaml. Not when you use the raw-editor/GUI

unique lagoon
#

oh, I see

#

alright then, thanks for the info!

dire heron
#

Is there anywhere I can find documentation on how to add "info" messages? I found code {{ states.light|selectattr('state','equalto','on')|list|length }} to put in a message "There are X lights on." and I'd like to add a whole bunch of info to that card. "The average temperature inside is Y" (I have a helper entity that finds the mean of the temp sensors already), "There is motion detected in Z rooms." etc.

dark dirge
#

Are you just talking about a markdown card?

#

it sounds like you just want to construct text with some template data

golden mistBOT
#

@hard estuary I converted your message into a file since it's above 15 lines :+1:

swift ore
#

card ideas for a water tank? mushroom climate card kind of works

#

domestic hot water that is

dire heron
dark dirge
#

So your question is how to write templates for that?

drifting horizon
#

Is there any variation of the effect of the stack-in card that I can accomplish through the UI?

#

I think the answer is no but I'd like to ask.

dire heron
dark dirge
#

And links in the topic for it

dire heron
#

Well sweet! I did see that channel, but wasn't sure that's what "templates" meant. 🤪 LoL.

stoic geyser
#

wondering if it is possible to show data from a MQTT weather stations wind direction sensor, as a circular compass readout? the weather station reports the azimuth

#

may have found it myself...

stoic geyser
slim grove
#

I found the developer docs for frontend projects: jackpot…jackpot.

stoic geyser
#

i have downloaded and put in place the compass-card.js file, and added a javascript module resource "/local/compass-card.js" but i can't add in the card

dark dirge
#

Put it where?

stoic geyser
#

in my config dir, + "www"

dark dirge
#

Restart HA and clear your browser cache

stoic geyser
#

ok

#

there it is 🙂

#

Thanks !!! 🙂

broken barn
#

Hi there. Grouped some lights to helpers and made a dashboard with tiles to switch the light entities or the helpers (groups for rooms and so on, only lights). The buttons for lights got faders to dim them, but not the groups, so i have to long click them to dim. is it possible to get the faders directly in the tiles of the groups?

#

before i used helpers to group the lights i used groups in the config.yaml (or groups.yaml). also wasn't able to get the faders in the tiles.

patent pendant
#

I don't know where to start

#

I have all my integrations

tribal galleon
azure canopy
#

Anybody else using browser_mod popups where tap_actions are no longer working?

broken barn
misty mango
#

Does anyone have experience with the 'Minigraph" addon/plugin.

I am having a issue that I cannot fix or find a way to fix it

Issue: Minigraph only shows data-points per 2 hours

What I want: Show data points per per hour
The sensor in question I am using it for is a "zigbee" Temperature sensor which updates every 5 minutes

misty mango
#

Already have that in my YAML:

lyric prairie
#

That preview will not always show all changes.

#

And points_per_hour should not be part of the show: list

#

Should be on the same indentation level as entities:

lyric prairie
fossil heron
#

Is there a way of changing entity details popup style from this colored bar to graph?

#

I would prefer to have both sensors display data like this

#

I tried changing device_class to something else, but result is the same

#

Sensor type is 2byte_float (knx integration)

#

its really hard to see peaks on that colored bar on value that changes very rapidly

misty mango
lyric prairie
fossil heron
#

ah thanks

lyric prairie
misty mango
lyric prairie
#

That is what is expected by looking at the docs

shadow vessel
austere geode
#

is this not possible or is my syntax of:

  - entity: switch.shelly_plug_torretumbler
    name: {{ states.sensor.shelly_plug_torretumbler_power}}
azure canopy
#

Templates are not allowed in most cards

#

And if they are allowed in this particular place, there are multiple errors

golden mistBOT
#

@misty mango I converted your message into a file since it's above 15 lines :+1:

azure canopy
#

The template should be between quotes, and you are now returning the entire state object

tacit cave
#

@misty mango you can't have more than 1 sensor: section. Both go in the same section.

austere geode
tacit cave
#

name: "[[[ return states['sensor.shelly_plug_torretumbler_power'].attributes.friendly_name; ]]]"

austere geode
tacit cave
#

i.e. Don't guess

austere geode
#

just the text

tacit cave
#

... did you add the [[[ and ]]]?

#

with return?

#

all the rest stays the same

#

i.e.

name: "[[[ return states['sensor.shelly_plug_torretumbler_power'].state; ]]]"
short willow
#

Is it possible to define shapes as conditional elements in the picture elements card? I have an existing map with various elements, but have started to add motion detection. Rather than have the mdi motion dude icon, I figured it'd be good to flash that area red. Or is my only option to create the shapes as images?

tacit cave
#

there might be an icon with a specific shape, otherwise I don't believe that exists without implementing your own HTML

short willow
#

Ah k, ty

tribal galleon
broken barn
tribal galleon
#

Ah. Gotcha. I thought you did go with the helper route. I remember having to use the yaml method years ago to define a light group before it was able to be done in the UI. I still have the leftovers in my yaml.

daring path
#

Hey guys, this might seem to be a really stupid question but I just don´t get how the custom Frontend elements from HACS can be implemented in my Lovelace dashboard 🙄

So here is the problem: Some frontend elements that I got from HACS I can easily add to my Dashboard after I downloaded them. Others just wouldn´t even show up to be added, even when the files have been downloaded to the corresponding folder (config/www/community/).

Can anybody please tell me what is the magic trick to make these elements available to add? 🧙

dusty summit
#

have you restarted?

toxic ferry
#

this is my code type: custom:button-card
name: Avvia Timer
tap_action:
action: call-service
service: timer.start
service_data:
entity_id: timer.timer_cucina_main
duration: |
{% set minutes = states('input_number.timercucina') | int %}
{{ minutes * 60 }}
show_icon: true
show_name: false
icon: mdi:play
and i would liek to take the durations by my input type, it's called input_number.timercucina
if i start this it's gives me failed to start
How i can resolve it?

split granite
#

Cards don't support templates

golden mistBOT
#

@toxic ferry To format your text as code, enter three backticks on the first line, press Shift+Enter for a new line, paste your code, press Enter again for another new line, and lastly three more backticks.
```yaml
example: here
```
Don't forget you can edit your post rather than repeatedly posting the same thing.

toxic ferry
golden mirage
#

Read more infor in custom buttton card

#

type: custom:button-card
name: Avvia Timer
tap_action:
action: call-service
service: timer.start
service_data:
entity_id: timer.timer_cucina_main
duration: |-
[[[ return Math.floor(states['input_number.timercucina'].state * 60) ]]]
show_icon: true
show_name: false
icon: mdi:play

velvet minnow
tacit cave
#

yes, custom-button-card does it

#

@velvet minnow ^

velvet minnow
tacit cave
#

You could also think about installing lovelace_gen, or you could try auto-entities

#

both which "automatically" add things

#

however, both are hard to use

velvet minnow
#

Wish it was easier to create reusable templates in the frontend 😦

tacit cave
#

something like that will most likely never exist

#

if you want auto-generated UI's, you're going to be going all-yaml

#

auto-entities works in the UI, but it's still mostly yaml

velvet minnow
#

Would like to have all-yaml, but also want to to use the UI for testing and trying stuff out.

tacit cave
#

You can do both with separate dashboards

#

1 yaml, 1 UI

velvet minnow
#

Wait.. that's possible,.. 😮

tacit cave
#

yes...

#

you can have as many dashboards as you want

#

Settings -> Dashboards

velvet minnow
#

You have to be kidding me haha, thought you had to choose between those 2 😄

tacit cave
#

for the "overview" dashboard, you ahve to choose

#

but you can add any other dashboar

#

My main auto-generated dashboard is yaml

#

I have about 3000 lines of code that generate 400k+ lines of yaml

velvet minnow
#

😄

tacit cave
#

reqruies lovelace gen tho, which will be daunting

velvet minnow
#

Will take a look at it, sounds promising 😄

#

Lovelace_gen lets you use jinja2 templating in your lovelace config.

Exaclty what is was looking for haha, TYSM!

tacit cave
#

Keep in mind, it's base Jinja

#

meaning it doesn't have any HA extensions

#

i.e. you can't search the state machine

velvet minnow
#

That should be fine, simpel stuff as for loops would be awesome 🙂

tacit cave
#

yep, loops galore

#

I also write my configuration in jinja

#

instead of using the config file for lovelace_gen

#

which allows you to change your 'config' without restarting HA

#

you can use yaml to JS conversions to do that BTW

#

if you don't want to write the dictionaries out by hand

velvet minnow
#

Awesome, thanks for the information!

tacit cave
#

yes, that's lovelace gen

vestal zephyr
#

Is there a way to force cards to a certain column in the Dashboard? I keep trying to rearrange my cards how I want them but they just wont go into the way I want them in.

#

https://i.imgur.com/mHHlFa.png
Left is how it is, Right is how I want it, but no matter how I press on the little arrows on the cards it still doesn't end up like that. Is there a more controlled way of controlling the cards?

tacit cave
#

not really, the card order is dropped left to right.

#

so card 1 goes in the first column, card 2 second, 3 3rd, then from there HA tries to reduce your vertical scrolling so all bets are off

vestal zephyr
#

Oh it goes left to right first, that explains why I'm struggling so much with it lol, I thought it filled the first column first hehe

tacit cave
#

You can make the full page a panel, then use vertical and horizontal stacks to get something close to what you want

#

Also, keep in mind, if you resize the page, things go wonky

#

the whole thing is designed to minimize scrolling

vestal zephyr
#

I guess I just want 3 separate columns with manual control of what goes into each column, and the order of each

tacit cave
#

that would be a horizontal stack with 3 vertical stacks

#

and the view set to panel mode

#

keep in mind it will look like trash on mobile

vestal zephyr
#

oh hmm thats a good point. I can create 2 separate dashboards, one customized to look good on phone and one customized to look good on desktop, and set a different default dashboard for each device right?

fiery ledge
# tacit cave however, both are hard to use

Lovelace_gen is, but how is auto-entities difficult/hard to use ? It’s one of the most useful cards out there, and so super convenient, From straightforward listings to complex templates card/combinations .

#

Huh? What’s that??

tacit cave
#

because most people don't understand yaml

#

it's hard because you have to understand how the things link up, and it's not straight forward

fiery ledge
#

On mobile and have no clue where these skulls come from.. had to edit that on desktop.. sorry for that

fiery ledge
# tacit cave because most people don't understand yaml

confess only creating those in yaml, never the ui. But once you get the hang of it, I feel it grows on you... certainly worth the while. I even type the card_mods for them blindly now 😉 And ofc, you can copy&paste, or even better, anchor complete configs

tacit cave
#

right but he was interested in using only the UI

#

so, anchors, etc aren't an option

#

I'm not bashing it, I'm simply pointing out that it's not easy

#

many people here want easy

#

he didn't care about that, and went with lovelace_gen and a UI managed dashboard for quick tests

fiery ledge
#

right, sorry for intruding. my main objection to lovelace_gen has always been the fact is uses jinja, and with a config my size, that would really be costly. I could try a ui dashboard for experiments sake once again though

tacit cave
#

I'm not sure you understand how it works

#

it wouldn't be costly at all, it executes once.

#

I generate pages upon pages of data, all nested, all redirects. It's extremely fast.

fiery ledge
#

Now that it is quite settled, it’s a nice new challenge 😉

velvet minnow
#

@tacit cave lovelace_gen is soooo awesome!

tacit cave
#

Yep

#

makes it super simple

#

@polar kelp hasn't abandoned that integration yet, but if he does I'll probably take it over because my whole setup revolves around it

velvet minnow
#

It makes it so much less work when i want to change how a component (template) looks 😄

#

Need to get used to adding # lovelace_gen in every yaml file i want to use lovelace gen in. Happend already 7 times not knowing why the template isn't working because i've forgot to add that first line.. 😄

slim grove
#

SOLVED: I finally installed HACS properly. What I had done wrong was to attempt to install the HACS integration without already having the SSH addon activated. SSH addon is a requirement for installing HACS

timid beacon
#

Has anyone else noticed that the notification icon cache doesn't seem to be clearing properly?
It's always been a bit of a problem, but it seems like it's been worse recently

patent lark
#

Hey all, is grafana still used or has something else come along? I'm looking into some nice graphs and such for my RV lol

#

8 think mushroom cards is what I'm looking for lol

fiery ledge
worthy willow
#

Anyone using Apexcharts who knows if it's possible to only have one time-popup come when you click somewhere?

#

Currently there's 2 showing

azure canopy
#

I've seen petro mentioning lovelace gen several times, but never looked at it

#

but this is actually awesome

azure canopy
#

yes, I see that now

tacit cave
#

with your skills, you can take your UI from 100K+ to like 1K or less

azure canopy
#

installing it right away

tacit cave
#

It has some nuances

#

that you'll have to learn

#

like reloading and sometimes on startup you have to refresh the page

#

well,not sometimes, every time

#

you'll get "error in your config" after a restar, just refresh the page when HA is fully restarted

azure canopy
#

good to know!

tacit cave
#

Also

#

if you don't want to restart each time you add to your config, make your config in Jinja

#

that will allow you to reload when you add an item.

#

if you use the built in "config", you have to restart each time you add to it

azure canopy
#

not fully grasping that yet

tacit cave
#

So lovelace gen has the ability to pass a yaml file as an object you can use in jinja

#

that's your "config"

#

that variable does not update when you 'reload'

#

reloading reloads the Jinja & yaml for your UI, but not the config

#

it just makes it easier to manage and your changes are instant if you add something

azure canopy
#

ah okay, I think I get it 🙂

tacit cave
#

basically config is like configuration.yaml, can't adjust it without restarting. However lovelace-ui.yaml can be reloaded whenever you make changes.

#

same principle.

#

sooo.... put your "config" in your jinja instead. I use a yaml to JSON converter. I add to the yaml, then confert to JSON manually, then add it to my jinja.

#

EZPZ

azure canopy
#

so basically instead of (example from docs)

{% macro button(entity) -%}
  - type: entity-button
    entity: {{ entity }}
    tap_action:
      action: more-info
    hold_action:
      action: toggle
{%- endmacro %}
#

use

{% macro button(entity) -%}
  {{ [
    {
      "type": "entity-button",
      "entity": entity,
      "tap_action": {
        "action": "more-info"
      },
      "hold_action": {
        "action": "toggle"
      }
    }
  ] }}
{%- endmacro %}
tacit cave
#

no

#

that'd work

#

I'm specifically referring to this var

#

(hold tight)

azure canopy
#

🥁

tacit cave
#

i.e. Don't bother with global vars

#

Make your global vars in your master file, and pass all variables to other files

#

using jinja

#

see my config for examples. master.yaml in lovelace/views holds the key

azure canopy
#

I'll have a look

#

thanks

#

and just to be sure, do I have to add # lovelace_gen on all yaml files, or does it work down in includes?

tacit cave
#

you have to add that in all included files

#

it doesn't work in the first file

#

so I just point the first file to my main file

azure canopy
#

I read that

#

I already include a folder with views from my first file now

tacit cave
#

that's my 'ui-lovelace.yaml' file

#

quick and to the point

azure canopy
#

almost as small as my configuration.yaml

tacit cave
#

my configuration.yaml is huge

azure canopy
#

mine is just homeassistant: !include_dir_merge_named /config/include/homeassistant

tacit cave
#

you don't have any other yaml integrations enabled?

azure canopy
#

they are includes as packages

tacit cave
#

ah ok

azure canopy
#

The first part of that master file is what you meant with creating it as yaml right

#

with these macros

tacit cave
#

Oh no, I"m talking about this

#

(wait for it)

#

then taking the json output and assigning it to a variable

azure canopy
tacit cave
#

I don't, I iterate it to generate my dashboard

#

I use a custom "card" that auto generates the view based on the input

#

e.g.

#

areas generates what's inside the areas button you see there, it also generates that overview button

#

and areas looks like...

#

which is all autogenerated

azure canopy
#

ah, I see what happens when {%- set testing = true %}

tacit cave
#

yeah, that just creates the test button

#

I usually leave it true at all times 🤣

#

anyways, each area is auto generated via the areas config too

#

same princple, the area button is auto generated with an overview button and the button directs to a subview

#

all autogenerated, each page looks the same

#

FYI this is designed for mobile as I rarely use my UI for desktop

solar venture
#

in lovelace is possible to change the background cards with background-color, how is it possible to change the text color for entity name in the cards?

timid beacon
#

My thing with lovelace gen and some other integrations like that is you need to use yaml only. I don't get how people iterate on complex dashboards doing yaml only because you can't see changes immediately, no?

tacit cave
timid beacon
#

Maybe I'm over estimating how much of a problem it is, but I know at least with card_mod even a page reload would be too slow of a cycle

#

But I can never get card mod right for some reason. Or rather I can, but it's a serious struggle every time I come back to it. The whole shadow dom thing really throws me off with writing my selectors

#

But also in terms of getting cards right, the immediate feedback really helps when playing around with cards

tacit cave
#

🤷‍♂️ I just reload, takes 2 seconds and with lovelace gen you see the change everywhere it's used

timid beacon
#

One other strategy I've heard is to design the card in UI mode and then move it over to yaml mode when done. Which I can see working in some situations, but once you start with lovelace gen, your actual yaml is going to look vastly different and I can foresee running into snags

#

Is yaml vs ui mode universal per install or is it per dashboard?

tacit cave
#

per dashboard

timid beacon
#

Maybe I should duplicate my main dash and give it a shot and see how it works

tacit cave
#

personally, I value single point of origin changes over being able to see my changes as I make them

#

I have a sensor card, when I update it. All sensors update.

timid beacon
#

I'm 50/50 right now, I also value it highly but the feedback is also important so I haven't wanted to move away

#

I've been using the decluttering card to single point of origin

#

Though you can't edit that in the UI so maybe it's really just the same thing

#

How do you deal with duplication across dashboards?

#

That's been my main pain point with decluttering card. It's only per dash

azure canopy
#

you can import yaml files if you use yaml

#

or use yaml anchors

timid beacon
#

Ah ok, that solves that then

#

Isn't it true that you can't use anchors in your main configuration.yaml? I think I tried once but it seems like there's some kind of pre-processing that messed things up

#

I was looking for a solution for removing secret "blocks" I think

tacit cave
#

it's a separate file

#

not like decluttering

timid beacon
#

Ok, I'll have to play around with it before asking questions

tacit cave
#

so when I say "I make an update, it updates everywhere", I mean exactly that

timid beacon
#

Yeah, decluttering card ended up being kinda meh since it was per dash

#

I wonder if with the new custom_templates you could achieve something similar

#

If somehow you could render cards from what those macros generated

tacit cave
#

You can

timid beacon
#

You could maybe even get away with no reloads if you had something to auto reload templates when there are changes in that dir

tacit cave
#

but it wouldn't work in lovelace_gen

#

well, actually, I haven't tried

timid beacon
#

I would think you could call macros in lovelace_gen?

#

Is it not using the same template engine?

tacit cave
#

lovelace_gen does not have access to the extensions to jinja that HA provides

timid beacon
#

ah

tacit cave
#

the jinja that lovelace_gen uses is loaded prior to HA even starting for the most part.

timid beacon
tacit cave
#

You can make a macro that outputs yaml

timid beacon
#

Like there would need to be some kind of wrapper card I'd imagine to call the macro and display it as a card

tacit cave
#

TBH none of that is needed

#

because the way lovelace_gen works is that you include a card and it builds the yaml for you

timid beacon
#

Oh sorry, I meant as an alternative to lovelace_gen

tacit cave
#

no, that will not work as lovelace does not load jinja

timid beacon
#

It sounded like you wouldn't be able to use it with lovelace_gen anyways since it's a different templating environment

#

I do have some pretty ugly templates used with auto-entities cards that generate json I could probably move to a custom_template

#

But generating json isn't super fun

#

But yeah, I think I'll give lovelace_gen a shot next time I get a chance

#

Do you guys use auto-entities extensively as well, or is it not needed as much with lovelace gen?

#

From what I understand, lovelace gen doesn't update things at runtime so it's still needed

#

I have a real love/hate relationship with auto-entities though because it's error handling is a mess

tacit cave
#

auto-entities still serves it's purpose

timid beacon
#

I'm not sure why more people haven't pointed out the issue actually. It swallows errors and it doesn't properly wait for resources to load

#

So using a custom card inside auto-entities often fails

#

Maybe I have something messed up with my setup? But have you ever had a dashboard load with a bunch of error cards that resolve as the custom cards are loaded?

#

Basically if that card loads like that inside auto-entities, it swallows the error and just doesn't display

tacit cave
#

Well, I use loader card

timid beacon
#

Will take a look at that

tacit cave
#

well actually I don't now that I look at my config

#

but I used to

#

that's all I use

timid beacon
#

I posted a long comment in auto-entities after debugging the issue and came across all this error handling logic which incorrectly swallows errors

#

I thought card-tools was just for development or something?

tacit cave
#

it's required for many other custom cards

#

IIRC it's required for config template card

timid beacon
#

Was just gonna say, I need to check out that one as well

tacit cave
#

it may not be required anymore for anything

#

I haven't cleaned up my UI in ~2 years

#

maybe 3

timid beacon
#

Not required because of lovelace gen?

tacit cave
#

lovelace_gen is an integration

timid beacon
#

Not sure I follow

#

What did you mean not required then?

#

I don't understand why more people don't have this issue

tacit cave
#

card-tools may not be required for anything I have

#

I haven't look at anything and have been just blindly updating all my cards for about ~3 years

timid beacon
#

Oh sorry, I meant config template card, not card-tools

tacit cave
#

I think I use it in like 2 spots

timid beacon
#

Was that preloader card what you were referring to though? I'd like to correct the root of the problem if it's just me, but until then I'd like to use a workaround

tacit cave
#

I use it in one spot

timid beacon
tacit cave
#

Yeah that looks like it

timid beacon
tacit cave
#

I don't have issues with auto entities because I don't use anything custom

timid beacon
#

Ah ok

tacit cave
#

oh, that looks like it's it

timid beacon
#

It's mainly a problem for me cuz I use chip cards a lot since I try to keep my dash very minimal for some screens

#

Also most stuff is hidden on my dash and only pops up in the right context. Like a remote control card doesn't show up if I'm not at home

tacit cave
#

I used to do all that kind of stuff, then I found that I wanted those controls regardless if someone else is home

#

or guests when my wife and I are not home

timid beacon
#

Yeah I mean this is just for my own personal dash

#

I also dynamically build out some cards so like if I add a new motion sensor it's automatically added. I think lovelace gen might serve better there since that isn't something that really needs to be at runtime

golden mistBOT
#

@pallid zephyr I converted your message into a file since it's above 15 lines :+1:

pallid zephyr
#

... which I only tried because doing the same thing in the style key of the state-label didn't work either.

twilit abyss
#

new HA user.. at some point I must have been trying to mimic someone's dashboard.. my ui-lovelace.yaml is 600 lines long with a whole ton of crap that isn't valid.. My fault for not taking a backup before doing whatever the hell I did.. that being said, watchman (which I just found out about today) found all sorts of issues in that file (makes sense).. what's my best course of action for this? Thanks

verbal flame
#

Anybody else having issues with browser mod popups since 2023.7.3?

fiery ledge
#

well, I have this:

#

not very accustomed to browser_mod popups I am using smthng like: hold_action: action: fire-dom-event browser_mod: service: browser_mod.popup data: style: | --popup-border-radius: 0px; --popup-padding-x: 0px; --popup-padding-y: 0px; --dialog-backdrop-filter: blur(0.8em) brightness(1.2); --dialog-content-padding: 20px; which pops up just fine. On desktop I can click next to it and make it go away. On iOS app however, I can not... even when I swipe in another menu item, it stays... is there some option I need for that to make it go away?

#

not sure it is 2023.7.3 though..

arctic moat
#

Hi team — I'm wanting to track click events on my front end (to help gather data for UX improvements). I'm using https://umami.is/ for tracking... I'm a ex-frontend developer but my skills are way rusty. I'm attempting to use javascript to attach tracking events using document.querySelectorAll("ha-card") (for example) But it doesn't seem to be returning anything... Here's a wee snippet

#
(function() {
    document.querySelectorAll("ha-card").forEach((element, index) => {
        element.onclick = (event) => {
            console.log('Click' + index + ': ' + event.target.innerText);    // for debugging
        }
    });
})();
#

My guess is this has something to do with shadowDom? But I haven't actualy written any javascript is many years so I have no idea about this new fangled shadow dom stuff. Anyone have any thoughts/tips?

tribal galleon
random relic
#

This is probably an easy one... I have created a sub-view, but can't figure how to call it from another view...

tribal galleon
#

does a sub-view just need a navigate action?

random relic
#

yes. It does not show on it's own, can be navigated to and offers a "back" link, if I got it right

tribal galleon
#

lemme see if I can figure it out right quick. (I have not used sub-views before.)

random relic
#

Cool, thanks 🙂

tribal galleon
#

@random relic yaml tap_action: action: navigate navigation_path: /dashboard-lab/sub-view-testwhere dashboard-lab is the name of your dashboard, and sub-view-test is the name of the sub-view. Instead of tap_action, you can also use hold_action or double_tap_action.

random relic
#

Thanks a lot! Will try this out 🙂

tribal galleon
#

I realize now why I don't use sub-views. I hide my header on my tablets so the back button would end up not being seen (which it wouldn't be hard to add a "back" button). Navigation is done with hold_actions. So I can tap a button to turn on/off living room lights but press and hold and navigate to view containing "living room-related" stuff. Plus, I edit on PC so seeing the views on the header is fine for me.

random relic
#

Yeah, my front end is mostly a pure mess, but thought I'd sort it a bit to start with. This was a great addition

#

It is neat to use the hold action, but would've been even better if it could be made to indicate (mouse hover) that there are more actions defined...

tribal galleon
#

I'm slowly starting to incorporate popups with browser mod to lessen some of the different views that I have, a lot that just end up repeating what is on other views (such as other lights in the apartment).

tribal galleon
random relic
#

I bet there are custom cards that has that, just haven't looked for it

tribal galleon
random relic
#

Aha, well there probably was a reason then. Much have changed in last three years though

tribal galleon
#

But, in his defense, the stock cards (like you mentioned) probably can't do it but I'm willing to bet some fancy CSS work can be added. (It's possible to do animations with CSS so why not mouseover?)

random relic
#

Your right, it very well could be possible... Cool if so 🙂

#

thinking of just adding "[...]" after it's name, it works too

tribal galleon
#

I use yaml - '--mdc-ripple-color': white - '--mdc-ripple-press-opacity': 1.5on some of my custom:button-cards to create a "ripple effect" when the button is pressed.

random relic
#

Looks hopeful, agreed 🙂

random relic
tribal galleon
#
    styles:
      card:
        - background-color: transparent
        - '--ha-card-box-shadow': none
        - border-radius: 20px
        - '--mdc-ripple-color': white
        - '--mdc-ripple-press-opacity': 1.5
        - border: 1px solid var(--primary-text-color)```but, again, this is for the `custom:button-card` https://github.com/custom-cards/button-card 
(Light was a little slow to respond...)
#

Just realized I already had an example for something else that I was working on. (Dynamic grouping.)
EDIT: Back story on this, if you have a grouped entity (light.all_lights) and you adjust the brightness for it, all lights defined (even the ones that are off), will adjust to that brightness. With this Dynamic group, the entities contained will only be affected if they are currently turned on. This was something that @azure canopy worked on a little while back (He did 95% of the work; I basically came up with the idea.) but I haven't taken the time to write it up and post it in the forum.

random relic
#

Looks cool, I maybe should have a look at that some day, thanks for showing!

tribal galleon
#

Between custom:button-cards and Mushroom cards, you can do almost anything.

solar venture
#

I am struggling with card-mod, I can't find a way to change the color only to the entity name and not even to the entity value, can you please help?

verbal flame
#

Hi,

my iphone doenst seem to load css styling in cards anymore, so i wanted to reinstall the mobile app but i got the same problem in safari. A other iphone loads the frontend perfectly and android aswell.

Just 2 iphones wont load any of css styling. Some ideas?

#

So the exact problem is, that these 2 iphones display the browser mod pop ups, but none of the css styling seem to apply.
So the popup is only as big as the displayed card is and the background is blurred (on iphone 13, s22, taba7 and windows11)

but iphones 11 pro max and iphone x only show the popup with fullscreen dark background

mellow dune
#

How can i Make all of These looking Like 1 card with Buttons?

verbal flame
faint vortex
#

Or maybe someone more familiar with HA's development can help out? This only appeared recently, not sure if I should report this on github or if it's something from my settings

dry wind
faint vortex
#

ah damn I need those too :\

dry wind
faint vortex
#

I'm not sure why the issue was completed though, I had this enabled since I installed firefox and this issue only appeared in a recent HA update

dry wind
#

yeah same here

slim grove
#

Now that I have a better understanding of HA fundamentals I have been experimenting with custom cards and themes. I find a custom card which looks appealing at first, but the color scheme is much too garish.
Is there an online resource explaining the way themes are structured?

solar venture
#

it is, if there is a way to set a color only to entity name in a card and not to the entity value too, please share, I can't find it

tribal galleon
summer mist
#

is it possible to graph 2 entities with separate units on the same graph? (like have the y-axis on the left be one unit, and the right be the other?)

frozen olive
#

Does anyone know how the camera integrations work in terms of streaming? Cameras shown are RTSP, however browsers dont support RTSP, so just wondering how HA handles this?

steel moon
#

Hi did is possible to use with picture element the vertical-stack or horizontal-stack elements? 🙂

random relic
#

I'd like to add a screen wide console to my front-end, no edit, just for display of logs. Would anyone know if that can be done?

topaz gust
#

is there a way to hide certain switches in dwains dashboard?

#

like i have changed 2 of my wall switches to fan and light respectively but dwains dashboard still shows 2 switches as on when them two are the only active switches

lapis linden
#

I need to hide dashboards from sidebar and add views to this sidebar only on tablet user. This is possible?

#

Now I have energy, multimedia, map...

slim grove
#

@tribal galleon Excellent references! Thank you, I am working on my first theme file

tribal galleon
# lapis linden I need to hide dashboards from sidebar and add views to this sidebar only on tab...

This doesn't specifically answer your question, but for my tablets I have the sidebar completely hidden, the header is hidden, but I have the ability to swipe between views if needed. Push and hold actions are available for some navigation capabilities. For example, I have a view that shows an overview of each room; press and hold a card will take me to that room's view. Each tablet has "their own view" for the respective room so there is much browsing being done.
I use Kiosk Mode (https://github.com/NemesisRE/kiosk-mode) with users and entities set up to accomplish this.
hass-swipe-navigation (https://github.com/zanna-37/hass-swipe-navigation) for its capabilities.

tribal galleon
lapis linden
#

I want to have different sized items in the dashboard, this means I have to create grid within grid within grid within grid.... This is terribly unreadable and hard to maintain. Is there any dashboard in which I can merge and combine cells like in Excel?

lapis linden
#

Yes, I know. I try and I don't know why I don't use this, I don't remember... I need to check again

lapis linden
blazing wren
#

No, you can use the UI to add those cards and configure them. At least to an extent

lapis linden
#

Yes, but to defined columns and size I need yaml?

verbal flame
#

Hi,

im having big issues with browser mod popups.

  • Windows 11 Chrome shows them perfect
  • W11 Edge shows wrong background color
  • IOS 16 @Iphone shows wrong background color
  • Samsung S22 shows wrong background color

So the css doesnt seem to apply to these browsers. Already did a reset of all browser caches, even rolled back to 2023.7.2, reinstalled browser mod and even completely reinstalled a iphone

#

I dont know why, but the popups worked on 2023.7.2 and im now back to the exact same state of my install, and they show different results

#

How can i delete ALL browser mod related files?

tested the same popup with an old installation and works perfectly

polar kelp
#

Some of the styling variables for popups have changed to be more in line with default hass dialogs.

verbal flame
verbal flame
sudden fable
sudden fable
#

Thanks 😘

forest girder
#

Is there any method of using "conditional card" but only applying this to a single line of an entities card? Want to exclude any offline object from displaying OR make the message a little nicer (state_not: "unavailable")

sudden fable
#

then it'll only list those that are available

forest girder
#

Thanks, will check that out. Looking at nesting multiple conditional card within vertical stack but that makes the list a lot larger within the dashboard.

sudden fable
forest girder
#

Sorted thanks, looks like entity-filter did it (Wasn't aware of that option)

cerulean pollen
#

Hi. Wondering if anyone has had this issue and maybe have a solution.
I have a dashboard with buttons, and said buttons are quite finicky when displayed in the android app. IE if I don't very precisly tap them, they won't trigger. I think the issue is because if I ever so slightly move my finger during a click, it's interpreted as a scroll instead (even if there is nothing to scroll)

tawny marsh
#

does anyone know of a tv remote button that i can configure (and add) buttons to call a service individually?

hardy thicket
#

Hello, I've some problem with UI Lovelace Minimal, I'm trying to use a custom_card from Github but when I write the template code an error appears in my UI, can somebody help please?

thorn granite
#

Triple check you have all the prerequisites installed and force refresh your browser.

atomic turtle
#

Hey everyone! I need some help with my Homeassistant setup. I have an input number helper where I enter my current gas consumption amount.

However, I want it to save the data only when I press the return button or a specific button in the UI. Currently, it always sends the data after I deselect the card.

Is there a way to change that?

fiery ledge
#

I tried splitting a datetime in Javascript to only show the HH:MM and delete the :00 with .split(':00')[0], but that is not very nice when the datetime is set on a whole hour... it then only shows the HH. so, for now I settled on states['input_datetime.cover_dorm'].state.slice(0,5) but that feels even hackier. How can we do the split more correctly?

mystic timber
#

,Hi, I'm trying to set up sidebar-card on my dashboard.
I add those lines to my raw configuration
http://pastie.org/p/5XZbXr3FDo9xns2jpxYFD2
however I don't see the sidebar in my dashboard.
I do see an empty area that he suppose to be there, but can't see him. (I did hard refresh and empty cache in my browser)

solar venture
errant plover
fiery ledge
#

hope this is not too obvious, but we can set those tooltips on custom:button-card. Not the same as on just any core dashboard card, but on the ones I need tooltips, I use button-card. And, with only a few lines of css templates, style and speed them the way I like it.

#
styles_tooltip:
  styles:
    tooltip:
      - transition: opacity 0.5s
      - color: var(--primary-color) #var(--card-background-color)
      - border-color: var(--primary-color``` just so you are aware we have tools
azure wind
#

Hi all, I see there is now colour states in the ha icons. Where do we set the colour thresholds ? As an example I have a temperature sensor that I want to go blue or red depending on the current value

fiery ledge
#

there are hundreds of topics in the community on that specific subject. just show us what you have and go from there?

verbal flame
#

Is there any special thing to add, to use animated icons? (card mod installed)

#

the code should work, but no animation

fiery ledge
#

without any code, we can not see if there is anything to add.... post what you have, minimal config please, and we can have a look

verbal flame
#

Tried other methods with mushroom cards but they wont work either.

tribal galleon
# verbal flame Tried other methods with mushroom cards but they wont work either.

The thing is, you're using examples intended for use with Mushroom cards. The examples are not necessarily going to directly cross over a different card, especially a stock HA card. For example, this is for a Mushroom Template Card yaml type: custom:mushroom-template-card primary: Robot icon: mdi:robot-outline icon_color: deep-purple entity: input_boolean.tester card_mod: style: | ha-state-icon { animation: rotation 3s linear infinite; } @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

#

While, a custom:button-card just needs the following to accomplish the same thing yaml type: custom:button-card entity: binary_sensor.hallway_closet icon: mdi:star name: Rotating styles: icon: - animation: rotating 5s linear infinite alternate

tribal galleon
fiery ledge
#

well its actually very useful esecially in buttons with only an entity_picture and you dont want to spoil the view at first sight. hovering the cursor then shows what is all about.

#

or, even better shows a state dependent action you can perform```
tooltip: >
[[[ return (entity.state === 'on') ? 'Doe Cover override uit' : 'Doe Cover override aan'; ]]]

#

btw, posted this this morning... would you know how to simply show HH:MM on an input_datetime, other than this hacky manipulation states['input_datetime.cover_dorm'].state.slice(0,5) ?

tribal galleon
fiery ledge
#

yes but that is jinja.... I need js for button-card

tribal galleon
#

I have an example that I use in a function in Node-RED but I'm not sure how to make it work within a card. (I'm sure there is a better way it can probably be done too...)javascript const time_now_hours = new Date().getHours() const time_now_minutes = new Date().getMinutes() const time_now = time_now_hours + ":" + ('00' + time_now_minutes).slice(-2);

fiery ledge
#

haha, yes that is essentially just as hacky 😉

tribal galleon
#

yeah, but IIRC, javascript does handle dates and times very easily...

golden mistBOT
#

@pallid zephyr I converted your message into a file since it's above 15 lines :+1:

tribal turtle
#

I have what I hope is a simple question.

I'm using the custom secondaryinfo-entity-row card, and trying to do some basic math on two attributes. Unfortunately it's failing. But this syntax is working. Is it possible to do do some division within the js templating?

card:
  show_header_toggle: false
  title: TrueNAS Datasets
  type: entities
filter:
  include:
    - entity_id: /sensor.truenas_datasets/
      options:
        name:
          - []
        secondary_info: >-
          <b style='color:orange'>Pool:</b> <span style='color:white'>[[
          {entity}.attributes.Pool ]]</span> <br> <b
          style='color:orange'>Mountpoint:</b> [[ {entity}.attributes.Mountpoint ]] <br>
          <b style='color:orange'>Used:</b> [[ {entity}.attributes.Used ]] bytes<br>
          <b style='color:orange'>Free:</b> [[ {entity}.attributes.Available ]] bytes<br>
        type: custom:secondaryinfo-entity-row
show_empty: true
sort:
  method: state
  numeric: true
  reverse: true
type: custom:auto-entities

I want to display GB instead of bytes.

tribal galleon
#

@tribal turtle Honestly, IMO, I think the easiest route would be to create a template sensor which will create an entity with the value that you want to see. I'm all for trying to get the card to do as much of the work as possible. But, you're going to have to figure out how to implement some JavaScript into your HTML because HTML cannot perform math on its own. I can show you an example of one of my cards doing some math (without any HTML), but I don't know if it will help you implement. I hope it does though. yaml type: custom:mushroom-template-card primary: 'Status: {{ states("light.living_room_lights") }}' secondary: > {% set t = ((as_timestamp(now()) - as_timestamp(states.light.living_room_lights.last_changed)) | int) %} {% if t < 60 %} {% elif t < 3600 %} {{ t // 60 }} min {% elif t >= 3600 %} {{ t // 3600 }} hr {{ (t % 3600) // 60 }} min {% else %} error {% endif %}

#

Actually, take a look at @tame oriole's post a while back where he was doing some HTML and math-related stuff in a Markdown card. (Primarily rounding the values but that's the concept that I was mentioning with the HTML & JS working together.) #frontend-archived message

verbal flame
verbal flame
verbal flame
verbal flame
tame oriole
peak fox
#

Hi all, I've written a popup when pressing on a light card, which brings up the lights. The light card is a mushroom light card, and it doesn't work when tapped, only works when sliding the dimmer. Can anyone shed some light on this? I'm not sure what's going on and google doesn't really help.

Sliding the brightness bar turns the light on and off. Pressing the light on/off does not worked. I've even tried to specify the tap_action which still doesn't work.

This ofcourse works as normal without the popup card. Any help is appreciated.

The code is here: https://pastebin.com/7yLwkAcm

**EDIT:
Update to HA 2023.7.3 and clear cache. This solved the problem for me in the browser.

On the companion app now the popup css styling does not work (max height) and so it extends so large, it is in fact clickable but not the sizing is completely off and is glitching. Anyone else having this issue?**

austere geode
tribal galleon
tribal galleon
verbal flame
tribal galleon
verbal flame
misty mango
#

I am having some issues getting the RPI monitor card to work? [hacs] does anyone know what I am doing wrong?

Yaml data I currently have:
https://codeshare.io/DZX8XE

tribal galleon
#

Looking at the docs, I'm not sure if the card will accept a list of entities. I think it is meant for individual sensors.

misty mango
tribal galleon
verbal flame
unborn venture
#

Hello guys, I have a question about the icon-color of a sensor.
How can I change the icon-color based on the status of the sensor in customize.yaml ?
Thanks.

tacit cave
#

You can't change the color based on the value in customize.yaml

#

it's all done through themes or custom cards

verbal flame
#

Hey,

i want to click a mushroom chip to open a fire dom event -> browser mod popup, no problem so far.

But i want it so switch off a input bool at the same time, with 1 click.

Some ideas?

#

Should he possible with a script, but can a script use a fire dom event to only show the popup at ‚this device‘

tribal galleon
tribal galleon
# misty mango

It looks like that card relies on the RPi Reporter MQTT2HA Daemon to be installed on the Pi you're trying to monitor. But it looks like you're trying to use the built-in sensors. I don't think this card will do what you want it to do. (At least not at the moment without the daemon.)If you have a number of Raspberry Pis on your network then this might be the card you need to setup your Dashboard for monitoring all of you RPi's. Setup the sensor software on your RPi: See RPi Reporter MQTT2HA Daemon. Then install this card to display the state of your RPi.You can probably accimplish the same thing with an entities card but it will have less customization.
But, with that said, the custom:button-card has an example of turning it into a RPi Monitor. https://github.com/custom-cards/button-card#custom-fields

tribal turtle
tribal galleon
#

Post your yaml in a thread and lemme see what you're working with. (You're not limited to 15 lines when in a thread.)

tribal turtle
#

Post your yaml in a thread and lemme see

winged frost
#

best weather card suggestions please?

hot wasp
#

are there things in works to make ui and configuring dashboards better

#

because I'd say its by far the worst part of my home assistant experience so far

#

I get this like every few weeks

#

and dont remember how exactly to fix

dark dirge
#

Clear your browser cache

hot wasp
#

weird, that did fix it

#

but I dont think I've ever done that before to fix it

devout hatch
topaz adder
#

Hi everzone, does someone has a nice waz to show traffic maps ...Waze as a iframe does not look so nice.

Thanks

left sentinel
#

Is it possible that when you used to have an entity card with a toggle helper in and you clicked it it would just toggle? Right now it brings up a pop-up with a toggle button to change the state of it.

#

Do I even remember that correctly? And either way, is there still a way for it to be a button that toggles the toggle helper on and off without a pop-up?

#

If I use the entities card I still get toggles at the end of each line but that doesn’t seem to be an option for a mushroom-entity-card

#

Oh right, I found where the config is on the mushroom card, at least. I know I’ve seen and used that before.

random relic
pallid zephyr
#

grid-layout question. When I have grid-template-areas: "weather tesla solar" and grid-template-colums: 1fr 1fr 1fr, it does what I expect: each thing is 1/3 the width of the screen. The things are platinum-weather-card, picture-elements, and a grid-layout with 3 button-cards. When I change to "weather weather tesla tesla solar" with grid-template-columns: 1fr 1fr 1fr 1fr 1fr, I expect weather to be 2/5 screen width, tesla to be 2/5, and solar to be 1/5. Instead weather is 26%, tesla is 15%, there's a large gap, and solar way over on the right is 25%. How does this make sense? Don't adjacent cells with same name become a single div which the object then fills?

misty mango
verbal flame
left sentinel
random relic
#

np, I do exactly the same thing... 🙂

left sentinel
#

But my ulanzi with Awtrix is fully installed now, after 3 or 4 months since I bought it. Wa-hey!

#

(And in the process I found out that even for the 3-4 month old tutorial, my mushroom cards install was out of date cause it didn’t have a card they used…)

pallid zephyr
#

grid-template-columns defines 5 equal size columns so why is column 1 wider than column 2? The area labels are at least in the right columns - but the actual widget with the picture of the tesla is drawn in column 2 instead of columns 3 and 4. WTH??

#

Does view_layout not work inside picture-elements?

  • type: picture-elements
    view_layout:
    grid_area: tesla
    This is one of the cards inside a
    type: custom:grid-layout
    layout:
    grid-template-areas: 'weather weather tesla tesla solar'
    grid-template-columns: '1fr 1fr 1fr 1fr 1fr'
    cards:
    ...
fiery ledge
#

please custom:button-card users, have a look at the beta version currently in development. The author has updated a huge amount of new functionality, and now would be a good time to engage and help out checking for issues.

pallid zephyr
#

For crying out loud ... is all my suffering because it has to be grid-area instead of grid_area?

pliant mural
#

Is this possible at all?

        template: card_generic
        entity: sensor.server_room_energy_usage
        variables:
          ulm_card_generic_name: "Power Usage in [[ states('sensor.current_month') ]]"
          ulm_card_generic_icon: "mdi:flash"```
fiery ledge
#

what are you trying to do? iow, what is your questions really?

tribal galleon
pliant mural
#

Because it just shows up as Power Usage in [[ states('sensor.current_month') ]] in the card right now

fiery ledge
#

o I see, well no, that is a jinja template inside a button-card, which uses javascript

pliant mural
fiery ledge
#

did you check any of the million examples 😉

#

its very easy

#

[[[ return states['sensor.current_month'].state; ]]]

#

and I always put them on a multiline, so I dont have to mess with surrounding quotes

#
name: >
  [[[ return states['sensor.current_month'].state; ]]]
pliant mural
fiery ledge
#

no, you need to add that string inside the template

#

[[[ return 'Power Usage in ' + states['sensor.current_month'].state; ]]]

pliant mural
fiery ledge
#

in stead of asking, why dont you try?

pliant mural
#

The card just dissapears

fiery ledge
#

Errors in inspector maybe?

fiery ledge
#

And as d_sellers said: you have that template configured ?

slim grove
#

I am now happily using my personally customized theme file and learning to tweak all sorts of details. Nice. Can text properties (font, color, size, letter-spacing, line-height, etc) be manipulated in a theme file or does that stuff belong somewhere else?

tribal galleon
#

UI Minimalist is cool but it takes a bit to actually get it to work. Honestly, you might be better off just going with Mushroom Cards (https://github.com/piitaya/lovelace-mushroom) or styling your own custom:button-card (https://github.com/custom-cards/button-card) without all the UIM stuff. Use it as an example but design what you want.
There are lots of examples for the Mushroom Card here: https://community.home-assistant.io/t/mushroom-cards-build-a-beautiful-dashboard-easily/388590 and custom:button-card here: https://community.home-assistant.io/t/fun-with-custom-button-card/238450/762

sacred wolf
#

does anyone know how i can add custom CSS to one particular view or dashboard? i found the way to add resources, but I don't want to apply this CSS to the entire interface.

#

my problem is, I am using a custom card on a view with panel mode, and there is always a scrollbar on the side of the screen. I want to add overflow: hidden to the body to make the scrollbar not appear.

sacred wolf
faint flume
#

I dont know if this is the correct place to discuss this... Im using chromium browser in Ubuntu in kiosk mode on a tablet as an HA frontend. Yesterday, I updated Chromium and now kiosk mode doesnt seem to work. It now shows an activities menu and the ubuntu clock etc at the top of the display when previously my dashboard was full screen. Has anyone seen this happen or have any tips?

spare dome
#

Hello
I've setup zones on the map. Is it possible to change the person status on the dashboard to specific status depending on the zones? Such as "Home, Shopping, Working Out, At work" etc.

tribal galleon
tribal galleon
fiery ledge
#

wouldnt the person entity do that itself? I mean its either Home, Not home or in a zone, and with the new translations that should just work out of the box?

tribal galleon
#

It should report what zone the user is in, but if you want to customize what is shown, that's where the template comes in.

sacred wolf
#

alright, new problem. how can i remove the space between cards and make them touch each other?

plain pike
#

got card-mod?

sacred wolf
#

i do

plain pike
#

IIRC there's a borderless card option

sacred wolf
#

all of my cards are in nested vertical and horizontal stacks

sacred wolf
plain pike
#

sorry not at home, and I don't have internet to dial into my HA and check

sacred wolf
#

oh i meant i will try to see how that option works

plain pike
#

I know what you meant 😛 I was preemptively saying that

#

something like

style: |
              ha-card {
                background: none;
                box-shadow: none;
              }
#

should work

#

obviously with proper indentation etc

sacred wolf
#

okay, i just realized that i have to put that in every card instead of just in the top stack card

plain pike
#

yeah unfortunately

tribal galleon
#

Consider the custom:stack-in-card.

#

Or if you're using a custom: button-card, you can make a template to apply to the cards you want look the same.

plain pike
#

im just glad d_sellers1 agrees with what I said

#

imagine the shame and embarrassment otherwise

late anvil
#

I can at least recognize some cards from @polar kelp, @hoary river and @mild veldt (+ button-card)

short willow
#

When using a conditional element, is there a way to delay the "disappear"? I have motion detection from my cameras, so I have conditional elements in my picture-elements that only show when motion is detected, but sometimes the motion is only like 0.5 seconds. I'd like the state-icon to show for say 5 seconds before disappearing again

dark dirge
#

Create a template binary_sensor based on your motion sensor entity with a delay_off of however long you want. Then use that in your card

plain pike
#

that's genius

short willow
#

Ah thx, will give it a go

short willow
#

So the condition could be either the motion sensor, or the binary_sensor, but the element would be the binary_sensor, so it uses the delay_off. Nice

dark dirge
#

The condition would be just the binary_sensor

tribal galleon
late anvil
#

Yes, I know, but HA uses apache 2.0 licence. They have open-sourced the modified code, though... I don't know if that's enough

plain pike
#

yeah the site doesn't even translate properly when you select english just shows the polish

tribal galleon
#

I get the open source aspects but to just copy everything and brand it as their's, that's not right (I wouldn't think). Then, if an open source project doesn't have a license defined (a custom card for example), how do the rights work with that?

late anvil
#

if no licence is defined, then they can't use it at all

tribal galleon
#

It looks like they grabbed just about every custom card out there.

#

I recognized your username. I suggested custom:button-card sooo many times!

late anvil
plain pike
late anvil
#

I'm giving some well required love to button-card at the moment haha, so going through the issues 😅

tribal galleon
#

That's interesting. So one of their users ended up on your Github for support. Too funny.

plain pike
#

Not what I was thinking D_

#

I've not done much card modding

#

🤣😂

forest girder
#

Can anyone point me straight on the syntax for adding entity "attribute" within a entity-filter card?

#

Can do with regular entity card but trying to put list into entity-filter

tacit cave
#

don't think you can do it with that card

#

you'd have to use auto-entities

forest girder
#

OK thanks, wasn't sure if I was missing anything on the documentation 😦

tribal galleon
#

There's a section in the docs talking about filtering attributes but not sure it is relevant to what you're trying to do.

  state_filter:
    - operator: regex
      value: "^([0-7]{1})$"
      attribute: eta```and```yaml
  state_filter:
    - operator: ">"
      value: 50
      attribute: humidity```
#

Like, are you trying to make a list of devices with CR1632 batteries. Or a list of devices and then it tells you what each battery is?

forest girder
#

Will be a fill list of devices with battery type. Have it in the Entity-Filter so I can then filter out anything which isn't working or disconnected etc.

#

Think Auto-Entities is what most people mention on search. Was just trying to keep it to native cards.

tribal galleon
#

You may find yourself outgrowing the capabilities of native cards. That's where the custom cards come into play. For example, I use custom:battery-state-card (https://github.com/maxwroc/battery-state-card). (Don't mind some of the entities shown here in the screenshot. I need to update/remove some...)

forest girder
#

Looks like state_filter is just for filtering and not changing entity info which is displayed.

#

Thanks for the pointer, will take a look at the custom cards and use those. Not using supervisor so didn't want lots of manual updates to custom_components mods

tribal galleon
#

You can install HACS without supervisor. There are instructions for Container and Core users. I would assume once you installed HACS, it should be able to keep your cards and whatnot updated.

plain pike
#

HACS is not friendly to those with IPoAC

#

😢

tribal galleon
plain pike
#

yeah and packet loss can be is an issue

tribal galleon
#

Only like 55%. No biggie. 😆

plain pike
#

I'll DM you some pings later if you like

#

55% would be an upgrade

tribal galleon
#

I was just looking over the ping response packets...

plain pike
#

but the latency actually is ok, you just can't stream a movie file until it's done

#

goes from 0%-100% in one jump

tribal galleon
#

true. it all depends on how you encapsulate the data. But distance is also a significant factor.

plain pike
#

Thankfully my the island I live on is only 21 miles long and 7 miles wide

dark dirge
#

that's a big backyard

#

I hope you share it

pallid zephyr
#

Can I do this in configuration.yaml? The path to it isn't covered by the mappings of either /hacsfiles or /local. That's where I find custom:grid-laayout and I'm quite often getting "Custom element doesn't exist" for that.
frontend:
extra_module_url:
/config/custom_components/ui_lovelace_minimalist/cards/lovelace-layout-card/lovelace-layout-card.js

plain pike
plain pike
pallid zephyr
#

It hasn't made the problem go away so either I'm using the wrong path or it's not the right thing to do.

#

I've experimented a bit and there doesn't seem to be any error message anywhere if you use a path that doesn't exist.

plain pike
#

my pigeons are wet so I can't connect to home right now

#

and I didn't take my laptop out the truck because we are having torrential rain atm

jagged cove
#

Hi All, whats the best way to acheieve this sort of layout where the lines encompass the vertical stack rather than the individual items in the stack - I currently have a vertical stack, then a horizontal stack in it for the two gauges.

#

For reference, as apposed to this:

tribal galleon
# jagged cove Hi All, whats the best way to acheieve this sort of layout where the lines encom...

Similar question asked about 12 hours ago by carpet. KrAzIe242 suggested some style options. I suggested looking at the custom:stack-in-card (https://github.com/piitaya/stack-in-card). You can also apply some card_mod (https://github.com/thomasloven/lovelace-card-mod) yaml card_mod: style: | ha-card { border: none; }In this mockup, I used a stack-in-card with two horizontal stack cards each containing three custom:button-cards. (I also applied the card_mod to each of the custom:button-cards; something about the way that card interacted with the stack-in-card or something... The custom:button-card is capable of templating, so that could have been an option too.)

plain pike
#

I'm just glad I knew something about front-end work lol

earnest lagoon
#

I've been trying to build out a dashboard in yaml, and I'd like to have some graphs on it, but they always flicker, and seem to also sometimes cause my custom:expander-cards to collapse and the page to jump. Am I doing something wrong here?
https://monosnap.com/file/UBTtOZqgUwg6T96QcmZDf5QE3LTF7X

sick lake
#

Area cards can display a camera feed for the area instead of an image, which is great! However, Frigate creates camera entities for each of the detected object types, and since the actual camera device belongs to an area, so will those entities.

As a result, the area card sometimes displays detected objects instead of the feed. Any way I can fix this without changing the camera entity names or area?

austere geode
#

Any who knows something about car charger and power card plus ?

#

My home charger has an attribute that shows the consumption but hos do I put that ind my card/frontend ?

lofty remnant
#

Does anyone know how I can easily replicate this?

tacit cave
#

it looks like picture elements or the grid card with buttons

lofty remnant
tacit cave
#

a single button card for 8 buttons?

#

you'll need a grid card no matter what

#

that looks like its a 5 by 3 grid of buttons where some buttons are not filled in

lofty remnant
# tacit cave a single button card for 8 buttons?

I hadn't thought of creating a stack within a stack. Thanks for the hint. I managed to achieve such a thing, I will create my dream remote control to control the TV. And do you know any way that will make it easier to type text from your phone on a samsung smart tv?

lofty remnant
#

Okay, Thanks again for the idea 😄

earnest lagoon
#

I want a card like the energy-devices-graph but can be used for real time power or current consumption, not energy. Does such a thing exist?