Closed Bug 883898 Opened 11 years ago Closed 11 years ago

true/false values in the variables view could use some nice coloring

Categories

(DevTools :: Debugger, defect, P3)

defect

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 24

People

(Reporter: vporof, Assigned: bbenvie)

Details

Attachments

(1 file, 1 obsolete file)

At the moment true/false values are shown as gray. Just like undefined. Or null. Maybe it'd be a good idea to distinguish them.
Assignee: nobody → bbenvie
Priority: -- → P3
Assignee: bbenvie → nobody
Assignee: nobody → bbenvie
Attached patch make booleans green (obsolete) — Splinter Review
Turns out that booleans are already a separate token type with their own style. It was unfortunately styled in a gray barely discernible from null's gray. This patch changes the color to green. So we have:

* strings: #1c00cf
* numbers: #c40a16
* boolean: #282
* null: #999
* undefined: #bbb
* other: #333

Let me know if you have a better idea for the color.
Attachment #765555 - Flags: review?(vporof)
Comment on attachment 765555 [details] [diff] [review]
make booleans green

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

I think booleans should be a different color. Seeing a green "false" kinda made me feel awkward. And I don't even have synesthesia.

Let's take this opportunity to try and match the source editor's syntax highlighting for JS files (for some types of tokens) You can take the actual values from the theme css, but my eyeball sees the colors as:

* strings: green
* numbers: <keep them red; SE styles as black by default and that's not nice>
* boolean: <make them blue; SE styles as purple and that's not nice because of properties>
* null: <keep them gray because of properties>
* undefined: <ditto>
* other: <ditto because we don't care>

What do you think?
Attachment #765555 - Flags: review?(vporof)
I feel very strongly that at least one type should be chartreuse in color.
(In reply to Nick Fitzgerald [:fitzgen] from comment #3)
> I feel very strongly that at least one type should be chartreuse in color.

I tell you what, if a string contains "nick", "black eagle" or "hakuna matata" we'll make it chartreuse. But emerald is what the cool kids use these days.
We should take this discussion to http://www.reddit.com/r/chartreuse
(In reply to Nick Fitzgerald [:fitzgen] from comment #3)
> I feel very strongly that at least one type should be chartreuse in color.

I originally felt the same, but frankly after trying it I had to back off. Maybe if the background of the VariablesView was black, which I think would be totally awesome. Or maybe if the text was italic and bold.
(In reply to Victor Porof [:vp] from comment #2)
> Comment on attachment 765555 [details] [diff] [review]
> make booleans green
> 
> Review of attachment 765555 [details] [diff] [review]:
> -----------------------------------------------------------------
> 
> I think booleans should be a different color. Seeing a green "false" kinda
> made me feel awkward. And I don't even have synesthesia.
> 
> Let's take this opportunity to try and match the source editor's syntax
> highlighting for JS files (for some types of tokens) You can take the actual
> values from the theme css, but my eyeball sees the colors as:
> 
> * strings: green
> * numbers: <keep them red; SE styles as black by default and that's not nice>
> * boolean: <make them blue; SE styles as purple and that's not nice because
> of properties>
> * null: <keep them gray because of properties>
> * undefined: <ditto>
> * other: <ditto because we don't care>
> 
> What do you think?

I agree with this. I was thinking of this as well, since I'm used to strings being green from both Node.js and my editor. It seems to be a pretty common choice.
Now we have:

strings: green
booleans: blue
numbers: red
null: gray
undefined: lighter gray
other: dark gray
Attachment #765555 - Attachment is obsolete: true
Attachment #765658 - Flags: review?(vporof)
Comment on attachment 765658 [details] [diff] [review]
make strings green and booleans blue

Oops I didn't see where you said to use the specific values from the other css.
Attachment #765658 - Flags: review?(vporof)
Comment on attachment 765658 [details] [diff] [review]
make strings green and booleans blue

Ok nevermind, it uses a hideous puke green. The one from this patch is better.
Attachment #765658 - Flags: review?(vporof)
Comment on attachment 765658 [details] [diff] [review]
make strings green and booleans blue

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

Looks good.
Attachment #765658 - Flags: review?(vporof) → review+
Whiteboard: [land-in-fx-team]
https://hg.mozilla.org/integration/fx-team/rev/c94e2d611aff
Whiteboard: [land-in-fx-team] → [fixed-in-fx-team]
https://hg.mozilla.org/mozilla-central/rev/c94e2d611aff
Status: NEW → RESOLVED
Closed: 11 years ago
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 24
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: