https://github.com/jamesummec/optimized-dracula-theme
Optimized dracula theme vscode extension for flutter, web, electron and golang development.
https://github.com/jamesummec/optimized-dracula-theme
dart dracula-theme electron flutter golang less scss ts vscode-theme vue webapp
Last synced: 5 months ago
JSON representation
Optimized dracula theme vscode extension for flutter, web, electron and golang development.
- Host: GitHub
- URL: https://github.com/jamesummec/optimized-dracula-theme
- Owner: JamesUmmec
- License: mit
- Created: 2022-06-09T06:24:00.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-06-21T13:51:15.000Z (almost 4 years ago)
- Last Synced: 2023-09-14T03:26:21.507Z (over 2 years ago)
- Topics: dart, dracula-theme, electron, flutter, golang, less, scss, ts, vscode-theme, vue, webapp
- Language: TypeScript
- Homepage:
- Size: 58.6 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: license.txt
Awesome Lists containing this project
README
# Optimized Dracula Theme
A color theme inspired by dracula color theme.
This color theme is not based on dracula color theme.
The color styles are similar with dracula color theme
but all highlighting configurations are redesigned.
All color configs are designed for a better looking in details.
This color theme extension is aimed to provide a better dev experience.
It cannot support all those commonly used languages,
but once it supports a language,
this color theme will help you to be more comfortable and productive.
The project is still under development.
There's a special version for `vue` development,
if you are develop with `vue` framework,
you can consider using `Optimized Dracula Theme (vue)`.
## Supported languages and frameworks.
Some of the languages or frameworks requires some extensions for code parsing.
Without those extensions, the code highlighting theme will not work normally.
Support status of the languages are listed as follows.
| lang | basic | comment doc | special | require extension |
| -------- | :---: | :---------: | :-----: | --------------------- |
| dart | ✔ | ✔ | ✔ | `Dart-Code.dart-code` |
| go | ✔ | --- | ✔ | `golang.go` |
| ts/js | ✔ | ✔ | ✔ | --- |
| rust | ❌ | ❌ | ❌ | --- |
| c/cpp | ❌ | ❌ | ❌ | --- |
| c# | ❌ | ❌ | ❌ | --- |
| swift | ❌ | ❌ | ❌ | --- |
| python | ❌ | ❌ | ❌ | --- |
| java | ❌ | ❌ | ❌ | --- |
| html | ✔ | --- | --- | --- |
| vue | ✔ | ✔ | ✔ | `Vue.volar` |
| react | ❌ | --- | ❌ | --- |
| css | ✔ | --- | --- | --- |
| scss | ✔ | --- | ✔ | --- |
| sass | ❌ | --- | ❌ | --- |
| less | ✔ | --- | ✔ | --- |
| json | ✔ | --- | --- | --- |
| jsonc | ✔ | --- | --- | --- |
| yaml | ✔ | --- | --- | --- |
| markdown | ✔ | --- | ✔ | --- |
- `basic` means basic keywords, class/type, method/function highlighting.
- `comment doc` means highlighting of variables in documentation comment.
- `special` means special optimization for the language,
such as readonly variables in `ts`/`js`,
namespace in `ts`, and property names in `dart`.
- `required extension` means the highlighting might not be normal
without those extensions.
> Comment documentation for golang is not supported
> by vscode `golang.go` extension yet.
> If comment doc of golang is necessary for your project,
> please consider [Goland](https://www.jetbrains.com/go/)
> by [JetBrains](https://www.jetbrains.com/).
> Or if you find an available golang comment doc extension,
> please notice the developer on
> [Github Issues](https://github.com/JamesUmmec/optimized-dracula-theme/issues).
## Cancel italic style of comments.
If you do not like italic style comments,
just add those code into your `.vscode/settings.json` config file.
```jsonc
{
// Use workspace config to cancel comments italic style.
"editor.tokenColorCustomizations": {
"[Optimized Dracula Theme]": {
"textMateRules": [
{
"scope": ["comment.line", "comment.block"],
"settings": {
"fontStyle": ""
}
}
]
}
}
}
```
## Related recommendations.
This extension only config color themes.
The following recommendations can provide a better dev experience
along with this color theme.
### Font family recommendations.
This extension uses [Iosevka](https://typeof.net/Iosevka/)
as the default font face for debug.
CJK users can consider [Sarasa Mono](https://picaq.github.io/sarasa/),
which is based on [Iosevka](https://typeof.net/Iosevka/).
### Icon theme recommendations.
`JonathanHarty.gruvbox-material-icon-theme`.
### Config recommendations.
You can add those code into your `.vscode/settings.json` file.
```jsonc
{
// Workbench basic configs.
"workbench.iconTheme": "gruvbox-material-icon-theme",
"editor.bracketPairColorization.enabled": false,
// Font size configs.
"editor.lineHeight": 1.5,
"editor.fontSize": 15,
"editor.fontLigatures": true,
// Minimap configs.
"editor.minimap.enabled": true,
"editor.minimap.maxColumn": 80,
"editor.minimap.scale": 2,
"editor.minimap.size": "proportional",
"editor.minimap.renderCharacters": false,
"editor.minimap.showSlider": "always",
// workbench display configuration
"workbench.tree.indent": 18,
"workbench.tree.renderIndentGuides": "always",
"workbench.tree.expandMode": "doubleClick"
}
```
## Developers read.
This repo requires `vsce` **globally** installed,
or the npm scripts will not be available.
See [vsce npm homepage](https://www.npmjs.com/package/vsce).