Lovelace: Button card

Is that because features of this card are going into the core card? … Please say yes :grin:

1 Like

I have to ask… Does your Switch Theme input_select get populated automatically in some way or do you have to do it manually if you add a new theme? If it is automatic, how do you do that?

And, what is the card below that?

Like you noticed, I see the label card is taller that it should be. I’ve noticed that regardless of spacing my text takes two lines. So the Text"Doors locks" shows up as

Doors
Locks

Could not figure how to not make it take two lines

The padding adjustment fix that @DavidFW1960 posted above works for label card too. I haven’t been able to get it working when I update the button-card.js file though (perhaps it’s aggressively cached or something?). So I had to try his values in the Chrome web inspector, and it was looking much nicer.

Took the plunge. After quite some hard refreshing finally it started working.
But it seems that the option
- font-size: 9px
Is not getting respected. And also the font changed. Anyway to get it back?

Just before the upgrade
image

After
image

Main problem is the space between the letters. Even the following CSS doesn’t get it close to what it used to be. First used to be. Below with the CSS code

  button-card-button div {
    font-family: 'Arial Narrow', Arial, sans-serif;
    font-size: 90%;
    font-stretch: 50%;
    font-weight: 500;
    white-space: nowrap;
  }  

image

It’s an input select that has all the themes defined so I can select from a drop-down list.

The card below is this button card and it selects and uses the next theme in the list.
image

anyone using this card on iOS in 88.1? I’m getting errors and I’m wondering if it’s just me.

2019-02-24 18:35:02 ERROR (MainThread) [frontend.js.latest.201902200] https://local/lovelace/button-card.js:1:53 TypeError: undefined is not an object (evaluating 'Object.getPrototypeOf(customElements.get("hui-error-entity-row"))')

image

1 Like

I updated (the card) minutes before my post asking the question. The card works everywhere but the iOS app. I can’t tell if the iOS app isn’t reloading the cache because there is no way to do that.

it works fine in the iOS app

It’s working for me in the iOS app (both 1.5.1 stable release and 2.0 beta). Likely just need to keep refreshing until it works, maybe force quitting would help with that.

the fact that it is still loading the error-entity-row means it is using the cached version

Yeah, and this damn iOS app won’t let me refresh the cache. I’ll try a restart and worse case a reinstall.

Yeah, I’ve force quit about 15 times now hoping the cache would reload.

just keep hitting the refresh button

I love iPhone for the simplicity… but man, sometimes I wish they would add some tools to handle caching. I still can’t get the damn app to update the .js files.

Edit: Finally reloaded properly.

you don’t have 2 of them do you? If you use custom updater, they did move the card… did you update resources?

Mine now looks like this for this card:
image

  - type: module
    url: /customcards/github/custom-cards/button-card.js?track=true

With Ludeuus’ new updater

Yeah, phone was just in a funky state. Not sure what sparked it but it finally updated. I’m running on an old model and haven’t updated the os in a while. Could be related to all of that.

The changes to the font are really triggering me. They feel more like someone clicked the Bold button a’la MS office or changed the font entirely. I’m also noticing an issue with the placement of text, specifically text that should be centered is actually not.

Is it possible the font settings are being misinterpreted somehow?

Try this one for correct text size and font.
https://github.com/CookieMonster87/button-card/blob/master/button-card.js

Not my work. Its one one the previous versions from user ammmze if I remember correct. Fixed the 0.88 issue and still show correct text style like before.

3 Likes