659457 - Update Gingerbread UI for Preferences/Downloads/Addons and Context Menu

Status: VERIFIED FIXED

(Firefox for Android Graveyard :: General, defect)

Description

[Ian Barlow (:ibarlow)]

Now that we have a solid first cut of our Gingerbread UI, we should go in and detail some of the other areas like Preferences and the Context Menu. Some mocks below for reference:

http://www.flickr.com/photos/61892693@N03/5726890128/in/set-72157626609900587

http://www.flickr.com/photos/61892693@N03/5726333477/in/set-72157626609900587

http://www.flickr.com/photos/61892693@N03/5726890284/in/set-72157626609900587

Comment 1

[Ian Barlow (:ibarlow)]

Attachment: Assets for Preferences

Included here are a dropdown button, radio buttons, and an "update addons" button!

Also, here is where we ended up with the Add-ons page update (which will change a bit once we have a discopane) http://www.cl.ly/190c2G3y3Q411M3A3E18

Comment 2

[Mark Finkle (:mfinkle) (use needinfo?)]

Attachment: patch

This patch adds nearly all CSS based changes we can make, including:
* Use black background (white text) for all richlistbox
* Uses a radio image and not the check image for popup menulist selection
* Uses a checkbox, not a toggle in prefs and about:config
* Aligned images and text to top of larry (bug 659447)
* Changed the prefs and add-ons header colors (text / background)

New files:
* gingerbread/forms.css (copied and edited from core theme)
* radio selected/unselected PNGs
* content.css and gingerbread/content.css (moved and tweaked from chrome/content/content.css)

Replaced files:
* lock and unlocked PNGs used in larry (bug 659447)
* tab background assets (bug 659447)
* close button assets (bug 659447)

Non-CSS changes:
* Makes the popup list for menulist selection popup 80% of window width instead of only wide enough. It was too cramped. This affects all themes.

Comment 3

[Matt Brubeck (:mbrubeck)]

Comment on attachment 535478 [details] [diff] [review]
patch

Review of attachment 535478 [details] [diff] [review]:
-----------------------------------------------------------------

Comment 4

[Matt Brubeck (:mbrubeck)]

I noticed one problem while testing this - checkboxes move by a pixel or two when you click them, and don't move back until they are unfocused.

Comment 5

[Mark Finkle (:mfinkle) (use needinfo?)]

(In reply to comment #4)
> I noticed one problem while testing this - checkboxes move by a pixel or two
> when you click them, and don't move back until they are unfocused.

Thanks. Fixed it locally by using a transparent border on focus for the checkbox label, which we don't use but is still "there". The original patch removed the border, causing the "shift".

Comment 6

[Mark Finkle (:mfinkle) (use needinfo?)]

Comment on attachment 535478 [details] [diff] [review]
patch

low-risk, android only, been baking on trunk for a while and vastly improves the gingerbread theme

Comment 7

[Mark Finkle (:mfinkle) (use needinfo?)]

forgot to note this:
http://hg.mozilla.org/mozilla-central/rev/113014cf801a

Comment 8

[Mark Finkle (:mfinkle) (use needinfo?)]

http://hg.mozilla.org/releases/mozilla-aurora/rev/45794d6ffc6f

Comment 9

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

Verified

Mozilla/5.0 (Android; Linux armv71; rv6.0a2) Gecko/20110623 Firefox/6.0a2 Fennec/6.0a2
Device: HTC Flyer
OS: Android 2.3