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

UI: Add notices for published, updated, save failed #967

Closed
jasmussen opened this issue Jun 1, 2017 · 4 comments · Fixed by #1564
Closed

UI: Add notices for published, updated, save failed #967

jasmussen opened this issue Jun 1, 2017 · 4 comments · Fixed by #1564
Assignees
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). General Interface Parts of the UI which don't fall neatly under other labels. [Type] Task Issues or PRs that have been broken down into an individual action to take
Milestone

Comments

@jasmussen
Copy link
Contributor

Splitting this out from #707. The flow for publishing and saving is soon in a good place.

We have, however, a need for a few edgecase notices:

  • Published successfully
  • Updated successfully
  • Scheduled successfully

... as well as failure states:

  • Publishing failed
  • Updating failed
  • Scheduling failed

... and also for draft saving and auto saving:

  • Save failed

Save Failed

Let's make this part of the "Save" area on the left:

saving publishing

Publish/Updating/Scheduling notices

We'll probably want notices after all (see also #486), because thankfully we were able to test for a while a design where the notice itself was integrated in the button. Not only did this feel ephemeral, but it made the button itself feel more complex. It also doesn't work that well if we ever get to exploring a dropdown button as suggested in #708.

So here's how notices could look:

notices

@jasmussen jasmussen added General Interface Parts of the UI which don't fall neatly under other labels. Design labels Jun 1, 2017
@afercia
Copy link
Contributor

afercia commented Jun 1, 2017

Worth noting that all these notices would need an equivalent audible feedback for screen reader users. As a general rule: any "visual" notice needs to be communicated also non-visually.

@afercia afercia added the [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). label Jun 1, 2017
@melchoyce
Copy link
Contributor

FWIW, we have a separate set of notice styles in core for notices on a white background:

image
image
image

If the inspector/sidebar is open, would the notice overlap or appear to the left of it?

@jasmussen
Copy link
Contributor Author

Let's totally use the colored versions as they are.

@melchoyce
Copy link
Contributor

Cool — they all use the .notice-alt class:

<div class="update-message notice inline notice-warning notice-alt">
    <p>Notice Message.</p>
</div>

@mtias mtias added the [Type] Task Issues or PRs that have been broken down into an individual action to take label Jun 22, 2017
@mtias mtias added this to the Beta 2 milestone Jun 22, 2017
@youknowriad youknowriad self-assigned this Jun 26, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). General Interface Parts of the UI which don't fall neatly under other labels. [Type] Task Issues or PRs that have been broken down into an individual action to take
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants