Bug 519950 - [Dark Theme] Improve Dark Theme so it works well with Menlo Font on Mac
Summary: [Dark Theme] Improve Dark Theme so it works well with Menlo Font on Mac
Status: RESOLVED FIXED
Alias: None
Product: JDT
Classification: Eclipse Project
Component: UI (show other bugs)
Version: 4.8   Edit
Hardware: PC Mac OS X
: P3 normal (vote)
Target Milestone: 4.8 M2   Edit
Assignee: Matthias Becker CLA
QA Contact: Noopur Gupta CLA
URL:
Whiteboard:
Keywords: noteworthy
Depends on: 516551
Blocks:
  Show dependency tree
 
Reported: 2017-07-20 08:54 EDT by Till Brychcy CLA
Modified: 2020-07-30 02:51 EDT (History)
6 users (show)

See Also:


Attachments
Java Syntax Coloring with my fix (347.28 KB, image/png)
2017-07-20 09:20 EDT, Matthias Becker CLA
no flags Details
Java Syntax Coloring with Till's proposed changes (186.32 KB, image/png)
2017-07-24 14:26 EDT, Till Brychcy CLA
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Till Brychcy CLA 2017-07-20 08:54:39 EDT
Copied from bug 516551 comment 13 :

(In reply to Till Brychcy from comment #13)
>[...]
> Everything that is bold is more difficult to read in this font in the dark
> design.
> 
> Maybe this should be reconsidered - or maybe you should update the dark
> design so it works better with this font?
> 

Also see attached screen shots on bug 516551.
Comment 1 Matthias Becker CLA 2017-07-20 09:16:56 EDT
This is a JDT issue. Can someone pls. assign it to JDT UI?
Comment 2 Eclipse Genie CLA 2017-07-20 09:19:53 EDT
New Gerrit change created: https://git.eclipse.org/r/101644
Comment 3 Matthias Becker CLA 2017-07-20 09:20:31 EDT
Created attachment 269461 [details]
Java Syntax Coloring with my fix
Comment 4 Matthias Becker CLA 2017-07-20 09:21:50 EDT
With my fix the bold font face is used in the dark theme at the same places as it is used in the light theme.
Comment 5 Lars Vogel CLA 2017-07-20 09:23:48 EDT
I contributed the original dark styling to JDT. Change is fine for me, if Till agrees to it.
Comment 6 Eclipse Genie CLA 2017-07-24 14:18:38 EDT
New Gerrit change created: https://git.eclipse.org/r/101860
Comment 7 Till Brychcy CLA 2017-07-24 14:26:58 EDT
Created attachment 269512 [details]
Java Syntax Coloring with Till's proposed changes
Comment 8 Till Brychcy CLA 2017-07-24 14:27:22 EDT
(In reply to Matthias Becker from comment #4)
> With my fix the bold font face is used in the dark theme at the same places
> as it is used in the light theme.

(In reply to Lars Vogel from comment #5)
> I contributed the original dark styling to JDT. Change is fine for me, if
> Till agrees to it.

It is already more readable, but I have some improvement suggestions:
1) I think bold shouldn't be used for the keywords either. Bold looks good in the light theme, but it leads to blurryness with the black background.
2) Some colors are too close the keyword-color, and the keyword-color doesn't really match the style of the other colors. I suggest the following changes:
- Slightly increase the saturation of the keywords color
- Use grey for annotations. They are anyway detectable as annotations because of their '@'-prefix.
- Use yellow (light for usage, saturated for declaration) for local variables.
- Use purple for the type arguments

See screenshot and the patch in https://git.eclipse.org/r/#/c/101860/ 

(I have created a fresh patch because I'm not a jdt.ui commiter, so I could not push an update to the existing patch. If this is ok for you, please update accordingly your patch instead)

WDYT?
Comment 9 Matthias Becker CLA 2017-07-25 01:42:06 EDT
(In reply to Till Brychcy from comment #8)
> 1) I think bold shouldn't be used for the keywords either. Bold looks good
> in the light theme, but it leads to blurryness with the black background.
I don't see this blurriness. But it's ok for me.
> 2) Some colors are too close the keyword-color, and the keyword-color
> doesn't really match the style of the other colors. I suggest the following
> changes:
> - Slightly increase the saturation of the keywords color
I like this.
> - Use grey for annotations. They are anyway detectable as annotations
> because of their '@'-prefix.
Good idea.
> - Use yellow (light for usage, saturated for declaration) for local
> variables.
Yes, the old color was to close to the "keyword" color.
> - Use purple for the type arguments
ok
> (I have created a fresh patch because I'm not a jdt.ui commiter, so I could
> not push an update to the existing patch. If this is ok for you, please
> update accordingly your patch instead)
I am not a JDT committer either. But I will update my change accordingly.
 
> WDYT?
I like your changes.
Comment 10 Matthias Becker CLA 2017-07-25 01:59:46 EDT
(In reply to Till Brychcy from comment #8)
> (I have created a fresh patch because I'm not a jdt.ui commiter, so I could
> not push an update to the existing patch. If this is ok for you, please
> update accordingly your patch instead)

I just uploaded patchset 2 that includes Till's changes.
Comment 11 Till Brychcy CLA 2017-07-27 02:31:08 EDT
(In reply to Matthias Becker from comment #10)
> (In reply to Till Brychcy from comment #8)
> > (I have created a fresh patch because I'm not a jdt.ui commiter, so I could
> > not push an update to the existing patch. If this is ok for you, please
> > update accordingly your patch instead)
> 
> I just uploaded patchset 2 that includes Till's changes.

@Lars, are these changes ok for you?
Comment 12 Lars Vogel CLA 2017-07-27 02:52:41 EDT
@Till, I asked David in the Gerrit to do a review. He is a 100% dark theme user under Linux.
Comment 13 Matthias Becker CLA 2017-08-03 05:56:11 EDT
(In reply to Lars Vogel from comment #12)
> @Till, I asked David in the Gerrit to do a review. He is a 100% dark theme
> user under Linux.

David left some comment in Gerrit. Till, can you have a look at them and proceed with this issue?
Comment 14 Till Brychcy CLA 2017-08-03 07:23:00 EDT
https://bugs.eclipse.org/bugs/show_bug.cgi?id=519950

(Moving the discussion from gerrit to here)

David Weiser wrote for Patch Set 2:
>I like the usage of regular font style. I also like that the colors for e.g. >variable declaration are not that similar to the keyword color anymore. But I >think the yellow for local variable usage does not differ enough from white.

Hmm they do look different from white to me and anyway the only other white things in methods are operators, braces and package names (which are very rare).

But this may be a matter of the screen (and maybe the configured gamma), so let's try to improve it a bit.

What do you think of 243,236,121 (RGB) = Hex F3EC79?

Or do you have a suggestion? I think the design criteria should be:
- Local variable usages should have a color that is obviously a variation of the color of the declarations (but be different enough, so you can quickly find the declarations)
- The color should feel related to the other colors. (hard to describe)
Comment 15 David Weiser CLA 2017-08-07 10:09:05 EDT
The color you suggested looks a bit better on my screen. Also next to the green color of a method call. I would suggest to use this instead of the current one.
Comment 16 Till Brychcy CLA 2017-08-08 15:33:22 EDT
(In reply to Till Brychcy from comment #14)
> What do you think of 243,236,121 (RGB) = Hex F3EC79?

(In reply to David Weiser from comment #15)
> The color you suggested looks a bit better on my screen. Also next to the
> green color of a method call. I would suggest to use this instead of the
> current one.

@Matthias, can you please update the patch with that color?

semanticHighlighting.localVariable.color=243,236,121
Comment 17 Matthias Becker CLA 2017-08-09 09:48:16 EDT
(In reply to Till Brychcy from comment #16)
> @Matthias, can you please update the patch with that color?
> 
> semanticHighlighting.localVariable.color=243,236,121
Done.
Comment 18 Till Brychcy CLA 2017-08-11 07:39:56 EDT
(In reply to Matthias Becker from comment #17)
> (In reply to Till Brychcy from comment #16)
> > @Matthias, can you please update the patch with that color?
> > 
> > semanticHighlighting.localVariable.color=243,236,121
> Done.

Thanks.

@Noopur, do you know any other dark theme users whom we should ask for an opinion (esp. someone who uses Windows)?

Or, if you don't think that is necessary, can you please commit it?
Comment 19 Noopur Gupta CLA 2017-08-11 07:46:15 EDT
(In reply to Till Brychcy from comment #18)
> @Noopur, do you know any other dark theme users whom we should ask for an
> opinion (esp. someone who uses Windows)?

Adding Manoj who uses dark theme on Windows.

Manoj, please provide your feedback.
Comment 21 Noopur Gupta CLA 2017-09-06 15:13:47 EDT
Thanks, everyone! I have released the change so that we can get the feedback from other users.
Comment 22 Lars Vogel CLA 2017-09-06 17:00:29 EDT
Please add to the N&N m2
Comment 23 Matthias Becker CLA 2017-09-07 03:21:42 EDT
(In reply to Lars Vogel from comment #22)
> Please add to the N&N m2

@Till: Can you write the N&N entry as you did the most work on the colors?
Comment 24 Eclipse Genie CLA 2017-09-10 15:23:51 EDT
New Gerrit change created: https://git.eclipse.org/r/104811
Comment 26 Till Brychcy CLA 2017-09-10 15:35:57 EDT
(In reply to Matthias Becker from comment #23)
> (In reply to Lars Vogel from comment #22)
> > Please add to the N&N m2
> 
> @Till: Can you write the N&N entry as you did the most work on the colors?

Done.

(In reply to Eclipse Genie from comment #24)
> New Gerrit change created: https://git.eclipse.org/r/104811