1405710 - Find In Page does not have Photon theme

Status: VERIFIED FIXED

(Firefox for Android Graveyard :: Theme and Visual Design, defect)

Description

[Mark]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Safari/604.1.38

Steps to reproduce:

Open the 3 dot menu and hit "Find In Page", FF Android Nightly 04-10-2017 & Beta 57.0b4


Actual results:

The Find In Page bar does not have the Photon theme, it has a black background etc


Expected results:

The bar should have the Photon theme (white background etc)

Comment 1

[Jing-wei Wu [:jwu]]

Attachment: Bug 1405710 - Adjust find in page layout to fit Photon style.

Review commit: https://reviewboard.mozilla.org/r/188628/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/188628/

Comment 2

[Nevin Chen(Not active on Bugzilla)]

Comment on attachment 8917702 [details]
Bug 1405710 - Adjust find in page layout to fit Photon style.

https://reviewboard.mozilla.org/r/188628/#review193916

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/d9e77bd1f306
Adjust find in page layout to fit Photon style. r=nechen

Comment 4

[Jing-wei Wu [:jwu]]

Comment on attachment 8917702 [details]
Bug 1405710 - Adjust find in page layout to fit Photon style.

Approval Request Comment
[Feature/Bug causing the regression]:
Adjust find in page layout

[User impact if declined]:
This is a visual enhancement as part of Photon related UI bug.

[Is this code covered by automated tests?]:
No

[Has the fix been verified in Nightly?]:
Not yet

[Needs manual test from QE? If yes, steps to reproduce]: 
No, we just change images and a little layout adjustment to make it be more Photon style.

[List of other uplifts needed for the feature/fix]:
None

[Is the change risky?]:
No

[Why is the change risky/not risky?]:
Only a few images changed and one layout adjustment.

[String changes made/needed]:
No

Comment 5

[Ritu Kothari (:ritu) (Inactive, please n-i to RyanVM, jcristau, or pascal)]

Comment on attachment 8917702 [details]
Bug 1405710 - Adjust find in page layout to fit Photon style.

Fennec photon, Beta57+

Comment 6

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-beta/rev/56011e0336df

Comment 7

[Sebastian Hengst [:aryx] (needinfo me if it's about an intermittent or backout)]

https://hg.mozilla.org/mozilla-central/rev/d9e77bd1f306

Comment 8

[Mark]

It looks like these changes have landed in Nightly today. Just some feedback...

I was surprised to see a black background when the rest of Photon has a light background. 

I expected the FF Android Find in Page bar to have the pale gray background of the toolbar. 

FF Desktop with Photon has a pale gray background for Find in Page to match the toolbar. Why doesn't FF Android?

(Maybe you are not done with the changes yet???)

Just some general feedback on Photon for FF Android (not a bug so feel free to ignore). I hope you can take it positively....

At the moment I think Photon is a bit patchy and does not to me look very consistent across different screens. And FF Android is still a bit janky in some places.

For example, in Activity Stream aka Top Sites the favicons are ENORMOUS about 10 mm across and nearly touch each other. Nice, very Material Design. But on Bookmarks and History the favicons are unnecessarily (IMHO) *tiny* and the text is not bold. Why is there so much empty space around the favicons in Bookmarks & History? It's not there on FF Desktop with Photon, favicons are nice and big.

And Find in Page still has black background/white icons which looks IMHO very odd compared to the Material Design look elsewhere.

Add to that some jank around the way the toolbar animates  and how the content scrolls (some of the other bugs I have filed, I can list them again if you like) and it all IMHO makes FF Android look unnecessarily dated and a bit scrappy in places.

By contrast the Chromium browsers seem to have a super slick and consistent UI and animations - though of course they have problems in other areas.

Cheers now & I hope you can take this as positive criticism. I still love FF Android, it's my go-to phone browser but I would love it even more if some of these UI loose ends got tied up. I'm sure you are working on it.

Comment 9

[Joe Cheng [:jcheng] (please needinfo)]

Thanks for the great feedback Mark.
We know 57 is not perfect but we got to where we are (and we are comfortable with where we are) by considering our resource and focus on more prominent changes. We can address it in later releases after further UX input.
Thanks for your support on Firefox for Android!

Comment 10

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

good catch! leaving this for Carol :P

Comment 11

[Mark]

Don't get me wrong, Photon is great, Photon+Quantum CSS on Mac has brought me back to FF. I hope Fennec gets that pretty & fast. Keep up the good work.

Comment 12

[Carol Huang [:Carol]]

Thanks for the feedback, Mark!
We'll keep working on it and make the visual improvement.

Comment 13

[Bogdan Surd, QA [:bsurd, NI]]

Verified in both Nightly and Beta, the buttons are now displayed with a white color and the search-box has a blue highlight.

Comment 14

[Mark]

I'm confused & a bit frustrated.

I still think that the Fennec Find in Page bar should have a white background and black icons to match the Fennec toolbar & Firefox Desktop. Anthony in Comment 10 seems to agree. That's the bug I originally filed. But Fennec Nightly still has a black background.

At least one other detail in Fennec Find in Page is still not-Photon:- the up/down arrows are solid arrows, they should be open carets ^ to match the Desktop style & the Fennec Photon bookmark folder navigation arrows.


Please either 

A - tell me that I am wrong (i.e. the current black background & funny arrows are an intentional part of Photon) and I will shut up

or 

B - leave the bug open until Find in Page has a white background, black icons, arrows like a caret ^   etc


I have attached a snapshot of the Fennec bookmark arrows (carets ^) and Photon Desktop with light background and dark arrows and caret ^ arrows.


Sorry for pedantry but I think it's worth getting this right & I think it's trivial to fix.

Comment 15

[Mark]

Attachment: Fennec Photon Bookmarks.png

Comment 16

[Mark]

Attachment: Nightly Desktop.png