search

custom-cards / bar-card

Customizable Animated Bar card for Home Assistant Lovelace
MIT License
364 stars 52 forks source link

Rounded corners #137

Closed lcavalli closed 2 years ago

lcavalli commented 2 years ago

It would be nice to have the possibility to apply rounded corners to the bar. Not sure it can be achieved with alternative methods, like card-mod.

lcavalli commented 2 years ago

Looking at this screenshot image it is possible, but the sample code presented

entity: sensor.example
positions:
  icon: 'off'
  indicator: inside
  name: outside
type: 'custom:bar-card'
width: 70%
title: 2.0.0 Default Layout
style: |-
  bar-card-value {
    margin-right: auto;
    font-size: 13px;
    font-weight: bold;
    text-shadow: 1px 1px #0005;
  }

doesn't produce the same result.

lcavalli commented 2 years ago

Solved, this is the correct style to apply:

style: |-
  bar-card-currentbar, bar-card-backgroundbar {
    border-radius: 4px;
  }
bcutter commented 1 year ago

So why did you close this issue? I was running into the same and searching my back off why the example is not working.

You fixed it for you (and I'm thankful for sharing your solution), but the docs at https://github.com/custom-cards/bar-card#200-default-layout-requires-card-mod are still wrong.

So just REOPEN and FIX the docs ⚠