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

Replace the fullscreen "x" icon with a back arrow #9838

Merged
merged 3 commits into from
Sep 19, 2018

Conversation

kjellr
Copy link
Contributor

@kjellr kjellr commented Sep 12, 2018

As per comments by @SNaushadS and others in #9567, the x icon in the upper left corner of fullscreen mode could be misinterpreted as a button for exiting out of full screen mode. Since the button takes you "back" to the All Posts screen, a back arrow may make more sense here.

Current:

screen shot 2018-09-12 at 12 36 02 pm

New:

screen shot 2018-09-12 at 12 35 18 pm

As per comments in #9567. The `x` icon to close the editor while in fullscreen mode could be misconstrued as a button for exiting out of full screen mode. Since the button actually takes you back to the All Posts screen, a back arrow may make more sense here.
@kjellr kjellr added the Needs Design Feedback Needs general design feedback. label Sep 12, 2018
@kjellr kjellr self-assigned this Sep 12, 2018
@chrisvanpatten
Copy link
Contributor

Would this also be a good candidate for a tooltip?

@youknowriad
Copy link
Contributor

@chrisvanpatten I think there's already a tooltip

@kjellr
Copy link
Contributor Author

kjellr commented Sep 12, 2018

I think there's already a tooltip

That's right. Currently:

screen shot 2018-09-12 at 12 52 52 pm

I figured we'd keep the tooltip the same:

screen-shot-2018-09-12-at-12 52 52-pm

@chrisvanpatten
Copy link
Contributor

My bad! 🙈

@aduth
Copy link
Member

aduth commented Sep 12, 2018

I find the arrow to be an improvement over the "X", for reasons expanded upon in Slack (link requires registration).

For me, it's a bit of the difference between "exit out of ..." (X) vs. "return to ..." (left arrow), where the expectation of "exit out of" would be to close full screen mode. This might be particularly true when one is simply clicking around and happens to find themselves stumbled upon the full screen mode, and then needs an escape route (as was my scenario). I think "exit out of" could work, if we were to use an icon more associated with leaving vs. closing an intermediary (full screen as a mode). I've seen "Exit" icons like these before, for example:

image

https://thenounproject.com/search/?q=exit&i=1920857

@aduth aduth mentioned this pull request Sep 12, 2018
@jasmussen
Copy link
Contributor

Love this, and love Andrews suggestion also.

jasmussen pushed a commit to WordPress/dashicons that referenced this pull request Sep 19, 2018
This adds an "Exit" icon, which is used to exit fullscreen mode in Gutenberg.

See discussion in WordPress/gutenberg#9838 (comment).
@jasmussen
Copy link
Contributor

Added the icon to Dashicons: WordPress/dashicons#321

Added the sprite to Gutenberg in #10025

CC: @kjellr

@kjellr kjellr requested review from jasmussen and aduth September 19, 2018 17:20
@kjellr
Copy link
Contributor Author

kjellr commented Sep 19, 2018

@jasmussen You are the absolute best. Looks great:

screen shot 2018-09-19 at 1 17 50 pm

screen shot 2018-09-19 at 1 18 08 pm

Would someone mind giving this a review?

Copy link
Member

@aduth aduth left a comment

Choose a reason for hiding this comment

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

Code-wise this is 👍

@jasmussen
Copy link
Contributor

Ship it!

@kjellr kjellr added this to the 4.0 milestone Sep 19, 2018
@kjellr kjellr merged commit d5bbd81 into master Sep 19, 2018
@kjellr kjellr deleted the update/full-screen-close-icon branch September 19, 2018 17:59
@kjellr
Copy link
Contributor Author

kjellr commented Sep 19, 2018

🎉 Thanks, all!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Needs Design Feedback Needs general design feedback.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants