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

UX: always show image preview controls, improve spacing #27489

Merged
merged 2 commits into from
Jun 17, 2024

Conversation

awesomerobot
Copy link
Member

This makes it so the image resize/alt-text controls in the composer editor are always visible on desktop, instead of relying on hover (they're already always visible in the mobile preview).

This makes the controls more discoverable, and if we position them over the image, it means we end up with a preview that has spacing much closer to the cooked result.

We planned on doing this long ago, but lost sight of it: https://meta.discourse.org/t/make-it-more-obvious-an-image-is-resizable-when-uploading-an-image/132030

Before:
image

After:
image

and cooked spacing...

Preview before:
image

Preview after:
image

Actual spacing in cooked post:
image

For tiny images... more of the image is obscured this way, but there's a slight transparency so it's still somewhat visible:

Before:
image

After:
image

Other states like grid and editing:

image

image

@discoursebot
Copy link

This pull request has been mentioned on Discourse Meta. There might be relevant details there:

https://meta.discourse.org/t/make-it-more-obvious-an-image-is-resizable-when-uploading-an-image/132030/10

@awesomerobot awesomerobot merged commit 0a99407 into main Jun 17, 2024
16 checks passed
@awesomerobot awesomerobot deleted the ux-image-preview-controls branch June 17, 2024 12:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
3 participants