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

Editor: Fixed sidebar glitches #28358

Open
wants to merge 2 commits into
base: dev
Choose a base branch
from

Conversation

ycw
Copy link
Contributor

@ycw ycw commented May 13, 2024

The issues:

  1. Editor's sidebar not wide enough for language ja , so on first-run, the property tabs will be wrapped:

image

  1. Currently sidebar's width is unrecoverable, so say Japanese users have to resize the sidebar every time the editor restarted (including refresh the page for purging texture input's cache :D)

  2. Resizer can be dragged way too far to the right, so for languages fr and ja the property tabs will be wrapped:

resizer.too.far.mp4
  1. Resizer can be dragged way too far to the left, so once users release the pointer, the resizer can't be dragged again because it's now out of window:
resizer.is.gone.mp4

This PR:

  • Fixed 1 by detecting effective language on first-run, and then set proper width
  • Fixed 2 by (re)storing sidebar's width to Config
  • Fixed 3 by restricting sidebar's min-width based on editor Settings>Language
  • Fixed 4 by setting lower bound of sidebar's width to 10(px) instead of 0(px)

Preview: (open in incognito mode to mimic first-run) https://raw.githack.com/ycw/three.js/editor-sidebar-width-is-user-pref/editor/index.html

Comment on lines 12 to 15
'en': 350,
'fr': 355,
'ja': 395,
'zh': 335
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is yet more code that needs to be maintained.

I'm sure there's a solution for this issue that doesn't create more maintenance work.

Copy link
Contributor Author

@ycw ycw May 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

css?

Copy link
Contributor Author

@ycw ycw May 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok, i found a way to eliminate those numbers, by auto sniffing the possible max width among tabbed panels inside the sidebar

@ycw
Copy link
Contributor Author

ycw commented May 16, 2024

done :D

@mrdoob
Copy link
Owner

mrdoob commented May 23, 2024

Making the tabs horizontally scrollable may be a better solution.
Had to figure out the CSS for it on https://mrdoob.com/ menu some months ago...

@ycw
Copy link
Contributor Author

ycw commented May 23, 2024

done. see #28467

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.

None yet

2 participants