Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - Set min-width of entire area to 1100px - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - Font weight of FxA email address is too bold. Match to spec (semibold) - Make entire FxA section clickable, rather than just account avatar
Bug 1575604 Comment 0 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - Set min-width of entire area to 1100px - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - Font weight of FxA email address is too bold. Match to spec (semibold) - Make entire FxA section clickable, rather than just account avatar - Consider not stacking FxA sync and button copy to multiple lines (default to horizontal scroll sooner... may be worth some discussion)
Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - Set min-width of entire area to 1100px - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - Font weight of FxA email address is too bold. Match to spec (semibold) - Make entire FxA section clickable, rather than just account avatar - Consider not stacking FxA sync and button copy to multiple lines (default to horizontal scroll sooner... may be worth some discussion) this pairs well with what also needs to be handled in the main content area: - change max-width of content area to 700px (currently 798px)
Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - Set min-width of entire area to 1100px - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - ~~Font weight of FxA email address is too bold. Match to spec (semibold)~~ - ~~Make entire FxA section clickable, rather than just account avatar~~ - Consider not stacking FxA sync and button copy to multiple lines (default to horizontal scroll sooner... may be worth some discussion) this pairs well with what also needs to be handled in the main content area: - change max-width of content area to 700px (currently 798px)
Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - Set min-width of entire area to 1100px - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - ~~Font weight of FxA email address is too bold. Match to spec (semibold)~~ - ~~Make entire FxA section clickable, rather than just account avatar~~ - Consider not stacking FxA sync and button copy to multiple lines (default to horizontal scroll sooner... may be worth some discussion) this pairs well with what also needs to be handled in the main content area: - ~~change max-width of content area to 700px (currently 798px)~~
Making the following updates to the positioning and behavior of elements within the header bar of logins and passwords: Design: https://mozilla.invisionapp.com/share/EJRHBMEDKF8#/380121226_Lockwise_Desktop_Home_-_Min-Width Zeplin: https://zpl.io/2yWd76o Tasks: - ~~Set min-width of entire area to 1100px~~ - Set width of search area to 400px, lock left side of search field to align with login details column (consider setting min-width of 320px to account for longer email addresses, or truncate email address in instances where it's too long) - ~~Font weight of FxA email address is too bold. Match to spec (semibold)~~ - ~~Make entire FxA section clickable, rather than just account avatar~~ - ~~Consider not stacking FxA sync and button copy to multiple lines (default to horizontal scroll sooner... may be worth some discussion)~~ this pairs well with what also needs to be handled in the main content area: - ~~change max-width of content area to 700px (currently 798px)~~