944061 - [e.me[[bug] App name text style doesn't match homescreen

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::Everything.me, defect)

Description

[Ran Ben Aharon [:ranbena] EverythingMe]

Patryk says: The font styles and rendering doesn’t match the home screen. The fonts are far sharper and the shadows less diffused in the search screen.

He's referring to the text under e.me result icons

Comment 1

[Evyatar 'Tron' Amitay (everything.me)]

Attachment: Patch - redirect to github PR

The only difference I found was in the shadow (e.me was indeed off). I created a patch to match e.me shadow to homescreen one - please see if this resolves the issue.

To test this I took screenshots of Homescreen icons and "Music" results - and overlayed the "Music" apps from both screen on top of each other.

Comment 2

[Amir Nissim (:amirn)]

Comment on attachment 8339886 [details]
Patch - redirect to github PR

1. should we ask for UI-review on this?
2. any way for us to reuse homescreen's definitions? https://github.com/EverythingMe/gaia/blob/944061-evme-results-fonts/apps/homescreen/style/grid.css#L94-L98

Comment 3

[Evyatar 'Tron' Amitay (everything.me)]

1. We probably should - how do I flag UI review?
2. I don't think so. I could get the computed style, or the CSS rule itself, but the problem is you can't "divide" it into blur/offset/color/etc.

Comment 4

[Ran Ben Aharon [:ranbena] EverythingMe]

Comment on attachment 8339886 [details]
Patch - redirect to github PR

I pushed a few changes in parameters so it looks more similar.

this.APP_NAMES_SHADOW_BLUR = 4;
this.APP_NAMES_SHADOW_COLOR = 'rgba(0, 0, 0, 0.9)';

Comment 5

[Ran Ben Aharon [:ranbena] EverythingMe]

Comment on attachment 8339886 [details]
Patch - redirect to github PR

(Patryk I hope you have a way of testing the patch before it lands)

Comment 6

[Patryk Adamczyk [:patryk] UX]

Comment on attachment 8339886 [details]
Patch - redirect to github PR

Looks good, the shadows made the text feel softer and now it matches with the homescreen. I also find that there could be an optical illusion since more of the e.me screens are darker, so the fonts feel sharper.

Comment 7

[Evyatar 'Tron' Amitay (everything.me)]

Thanks Patryk! We actually noticed the same difference because of the darkened images in e.me search results. Anyway looks good to me too (with Ran's changes).


landed on master
8b2754f2df83055431d35ca536ea65e5a256927b

https://github.com/mozilla-b2g/gaia/commit/8b2754f2df83055431d35ca536ea65e5a256927b