You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
In this example I wanted a dark border highlighting which side of the widget the user will be resizing however there is a noticeable gap due to the following css rule which enforces a 15px buffer around the resizers.
I assume this would be possible with the below. The z-index of the diagonal resizers is higher than the horizontal and vertical resizers so I don't think there would be any negatives to extending the positions of the horizontal and vertical resizers to the limits of the widget contents.
Hovering over the ui-resizable-w is correct and the border is using the margin of 0.5rem however ui-resizable-s is wrong and the south border appears lower than the widget container.
Expected behavior
The resizable border should appear to be the border of the content and therefore use any margins specified.
The text was updated successfully, but these errors were encountered:
adumesny
added a commit
to adumesny/gridstack.js
that referenced
this issue
Dec 17, 2023
Subject of the issue
https://jsfiddle.net/hy6cbLf9/1/
The css of the ui-resizable-s and ui-resizable-n is not taking into account the margin specified like the rest do.
I think the below is missing in gridstack.ts from _updateStyles:
In this example I wanted a dark border highlighting which side of the widget the user will be resizing however there is a noticeable gap due to the following css rule which enforces a 15px buffer around the resizers.
.grid-stack-item>.ui-resizable-e {
cursor: e-resize;
width: 10px;
top: 15px;
bottom: 15px;
}
I think it is visually more pleasing if the border extends to the limits of the widget contents as shown in the below fiddle:
https://jsfiddle.net/hy6cbLf9/3/
I assume this would be possible with the below. The z-index of the diagonal resizers is higher than the horizontal and vertical resizers so I don't think there would be any negatives to extending the positions of the horizontal and vertical resizers to the limits of the widget contents.
Your environment
10.0.1
Chrome
Steps to reproduce
https://jsfiddle.net/hy6cbLf9/1/
Hovering over the ui-resizable-w is correct and the border is using the margin of 0.5rem however ui-resizable-s is wrong and the south border appears lower than the widget container.
Expected behavior
The resizable border should appear to be the border of the content and therefore use any margins specified.
The text was updated successfully, but these errors were encountered: