stack-in-card
stack-in-card copied to clipboard
Tooltip not visible if out of border
Checklist:
- [x] I updated to the latest version available
- [x] I cleared the cache of my browser
Release with the issue: 0.1.0
Last working release (if known): None
Browser and Operating System: Chrome and Windows 10, Android
Description of problem:
The tooltip of some cards (like history, for example) cuts if outside borders. This does not happen with the default vertical-stack
Javascript errors shown in the web inspector (if applicable): None
Additional information:
Have to confirm this.
- Just a history-graph - tooltip is displayed properly:
type: history-graph
entities:
- entity: sun.sun
hours_to_show: 72
refresh_interval: 0
- history-graph inside a vertical-stack - tooltip is displayed properly:
type: vertical-stack
cards:
- type: entities
entities:
- sun.sun
- type: history-graph
entities:
- entity: sun.sun
hours_to_show: 72
refresh_interval: 0
- history-graph inside a stack-in-card - tooltip is clipped:
type: 'custom:stack-in-card'
cards:
- type: entities
entities:
- sun.sun
- type: history-graph
entities:
- entity: sun.sun
hours_to_show: 72
refresh_interval: 0
I think the reason of this clipping may be a CSS style "overflow: hidden" for the 'stack-in-card':
So the workaround is using card-mod:
- type: 'custom:stack-in-card'
style: |
ha-card {
overflow: visible !important;
}
cards:
- type: history-graph
entities:
- sun.sun
hours_to_show: 6
refresh_interval: 0
Π― Π΄ΡΠΌΠ°Ρ, ΡΡΠΎ ΠΏΡΠΈΡΠΈΠ½ΠΎΠΉ ΡΡΠΎΠ³ΠΎ Π²ΡΡΠ΅Π·Π°Π½ΠΈΡ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΡΠΈΠ»Ρ CSS Β«ΠΏΠ΅ΡΠ΅ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅: ΡΠΊΡΡΡΡΠΉΒ» Π΄Π»Ρ Β«ΡΡΠ΅ΠΊΠ° Π² ΠΊΠ°ΡΡΠ΅Β»: ΠΏΠΎΡΡΠΎΠΌΡ ΠΎΠ±Ρ ΠΎΠ΄Π½ΡΠΌ ΠΏΡΡΠ΅ΠΌ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΊΠ°ΡΡΡ-ΠΌΠΎΠ΄
- type: 'custom:stack-in-card' style: | ha-card { overflow: visible !important; } cards: - type: history-graph entities: - sun.sun hours_to_show: 6 refresh_interval: 0
I upvote this solution for input_select as well.
Without using card_mod it looks like this:
After changing the styles, everything works correctly:
I upvote this solution for input_select as well.
https://github.com/custom-cards/stack-in-card/issues/40#issuecomment-1114349515 ΠΠΎΠΊΠ° Π²ΠΎΡ ΡΠ°ΠΊ, ΡΠΎ ΡΡΠΈΠ»Π΅ΠΌ. Currently we have to use card-mod to prevent clipping.
It kinda feels this project is abandoned as well... This is a very simple issue, but it also looks like that overflow was added by the author for some reason, given the other cards don't have that style rule.
I should point that, even though while editing the card_mod
change could cause scrollbars, they don't happen in the dashboard.