-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix visibility for shown entities on device card #22579
base: dev
Are you sure you want to change the base?
Fix visibility for shown entities on device card #22579
Conversation
Important Review skippedAuto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the fix 🎉
There is still too much space when you have just the button +x entities
.
What about refectoring it a bit?
3 wrapper:
- shownEntities
- seperator (only visible if shown + hidden length > 0
- hiddenEntities
then you just have to add lit condition instead of css magic.
src/panels/config/devices/device-detail/ha-device-entities-card.ts
Outdated
Show resolved
Hide resolved
Please take a look at the requested changes, and use the Ready for review button when you are done, thanks 👍 |
This comment was marked as resolved.
This comment was marked as resolved.
…d.ts Co-authored-by: Wendelin <[email protected]>
Hi @wendevlin , thanks for reviewing. Is adding a separator line between 2
|
No as ${shownEntities.length && hiddenEntities.length ? html`<div class="entities-separator"></div>` : nothing} So you don't have to set a margin for the button and the list, just show it or hide it. |
@wendevlin
instead of
So, now a space between
So, introducing a conditional |
#22577 must be merged first since it fixes a disabled entity row's height.
Breaking change
Proposed change
Currently if a device card contains only disabled entities, it causes a big vertical gap between a header & 1st disabled entity:
This PR:
#entities
element only if some enabled entities present.After the fix (note that changes in #22577 here accounted - a fixed row's height = 40px):
If some entities are enabled:
Type of change
Example configuration
Additional information
Checklist
If user exposed functionality or configuration variables are added/changed: