Skip to content
This repository was archived by the owner on Apr 19, 2024. It is now read-only.

Tomorrow themes: improve HTML and XML highlighting#14

Open
itiut wants to merge 1 commit intomicrosoft:mainfrom
itiut:tomorrow-theme-improve-html-xml
Open

Tomorrow themes: improve HTML and XML highlighting#14
itiut wants to merge 1 commit intomicrosoft:mainfrom
itiut:tomorrow-theme-improve-html-xml

Conversation

@itiut
Copy link

@itiut itiut commented Dec 7, 2016

This adds some improvements for HTML and XML highlighting and minor changes for CSS highlighting.

First, this fixes HTML and XML highlighting where all the tags became red, and introduces new highlighting colors referring to Base16 Tomorrow theme:

  • symbols (<, >, /, =): default foreground color
  • id attribute: blue
  • other attributes: orange

And, this adds some changes in CSS highlighting colors:

  • ID selectors: red -> blue
  • class selectors: red -> orange
    • These two are the result of the new HTML attribute colors.
  • element selectors: purple -> red
    • It's intended to make consistent with the red color of HTML tag names.

Screenshots of Tomorrow Night

Before

tomorrow-night-before

After

tomorrow-night-after

New highlighting colors in HTML and XML:

- symbols (`<`, `>`, `/`, `=`): default foreground color
- ID attribute: blue
- other attributes: orange

Highlighting color changes in CSS:

- ID selectors: red -> blue
- class selectors: red -> orange
- element selectors: purple -> red
@noinkling
Copy link

noinkling commented Dec 12, 2016

Just to chip in: Interestingly if you go to http://colorsublime.com/?q=tomorrow, click on "Preview" for Tomorrow Night (or any of the Tomorrow family), and click on HTML, you can see it also looks quite different to the wall of red you get in VS Code, presumably due to differences in syntax definition/grammar.

Additionally, in Sublime it looks like this:
image
which still isn't great, but better than VS Code.

For some extra perspective, Atom comes with the Base16 version of Tomorrow (light & dark), which @itiut linked above. You can already get this in VS Code through the "Base16 Themes" extension, which would be great, however there are notable differences to how it appears in Atom, for example white quotes around attribute values in HTML. Or using a snippet of JS as an example...

VS Code:
image
(notice white quotes)

Atom:
image

The standard Tomorrow Night in VS Code is slightly different again from both these examples - in my opinion slightly nicer - which is why I'm +1 on this PR, because to me that's kinda the best of both worlds (though still far from perfect, e.g. interpolated strings). But it also means effectively creating a fork of the themes, and maybe some of this stuff could better be fixed by improving the syntax definitions or attempting to contribute changes upstream.

But whatever happens, the standard Tomorrow themes really aren't suitable for editing HTML in VS Code as they stand, which is really unfortunate, a sentiment echoed in the reviews on the marketplace.

@aeschli
Copy link

aeschli commented Dec 12, 2016

We might want to wait to see how the latest vscode-textmate fixes impact the rendering of this theme. Instead of matching the theme scopes to a flattened list of grammar scopes, we then correctly match against the scope hierarchy. This will fix many outstanding issues of coloring differences between vscode and other editors.

Base automatically changed from master to main February 19, 2021 16:52
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants