Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve VS Code dark theme #28

Merged
merged 5 commits into from
Apr 23, 2019
Merged

Improve VS Code dark theme #28

merged 5 commits into from
Apr 23, 2019

Conversation

karlhorky
Copy link
Contributor

Building on @kutyel's #7, I've consolidated the VS Code Dark and VS Code Dark Plus themes and improved on them.

It seems that some tokens are incorrectly being marked as plain (such as CSS declaration values), meaning that I cannot style them.

@kutyel, can I ask why you created two themes (Dark and Dark+) instead of just sticking with the best version of one? I've consolidated them into one file in this PR.

Demo: https://codesandbox.io/s/5x1mmwn9nx

JSX

Before:

jsx-before

After:

jsx-after

Real VS Code:

jsx-real-vs-code

JS

Before:

js-before

After:

js-after

Real VS Code:

js-real-vs-code

CSS

Before:

css-before

After:

css-after

Real VS Code:

css-real-vs-code

@karlhorky
Copy link
Contributor Author

Oops looks like that screwed up the HTML tags, fixed some things in 9d45fb5.

Before

screen shot 2019-03-03 at 20 00 21

After

screen shot 2019-03-03 at 20 00 36

@karlhorky
Copy link
Contributor Author

karlhorky commented Mar 3, 2019

Also punctuation. Not ideal for the = and " tokens, but with the current tokenization we can't do much better than that. And the darker gray makes the tags and attributes stand out more visually.

Before

screen shot 2019-03-03 at 20 12 56

After

screen shot 2019-03-03 at 20 12 47

Copy link
Contributor

@kutyel kutyel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, I only exported the default settings from vscode into this files, but it's true that it is far from perfect 😉 thanks for your improvements!

@karlhorky
Copy link
Contributor Author

@kitten @kutyel I did an additional refinement of the original "VS Code Dark Plus" Prisma.js theme today, in case that is also applicable here (not sure if all the tokens are available in prisma-react-renderer yet!)

PrismJS/prism-themes#103

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants