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

Make UI more like other admin apps, prevent accidental publishing #466

Merged
merged 17 commits into from Apr 10, 2015

Conversation

@fofr
Copy link
Contributor

@fofr fofr commented Apr 10, 2015

Supercedes #464 (force-pushed after master rebase so couldn't re-open old PR)

Differences with #464:

  • Move the withdraw button to a different place, because its actions are more like those of publish and it's not a safe action
  • Re-instate the warning messages for when something can't be published, and check the appropriateness of those messages

Original PR

  • Use Bootstrap form styles rather than custom ones (and extract common form parts into partials)
  • Use admin template pattern for attachments table, and truncate large tables with a JS toggle (some documents have over 100 attachments) – instead of alphagov/specialist-publisher#461
  • Separate publish, edit and withdraw actions and add confirm dialogues to irreversible actions
    • Completely hide publish button when unavailable, a disabled button is
      confusing
  • Correctly space sections on the show pages with a consistent vertical rhythm
  • Use lead styles to make summary more readable
  • Remove collapsible body function, instead restrict height, and don’t show at all unless there is a body
  • Reduce dependencies on govuk_frontend_toolkit – currently Bootstrap and the toolkit don’t play well together

https://www.pivotaltracker.com/story/show/90529348

Editing a document

Before

screen shot 2015-04-02 at 11 55 02

After

screen shot 2015-04-02 at 11 55 21

Viewing a document

Before

screen shot 2015-04-02 at 11 53 32

Actions:
screen shot 2015-04-02 at 11 53 46

After

screen shot 2015-04-02 at 11 53 58

Actions:
screen shot 2015-04-09 at 16 59 57

Truncated attachments table

screen shot 2015-04-02 at 12 09 22

Warnings

screen shot 2015-04-02 at 11 54 33

fofr added 17 commits Mar 27, 2015
Match the behaviour of other admin apps and use styles provided by the
admin gem.
* Remove “hover” style, items aren’t clickable, use striped instead
* Add a missing table row element
* Add table-header class to highlight headings
Prevent checkboxes from appearing too far left of content. This matches
the recommended Bootstrap 3 pattern: http://getbootstrap.com/css/#forms
A row with col-md-12 in this case is the same as no row and no cell.
* Make it harder to accidentally click the wrong one.
* Put the more commonly used edit button first.
* Hide the publish button altogether when you can’t publish, disabled
buttons have proved to be confusing in the past and users continue to
try and interact with them
Use a lighter colour to indicate when an item was updated, to make the
list of sections or manuals easier to scan.
* Correctly space sections with a consistent vertical rhythm
* Use `lead` styles to make summary more readable
* Remove collapsible body function, instead restrict height, and don’t
show at all unless there is a body
* Remove dependencies on govuk_frontend_toolkit – currently the admin
template and the toolkit don’t play well together
A date is usually enough to determine how recently something has been
changed.
`<pre>` tags have a default word wrap that causes words to break
mid-word, which makes reading content difficult.
* Bump admin gem to pick up confirm JS module
* Use module to warn when clicking publish or withdraw buttons and to
confirm user action
* Separate publish, withdraw and edit buttons to avoid accidental clicks
* Always include a title on the “publish” container
* Completely hide publish button when unavailable, a disabled button is
confusing
* Some documents have a couple of attachments, others have hundreds
* Always show the first 5 attachments
* When more than 5 and when JS is enabled, hide the rest behind a
toggle with a link that indicates how many more attachments will be
revealed
* Pattern pulled from Transition where it was well received for tables
containing hundreds of mappings
Rather than hiding the entire `publish` pane, put it back with
appropriate messaging.

* Don’t mark the panel itself as dangerous, the publish action is red
and that’s enough
* Don’t give warnings when there are no changes or a user can’t publish
* Use smart quotes in messaging
Clearly distinguish between editing, publishing and withdrawing. As
withdrawing is the least used action it is at the bottom.
When something is withdrawn it is draft like, but not a draft. Instead
indicate that the document can still be edited and published.
@evilstreak
Copy link
Contributor

@evilstreak evilstreak commented Apr 10, 2015

👍 This is great

evilstreak added a commit that referenced this pull request Apr 10, 2015
Make UI more like other admin apps, prevent accidental publishing
@evilstreak evilstreak merged commit a613008 into master Apr 10, 2015
1 check passed
1 check passed
default Build #1909 succeeded on Jenkins
Details
@evilstreak evilstreak deleted the improved-ui branch Apr 10, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

2 participants
You can’t perform that action at this time.