Skip to content
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

Tweak cell resize handles #6082

Merged
merged 2 commits into from
Jul 16, 2024
Merged

Tweak cell resize handles #6082

merged 2 commits into from
Jul 16, 2024

Conversation

ruggi
Copy link
Contributor

@ruggi ruggi commented Jul 15, 2024

Problem:

The grid cell resize handles don't scale correctly with zoom < 1, and they get off-center if the element frame is too small.

Fix:

  1. Use a different rendering strategy for the elements (position: absolute instead of grid) so they can scale more easily when the relative container frame gets tiny
  2. Hide the handles if the frame is too tiny (relative to the zoom too)
  3. Hide the other three inactive edge handles when resizing is in progress, so they don't look off
Before After
Kapture 2024-07-15 at 18 04 36 Kapture 2024-07-15 at 18 03 10
https://github.com/user-attachments/assets/d6ba7995-c73e-4715-b4a1-1efb92ae3d5d https://github.com/user-attachments/assets/a889a07b-60fa-4519-bd37-8001ca583f35

I have no idea why GH is truncating those GIFs, see the mp4 attachments for reference

Fixes #6081

Copy link
Contributor

github-actions bot commented Jul 15, 2024

Try me

Copy link

relativeci bot commented Jul 15, 2024

#13383 Bundle Size — 62.65MiB (~+0.01%).

4bf9966(current) vs 6339ece master#13381(baseline)

Warning

Bundle contains 70 duplicate packages – View duplicate packages

Bundle metrics  Change 2 changes Regression 1 regression
                 Current
#13383
     Baseline
#13381
Regression  Initial JS 45.72MiB(~+0.01%) 45.72MiB
No change  Initial CSS 0B 0B
Change  Cache Invalidation 21.57% 22.21%
No change  Chunks 31 31
No change  Assets 34 34
No change  Modules 4371 4371
No change  Duplicate Modules 521 521
No change  Duplicate Code 31.68% 31.68%
No change  Packages 469 469
No change  Duplicate Packages 70 70
Bundle size by type  Change 2 changes Regression 1 regression Improvement 1 improvement
                 Current
#13383
     Baseline
#13381
Regression  JS 62.64MiB (~+0.01%) 62.64MiB
Improvement  HTML 11.16KiB (-0.33%) 11.2KiB

Bundle analysis reportBranch fix/grid-cell-resize-handles-sca...Project dashboard

@ruggi ruggi merged commit 2052444 into master Jul 16, 2024
14 checks passed
@ruggi ruggi deleted the fix/grid-cell-resize-handles-scale branch July 16, 2024 09:19
liady pushed a commit that referenced this pull request Dec 13, 2024
**Problem:**

The grid cell resize handles don't scale correctly with zoom < 1, and
they get off-center if the element frame is too small.

**Fix:**

1. Use a different rendering strategy for the elements (position:
absolute instead of grid) so they can scale more easily when the
relative container frame gets tiny
2. Hide the handles if the frame is too tiny (relative to the zoom too)
3. Hide the other three inactive edge handles when resizing is in
progress, so they don't look off

| Before | After |
|--------|------------|
| ![Kapture 2024-07-15 at 18 04
36](https://github.com/user-attachments/assets/6f919b88-4bd7-4592-b788-a0939eb96520)
| ![Kapture 2024-07-15 at 18 03
10](https://github.com/user-attachments/assets/3778cebb-1ab0-409f-b256-21d7ed3300ef)
|
|
https://github.com/user-attachments/assets/d6ba7995-c73e-4715-b4a1-1efb92ae3d5d
|
https://github.com/user-attachments/assets/a889a07b-60fa-4519-bd37-8001ca583f35
|

_I have no idea why GH is truncating those GIFs, see the mp4 attachments
for reference_



Fixes #6081
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

grid cell resize handles are funky with zoom < 1
3 participants