1070657 - Simplify input[type=range] non-native styling

Status: RESOLVED FIXED

(Core :: CSS Parsing and Computation, defect)

Description

[Tim Nguyen :ntim]

We should simplify the input[type=range] pseudo elements styling for these reasons :
- Less override needed by web authors
- Prettier styling

Here's the changes I'm suggesting :
- Replace the background-image on ::-moz-range-thumb with a simple background-color color
- Remove the border on ::-moz-range-track

Comment 1

[Tim Nguyen :ntim]

Attachment: Patch v1

Comment 2

[Tim Nguyen :ntim]

I should have before-after screens after I build Firefox today (gonna take me ~2 hours)

Comment 3

[Daniel Holbert [:dholbert]]

Comment on attachment 8492770 [details] [diff] [review]
Patch v1

I'll defer to jwatt on this review, since he designed this control, and has thought more about its non-native styling than I have. :)

Comment 4

[Jonathan Watt [:jwatt]]

(In reply to Tim Nguyen [:ntim] from comment #2)
> I should have before-after screens after I build Firefox today (gonna take
> me ~2 hours)

Tim, were you going to attach those screenshots?

Comment 5

[Tim Nguyen :ntim]

Attachment: Comparison screenshot

Here you go :)

Comment 6

[Jonathan Watt [:jwatt]]

Comment on attachment 8492770 [details] [diff] [review]
Patch v1

r+ if you strengthen the border of the thumb. It is too light/thin, I think.

Comment 7

[Jonathan Watt [:jwatt]]

(I already thought the existing styling of the thumb was a bit faint on a white background for people with poor vision.)

Comment 8

[Tim Nguyen :ntim]

Attachment: Thumb darker border

Thanks for the review ! 

Does this look better ?

Comment 9

[Jonathan Watt [:jwatt]]

Comment on attachment 8493904 [details]
Thumb darker border

That's probably just about good enough. Thanks.

Comment 10

[Tim Nguyen :ntim]

Attachment: Patch v1.1

With color changes.

Comment 11

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/integration/mozilla-inbound/rev/ab4ead5f6317

Comment 12

[Daniel Holbert [:dholbert]]

(looks like "r=dholbert" stuck around in the commit message for the final patch version -- should've been "r=jwatt".

I don't particularly mind, since the patch *does* have r+, and anyone who's curious about the changeset will end up here and see the correct reviewer anyway.  But do keep that in your mental checklist when addressing review comments & reuploading patches in the future.)

Comment 13

[Tim Nguyen :ntim]

(In reply to Daniel Holbert [:dholbert] from comment #12)
> (looks like "r=dholbert" stuck around in the commit message for the final
> patch version -- should've been "r=jwatt".
> 
> I don't particularly mind, since the patch *does* have r+, and anyone who's
> curious about the changeset will end up here and see the correct reviewer
> anyway.  But do keep that in your mental checklist when addressing review
> comments & reuploading patches in the future.)

Ah, sorry, completely forgot I put dholbert here. I'll keep this in mind next time :)

Comment 14

[Ryan VanderMeulen [:RyanVM]]

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