Library: Restyle the action buttons for Sakai tools (Primary and Secondary actions)
Description
Attachments
- 28 Sep 2018, 02:38 PM
- 28 Sep 2018, 02:38 PM
- 28 Apr 2017, 03:02 AM
- 28 Apr 2017, 02:57 AM
incorporates
is depended on by
relates to
Activity
Shawn Foster June 24, 2020 at 10:20 AM
@Laura Gekeler, I noticed that you added the 19.x merge flag to this recently. This ticket was fixed for 19.0, so it should already be in 19. Therefore, the merge flag is not needed.
Is there a problem that you've noticed about the fix?
Shawn Foster September 28, 2018 at 2:39 PM
I have submitted my fix for this, which standardizes how buttons look and act in Sakai:
it simplifies the button design code and variables;
it specifies consistent states, including hover, action, focus, and disabled;
it introduces primary and secondary action buttons
it fixes cases of primary and secondary action buttons throughout the tools
it fixes issues with the font that caused issues with button and icon alignment
it cleans up extra tool-specific styles that are no longer necessary or that previously made the interface inconsistent
Here is the result:
Shawn Foster October 18, 2017 at 3:27 PM
While working on this ticket, consider SAK-33329, which is a case of jQuery styling the buttons. Bootstrap may also affect button styles.
Following @Kyle Blythe recommendations in SAK-31204:
Currently, all actionable buttons in several tools are styled the same, with blue background and white text. This makes it difficult to scan through and identify the primary action (e.g., "Post" or "Submit"), as all of the buttons look the same.
We recommend following the approach used by Google and other apps, wherein the "primary" action is styled with a background color, and all other actions be styled in a light grey so as to be less attention-grabbing.
The main objective of this Jira is update all the Sakai tools to follow this convention, like this example in Assignments:
OLD:
PROPOSED: