Closed Bug 578994 Opened 14 years ago Closed 14 years ago

Use colorblind-safe colors for red, orange and green

Categories

(Tree Management Graveyard :: TBPL, defect)

defect
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: mfinkle, Assigned: justin.lebar+bug)

Details

Attachments

(1 file)

I find it almost impossible to see the difference in the colors used to denote pass (green), test-fail (orange) and build-fail (red)

Suggestions:
Green: 339900 (grass green)
http://www.toledo-bend.com/colorblind/GreenChart.asp

Orange: FF6600 (orange)
http://www.toledo-bend.com/colorblind/OrangeChart.asp

Red: 990000 (brick red)
http://www.toledo-bend.com/colorblind/RedChart.asp
Mark, do you think it would be worth also using typography to differentiate the greens, oranges, and reds?  I could imagine greens as regular text, oranges as bold, and reds as bold italic.
(In reply to comment #1)
> Mark, do you think it would be worth also using typography to differentiate the
> greens, oranges, and reds?  I could imagine greens as regular text, oranges as
> bold, and reds as bold italic.

That might help too, but I didn't want to change any typography (or layout) in this bug
Brick red (#990000) looks brown, almost black to me (I have full-color sight).  Does #FF0000 have enough contrast?
OS: Mac OS X → All
Hardware: x86 → All
Attached patch Patch v1Splinter Review
mfinkle, what do you think of these colors?  You can see them in context at

  http://people.mozilla.org/~jlebar/tinderboxpushlog/
Attachment #461699 - Flags: feedback?(mark.finkle)
(In reply to comment #4)
> Created attachment 461699 [details] [diff] [review]
> Patch v1
> 
> mfinkle, what do you think of these colors?

Looks much better to me. The green vs. orange is much easier to see. I still have trouble with the red but it's improved.

I'm fine with these colors, thanks
Attachment #461699 - Flags: review?(mstange)
Attachment #461699 - Flags: feedback?(mark.finkle)
Attachment #461699 - Flags: feedback+
Comment on attachment 461699 [details] [diff] [review]
Patch v1

>diff --git a/css/style.css b/css/style.css

>-#status a.testfailed {
>-  background-color: #F90 !important;
>-}
>-#status a.busted {
>-  background-color: #D00 !important;
>-}

Don't just remove this, it's used for the "N Jobs are failing:" squares in the top right corner.
Thanks for fixing this! I'll deploy it when you've pushed.
Attachment #461699 - Flags: review?(mstange) → review+
(In reply to comment #6)
> Don't just remove this, it's used for the "N Jobs are failing:" squares in the
> top right corner.

Oh, oops.  I thought I could get rid of them because the boxes have the .machintest.{testfailed,busted} class.  But that only gives them a color, not a background-color.  I'll update their colors to match the other boxes.

I need to update the color of starredbox.png to match the new green, and then I'll push.
http://hg.mozilla.org/users/mstange_themasta.com/tinderboxpushlog/rev/dedfbb521fe2
Status: NEW → RESOLVED
Closed: 14 years ago
Resolution: --- → FIXED
Assignee: nobody → justin.lebar+bug
Product: Webtools → Tree Management
Product: Tree Management → Tree Management Graveyard
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: