home-assistant-custom-ui icon indicating copy to clipboard operation
home-assistant-custom-ui copied to clipboard

Customizable Slider Size

Open epiller opened this issue 6 years ago • 3 comments

Thought I'd chime in and suggest a feature I'd appreciate so much: Customizable slider size while in "single-line" mode.

Why?

  • The whole entity takes a lot of space when using "break-slider", which is bad, especially on mobile.
  • It's better when using "single-line", but the slider is too big and covers most of the text/name of the entity, which isn't that visually appealing.
  • The full-sized slider can be found (by default) when clicking on the entity anyways.

My suggestion:

  • Ability to select the percentage of the entity the slider will take and/or
  • An option to force whole entity name to be shown (so the slider will resize automatically to make space for the text).

By the way, amazing work on the project @andrey-git

epiller avatar Jan 12 '18 12:01 epiller

You can already theme the slider by setting --ha-paper-slider-width via themeing. If you set it (for example) to 100px the slider will never take more than 100px, but it could still take less if there is not enough space.

Does this solve your usecase?

andrey-git avatar Jan 12 '18 13:01 andrey-git

I'm not sure if it would solve the usecase because (I think) it would shorten the slider width globally, so all of the sliders across homeassistant would be limited to 100px?

P.S. I'd test what you suggested but I'm don't know where should I put the --ha-paper-slider-width, hence my uncertainty.

epiller avatar Jan 12 '18 14:01 epiller

You define themes as usual:

frontend:
  themes:
    shortslider:
      ha-paper-slider-width: '100px'

Then you can apply it on a single entity or on an entity-in-group:

homeassistanbt:
  customize:
    light.light_with_slider
      state_card_mode: single-line
      group:
        group.my_lights:
          theme: shortslider

andrey-git avatar Jan 12 '18 20:01 andrey-git