Application Wide Style Refresh: Enhancement/Issue Tracking

[abrown45]

This is a place to track minor enhancements/issues with the material design UI.

Issues

High Priority

• [x] IE Action Buttons are not Clickable (CM#7345 5.21.2021)

  Medium Priority

• [x] IE does not have themeing (CM #7331 14.13.2021)
• [x] Invalid login credentials error message missing (CM# 7101 10.16.2020)
• [x] Custom font and icons are blocked on HTTPS (CM# 7100 10.16.2020)

  Low Priority

• [ ] Chrome: the autocomplete on load doesn't work well with the field
• [ ] Chrome: the autocomplete's background doesn't fill the label
• [ ] Firefox: the fields remain active after autocomplete on load
• [ ] Firefox: weird issue with opacity when hovering off an active button
• [x] Chrome: prepopulated from URL query params has end of label clipped (CM#7100 10.16.2020)
• [x] Sizing of the elements on the page is too large (CM #7331 14.13.2021)

  Enhancements

  Low Priority

• [ ] The coloring annotations process and code can be reworked for better user experience
• [ ] Section document action icon same as white color. Sectioning icon should change

[abrown45]

CM# 7100 UPDATE PHASE 0 STYLE REFRESH: FONT USAGE - currently Open Sans and material design icons are linked to the google font api. previously this links had hardcoded protocols which prevented Open Sans from being used for HTTPS protocols. this commit updated those locations and others that hardcode the protocol to rely on the client to determine the protocol. Additionally this fixes an issue where the material design floating labels were clipped if Open Sans wasnt cached client side. CR: aking, skovacinski , iwhiting

[abrown45]

CM# 7101 PHASE 0 STYLE REFRESH: LOGIN FORM VALIDATION - this commit adds form validation to the login screen. username, password, and docid are now required and are displayed in a material design way. adding localization form helper text underneath the form. CR: aking, skovacinski , iwhiting

[abrown45]

CM #7331 MATERIAL DESIGN STYLE REFRESH PHASE 1 - updating the AEV toolbar to use material design components and icons. All CSS styling around the toolbar has been updated to use best coding practices, reusable logic, and material design standards for spacing, padding, font sizes, etc. All actions received updated logos and were assigned helper text for the dropdown menu. The timing data popover remains bootstrap but will be replaced in a later phase. Updates to the default.properties for icons and new flags is necessary. Client projects that override those properties will need to update their icons, changes to edge and release are done in this commit. Additional enhancements made to login and other pages that used material design especially for IE browser support. This is part of a greater effort to remove bootstrap and modernize UI of the application.

GH: https://github.com/tsgrp/OpenAnnotate/issues/820 CR: jlittle, aking, mbrouillette

[abrown45]

Commit #7345: STYLE REFRESH BUG FIX: IE BUTTONS NOT CLICKABLE - updating action buttons to be div elements due to an issue in IE. IE does not propagate click events from a child element of a button up to the parent button so to counter this the elements are converted to divs and button behavior styling is added as a class. If support for IE is discontinued, these divs should be replaced back to buttons. GH: #902

CR: mbrouillette, dvora

[gsteimer]

Moved to Jira: https://alfresco.atlassian.net/browse/SEP-77