search

kinghat / tabbed-card

a custom card for home assistant that utilizes tabs to segregate individual cards.
MIT License
103 stars 10 forks source link

Remove focused background? #23

Closed RefineryX closed 1 year ago

RefineryX commented 1 year ago

Loving this addition.. thanks for you work on this!!

When changing tabs, I see that the 'active' or 'focused' background stays. However, when clicking outside of the area, the focused background is removed.

How do I remove this background entirely?

Demo:

ezgif com-gif-maker

kinghat commented 1 year ago

Loving this addition.. thanks for you work on this!!

When changing tabs, I see that the 'active' or 'focused' background stays. However, when clicking outside of the area, the focused background is removed.

How do I remove this background entirely?

so you want it so only the active tabs indicator icon(underline) is shown?

RefineryX commented 1 year ago

Loving this addition.. thanks for you work on this!! When changing tabs, I see that the 'active' or 'focused' background stays. However, when clicking outside of the area, the focused background is removed. How do I remove this background entirely?

so you want it so only the active tabs indicator icon(underline) is shown?

Correct. Just the underline and not the block background.

kinghat commented 1 year ago

Correct. Just the underline and not the block background.

setting your global style ripple color to transparent should work:

- type: custom:tabbed-card
  styles:
    --mdc-ripple-color: transparent

if that dosnt work for you, lmk!

RefineryX commented 1 year ago

Thanks so much... that worked! This is a real game changer and thanks again for your work on this!

I have a couple of questions / comments:

Current Styling: 1

Shortened- stacked tabs left: 2

Shortened - stacked centered 3 Though I believe a similar style can be done via minWidth but this still spreads the tabs 100%

kinghat commented 1 year ago

I have a couple of questions / comments:

for future can you keep an issue to one topic as things can easily get lost. thinking about making issues only for actual issues and feature requests go into discussions.

* **GUI:** I would love if there was a GUI version.... yaml is somewhat a pain to manage esp for dashboards when there is a stack within a stack within a grid etc.

already noted and in progress: https://github.com/kinghat/tabbed-card/discussions/27

* **Tab position:** Is it possible to align the tab to the bottom and have the tabbed-content appear first?

was thinking about this and will probably end up being added at some point.

* **Width:** I see that `--mdc-tab-height` controls the height and wondered if there is an equivalent for `width`? The current behaviour is that the tabs spread 100% of the content - evenly distributed. For example:

Current Styling: 1

Shortened- stacked tabs left: 2

Shortened - stacked centered 3 Though I believe a similar style can be done via minWidth but this still spreads the tabs 100%

someone else asked about this(another reason to move to single topic issues/discussions) and im not sure i really want to stray away from what the underlying components were designed to do.

kinghat commented 1 year ago

if you would like to open a discussion -> ideas for the bottom tab bar and your width feature it would be appreciated. i moved the other feature requests there as well.