897917 - HD: white rectangle in focused bookmark tab

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia::Browser, defect)

Description

[[e-mail]]

Attachment: device-2013-07-25-174939.png

click awesomebar, switch between tabs, you can see white rectangle in focused bookmark tab

Comment 1

[[e-mail]]

The cause might be: the tab background color is not the same as apps/browser/style/images/tab-background.png

@amy please help provide the correct tab-background.png

Comment 2

[Amy Lee [:amylee] UX]

Attachment: [e-mail]

Hi, 

We are not scaling textures/gradients so please use the attached image (this is @1 scale that has been renamed to @1.5) Thanks

Comment 3

[Wayne Chang [:wchang]]

HD+ asset bug.

Comment 4

[[e-mail]]

we could just remove 1.5x if scaled resource is not necessary.

will fix at bug 897916

Comment 5

[William Hsu [:whsu]]

I still can reproduce this bug on the following build.
* Test build:(Mozilla-b2g18_v1_1_0_hd-helix/2013-08-12-04-22-03)
  + Mercurial-Information
    - Gecko revision="afd50da34b9f"
  + Git-information
    - Gaia revision="134356dc21d0627455f8bc536b140a18f39e20e9"

Comment 7

[Eric Pang [:epang] UX]

Hi, what's needed to fix this bug?  Please need info Amy if any graphics are needed!

Comment 8

[Amy Lee [:amylee] UX]

Attachment: Browser-Tabs.png

Hi, 

Just wanted to point out 2 other things I noticed about the tabs. Not sure if this is already a known issue. The blue highlight states are off centered and blue overlay peeks out from behind the tab when pressed. I've highlighted the 2 issues in the attached screenshot. 

Thanks

Comment 9

[[e-mail]]

spot the issue, reopen to fix it

Comment 10

[[e-mail]]

Hi amy, I found the [e-mail] color is not the same as origin tab-background.png, so does tab-left.png/tab-right.png

And the [e-mail] color is not the same as [e-mail]/[e-mail], too.

Please provide new images, thanks.

Comment 11

[Amy Lee [:amylee] UX]

Attachment: browser_tabs.zip

Hi, 

Attached are the 3 pieces of the tab @1.5 (tab left/tab right and tab background). Let me know if these work. 

Thanks

Comment 12

[Amy Lee [:amylee] UX]

Hi Fred, 

Please hold off. I will be sending another set of graphics for you.

Comment 13

[Amy Lee [:amylee] UX]

Hi Fred, 

Sorry please disregard my last message. Can you please go forward and use the images provided. Let me know if those work for you.

Thanks

Comment 14

[[e-mail]]

Attachment: screenshot 8/23

@amy, here's the after patch screenshot, is it ok?

Comment 15

[Amy Lee [:amylee] UX]

Hi Fred, 

The background colour should match the tab colour. Can you fix this? Let me know if you need new graphics.

Comment 16

[[e-mail]]

Hi Amy,

[e-mail] color is not the same as origin tab-background.png color, that's why the background color not match the tab color.

If there's no particular reason I think it might be better to align tab images color in different density?

Comment 17

[Amy Lee [:amylee] UX]

Hi Eric, 

Thought I would get your input on this. I pulled the tab graphic from "Firefox_Browser_tabs.psd" in Box but this doesn't match the current background of the browser so you see a difference in colour between the tab and the background. Should the tab colours be altered to match or change the current background colour in the browser? (refer to comment 14 for screenshot).

Thanks

Comment 18

[Amy Lee [:amylee] UX]

(In reply to Fred Lin [:gasolin] from comment #16)
> Hi Amy,
> 
> [e-mail] color is not the same as origin tab-background.png
> color, that's why the background color not match the tab color.
> 
> If there's no particular reason I think it might be better to align tab
> images color in different density?

Hi Fred, 

Can you attach the graphic you are using for the browser background? I just want to make sure the tab colours match it. Thanks

Comment 19

[[e-mail]]

we use #f3f4f8 as the background color of browser background

Comment 20

[Amy Lee [:amylee] UX]

Attachment: Browser Tabs.zip

Hi, 

Attached are the colour corrected tabs. Let me know if these work for you.

Comment 21

[[e-mail]]

Attachment: screenshot 8/27

Hi Amy,

Thanks for new images. It fixed the rectangle issue, but the left/right tab background seems not match the default tab background color (#CCD6DF).

Comment 22

[Amy Lee [:amylee] UX]

Attachment: Browser_Tabs_v2.zip

Hi Fred, 

Are you using the most up to date graphics? I just pieced together the graphics that I sent to you into the screenshot and the colours match on my end. I've attached the graphics again. Thanks

Comment 23

[Amy Lee [:amylee] UX]

Attachment: Screenshot_tab.png

I put together the graphics into the screenshot for comparison (see left tab).

Comment 24

[[e-mail]]

Attachment: tab_color.zip

Amy, 

I've attach the current 1x, 2x images in master repository. I found the color is slightly different between new 1.5x image and other images.

Comment 25

[Amy Lee [:amylee] UX]

Attachment: Browser_Tabs_v3.zip

Hi Fred, 

Attached are the revised tabs. The colours have been corrected.

Cheers

Comment 26

[[e-mail]]

Attachment: screenshot 8/28

looks good now

Comment 27

[[e-mail]]

Attachment: pull_request.html

Comment 28

[Amy Lee [:amylee] UX]

Thanks Fred!

Comment 29

[Ben Francis [:benfrancis]]

Comment on attachment 796144 [details]
pull_request.html

I don't have a hamachi to test this on but the code change is just an image swap so I can r+

Comment 30

[Ben Francis [:benfrancis]]

Merged into master, needs uplift to HD https://github.com/gasolin/gaia/commit/6738fe44192830e58854f6361dd81839181c8701

Comment 31

[[e-mail]]

uplift to v1.1.0hd d961078ae698ec426d11d95de94ae1bf5bd04934

thanks!

Comment 32

[Naoki Hirata :nhirata (please use needinfo instead of cc)]

Verified : gaia fc7063cb9485096e7ad1c615f0f428793ace5f19 
8/28/2013

Comment 33

[William Hsu [:whsu]]

Thank you!

Verified it on following build. Attaching screenshot.

Test Build:
- PVT Build: Mozilla-b2g18_v1_1_0_hd-helix/2013-09-03-04-22-01
- Gecko revision="dc78e5642c44"
- Gaia revision="d3e3d1e29dc52f038a6cb69a91b57d6cc2622955"
- Gecko version: 26.0a1

Comment 34

[William Hsu [:whsu]]

Attachment: Browser app - white rectangle