998229 - Adjust In Content prefs design for Windows

Status: RESOLVED DUPLICATE of bug 1014208

(Firefox :: General, defect)

Description

[Tim Nguyen :ntim]

Here are the changes I'm suggesting :
- different font (current font has bad font smoothing on Windows)
Maybe Source Sans Pro or Open Sans

- remove the background gradient (gradients don't fit in Windows)

- Adjust buttons and inputs for Windows (currently very Mac OS inspired)

And since we want platform consistent stuff, we'll apply this on all platforms

Comment 1

[Jim Jeffery not reading bug-mail 1/2/11]

And another one: 

Page layouts for different tabs should NEVER require a scrollbar, fix layouts to fit on single page without scrollbars, there would not be that much loss of 'touch' friendly by some small minor reductions in vertical spacing and text size.

Comment 2

[Tim Nguyen :ntim]

I would suggest the styling defined in bug 962502 for inputs and buttons in addition to the tweaks defined in Comment 0 :
http://people.mozilla.org/~mmaslaney/widget_v2/firefox-html-forms.html (with more padding for those)
http://people.mozilla.org/~mmaslaney/inputs_v2/index.html

The input style defined is simple and minimalist and would fit great with all platforms.

Also, the Australis panel button style would be fine, but it requires to make the background white (otherwise, the buttons will be too dark)

Comment 3

[u428464]

I think this bug should be used as a UX design bug. 

The design based on project Chameleon could be tracked here.

Comment 4

[Michael Maslaney [:mmaslaney] ([e-mail])]

Style Guide documentation is currently in the works. Will have more details soon!

Comment 5

[u428464]

First mockups of the new style AFAIK :
http://people.mozilla.org/~mmaslaney/incontent/[e-mail]
http://people.mozilla.org/~mmaslaney/incontent/[e-mail]

Comment 6

[Tim Nguyen :ntim]

(In reply to Guillaume C. [:ge3k0s] from comment #5)
> First mockups of the new style AFAIK :
> http://people.mozilla.org/~mmaslaney/incontent/Preferences%20-%20General@2x.
> png
> http://people.mozilla.org/~mmaslaney/incontent/[e-mail]

Seems to look much better already, except for the Advanced tab style that I find a bit strange.

Comment 7

[Tim Nguyen :ntim]

The mockups in comment 5 seem enough for me to start working on this. Do you have any specification to make before I start ?

Comment 8

[Tim Nguyen :ntim]

Attachment: Part 1 - General flattening (page, category, buttons and textboxes)

This is the first part to make it match the design.

The checkbox/radio styling will be addressed in my next patch.

And the rest will be addressed in a final patch.

Comment 9

[Tim Nguyen :ntim]

Attachment: Screenshot of part 1

What do you think ? 

You can try the patch if you want a preview of the hover and active states.

Again, the first part doesn't change much styling.

Comment 10

[Michael Maslaney [:mmaslaney] ([e-mail])]

Comment on attachment 8420687 [details]
Screenshot of part 1

Tim, can you remove the glow and shadows from the radio and checkmark buttons?

BTW: The style guide is in the works and I should have something to show in the coming weeks. I'll keep you posted.

Comment 11

[Michael Maslaney [:mmaslaney] ([e-mail])]

(In reply to Tim Nguyen [:ntim] from comment #6)
> (In reply to Guillaume C. [:ge3k0s] from comment #5)
> > First mockups of the new style AFAIK :
> > http://people.mozilla.org/~mmaslaney/incontent/Preferences%20-%20General@2x.
> > png
> > http://people.mozilla.org/~mmaslaney/incontent/[e-mail]
> 
> Seems to look much better already, except for the Advanced tab style that I
> find a bit strange.

Still working out the local nav style. These are not complete.