New issue
Advanced search Search tips

Issue 854567 link

Starred by 2 users

Issue metadata

Status: Fixed
Owner:
Closed: Jul 16
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: iOS
Pri: 1
Type: Task
Q2



Sign in to add a comment

UX Request: Assets and Spec for the Find Bar

Project Member Reported by rohitrao@chromium.org, Jun 20 2018

Issue description

Please provide assets and a spec for the new find bar.

Does any part of the design change now that the toolbar and tabstrip are opaque on tablet?

Assets:
- Text field background.  (This might reuse the same asset as the omnibox?)
- Previous and next images.  (In the normal, highlighted, and disabled states, if applicable).
- Magnifying glass icon that lives in the text field.
- Text colors for the search text and the results count label.
- Non-translucent background color on tablet.

Specs:
- Layout on phone
- Layout on tablet (likely the same as phone, just with the additional width all going to the text field.)
- Positioning on tablet.
- Rounded corner radius for the bubble on tablet.



 
Labels: M-69
Labels: Q2
Cc: gambard@chromium.org
Pete, we'd like to start working on the implementation of Find in Page.  Will you have time in the next few days to spec this out?
Owner: gambard@chromium.org
Per offline discussion with gambard@:

- Use the same next/previous assets, just tint them #1A73E8
- Change close "X" to "Done", tinted the same color as next/previous controls, and set in SF at 17pt
- Container view background color should be opaque #fafafa in both CxAny and RxR
- Searchfield background color should match omnibox (but seeing as container is opaque, we can use an opaque color of #E3E3E3
- Searchfield corner radius should be 10 to match [standard] UISearchBar style (like in history)
- Searchfield input text and placeholder text colors should be in sync with the Omnibox for the given mode (incognito or regular)
- Searchfield count label color should match the placeholder label color but + 0.2 to the alpha component
- Searchfield input text, placeholder and count label font size should match the focused font size of the omnibox (15pt in CxR and 17pt in all other size classes)
- **No** magnifying glass icon (like shown in deck)
- layout in CxAny size classes should be as it is today (same size of and covering the [top] toolbar)
- layout in RxAny uses the same bubble container view specs (13pt corner radius with the same shadow asset)
Amendments to #4:

- layout in **CxR, AxC size classes** should be as it is today (same size as and covering the [top] toolbar)
- layout in **RxR** uses the same bubble container view specs (13pt corner radius with the same shadow asset)
- Searchfield background color should match omnibox, so use the same respective alpha components unless you see a perf hit, then I can get you necessary opaque values
Status: Fixed (was: Assigned)

Sign in to add a comment