[Passwords and forms] Update layout of password/address components |
||||||
Issue descriptionAs dbeam mentioned, Chrome handles a wide variety of different address formats. For the UI, we are told: 1) how many lines to show 2) how many fields should appear on each line (up to 3) @bettes said he could share guidance on how to handle arbitrarily many lines, how to space multiple fields on a single line, etc.
,
May 27 2016
For passwords specifically, I presume it's best if each column occupies a percentage of the page, given that the page width is responsive. I've included some numbers in the spec. For truncation of text, we should ensure that the 8px padding is respected, even when resizing the window if possible. (Currently, it does not do that in the build) Let me know if that helps https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Inner%20Pages/03-Settings/specs#%2FSPEC-cards_passwords.png%3Fz=width
,
May 27 2016
Screenshots of what the old address components look like. The only constant fields are: Country, Phone and Email Huge variety in address formats can be seen at chrome://settings/autofill
,
May 27 2016
I was a bit confused by Alan's mock (the numbers don't seem to add up to 622px), but here are some attempted clarifications: Re: passwords, the relative widths of the domain/username/password should be preserved as the user changes the width of the page. The exact percentages of those columns' widths to the width of the card won't stay the same, but the relative widths are what matter. For address forms, I'd assume we want the same behavior. Once we know which fields should appear on which lines, we should lay them out with 8dp padding between them and equal widths that respond to changes in the width of the page. Does that make sense?
,
Jan 6 2017
@hcarmona is this fixed? I also noticed that if you have a long domain (eg. https://airborne.gogoinflight.com), it will cause the username to be indented at the narrowest width. This makes the username in that row mis-aligned with all the other rows.
,
Jan 6 2017
,
Jan 9 2017
Issue 619777 should track the long username breaking layout. Created CL to address spacing issues that this bug mentions: http://crrev.com/2617403004 Attached screenshot of change; nothing major. 16px->8px for spacing between columns 20px->10px between the overflow menu and password (also corrects ripple clipping)
,
Jan 9 2017
,
Jan 9 2017
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/dc55ca6a8ab2daee62837eba062cdba8bae4d4da commit dc55ca6a8ab2daee62837eba062cdba8bae4d4da Author: hcarmona <hcarmona@chromium.org> Date: Mon Jan 09 22:45:37 2017 [MD Settings] Fix spacing and ripple for passwords section. Screenshot in bug. BUG= 609160 CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation Review-Url: https://codereview.chromium.org/2617403004 Cr-Commit-Position: refs/heads/master@{#442383} [modify] https://crrev.com/dc55ca6a8ab2daee62837eba062cdba8bae4d4da/chrome/browser/resources/settings/passwords_and_forms_page/passwords_section.html [modify] https://crrev.com/dc55ca6a8ab2daee62837eba062cdba8bae4d4da/chrome/browser/resources/settings/passwords_and_forms_page/passwords_shared_css.html
,
Jan 10 2017
|
||||||
►
Sign in to add a comment |
||||||
Comment 1 by tbuck...@chromium.org
, May 24 2016