fix(gridsterItem): fix z-index on moving/resizing items being overridden by inline style#985
Open
naterchrdsn wants to merge 1 commit into
Open
Conversation
…den by inline style The [style.z-index] host binding always emitted an inline style with the base layer z-index (default: 1), which took precedence over the CSS class rules for .gridster-item-moving and .gridster-item-resizing (both set z-index: 2), making those rules effectively dead. Add isMoving and isResizing signals to GridsterItem. Convert zIndex() to a computed signal that bumps the z-index by 1 when either flag is active. Wire set(true/false) calls into the drag/resize start and stop handlers so the inline value itself is elevated during interaction, eliminating the CSS specificity conflict. Fixes tiberiuzuld#982
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #982
gridster-item-movingandgridster-item-resizingCSS classes had no effect because the inlinez-indexstyle set on each item always overrides class-based styles.Root cause:
zIndex()was a plain method that returnedbaseLayerIndex + layerIndexunconditionally, and was bound via[style.z-index]directly. The CSS classes.gridster-item-moving/.gridster-item-resizingsetz-index: 2but inline styles win in the cascade.Fix:
isMovingandisResizingsignals toGridsterItemzIndex()method to acomputed()signal that bumpsz-indexby 1 when either flag is trueisMoving/isResizinginGridsterDraggableandGridsterResizableat drag/resize start and stopThis makes the stacking order reactive and correct without touching the CSS.