by Jeremy Banka, Adrian Camacho, Sammai Gutierrez, and Maxwell Meyer
- 📄 HTML5
- 💅 SASS ➡️ CSS3
▶️ ES6 🛠 Airbnb ESLint (thanks to VS Code ext. ESLint by Dirk Baeumer)- 💲 jquery 3.6.0
- ❓ jest 26.6.3
- 📦 Webpack 5 for bundling
- 👨🏻🎨 Adobe Illustrator (comps/planning)
🅰️ Fonts and Icons by Jeremy Banka
This is an online tool to create VS Code themes. To use it, you'll have to have vsce installed.
- See your changes live as you make them.
- When you're done, click "Export".
- Copy the output text into two files in the same folder called
package.json
and*****-color-theme.json
where*****
is the name you picked but inlower-kebab-case
. - Run
$ vsce package
in this folder. Say 'y' if it asks you anything. - Right click the
vsix
file and click "Install Extension VSIX" - Then, go to your Extensions tab, find your newly-installed theme, and Set Color Theme. Remember to click it again when it previews.
- If there's an error at this point, it's probably because your theme filename is slightly off.
- Clone this repo:
$ git clone https://github.com/jeremybanka/vscode-theme-designer
- Get things installed:
$ npm i
- Get things built:
$ npm run start
- This should prompt your browser to open the project on 8080. It's actually pointed at the dist folder, and will update live.
- Use VS Code.
- Install VS Code extension "ESLint" by Dirk Baeumer.
- Install VS Code extension "Prettier"
- Ensure that your VS Code settings.json has the following properties set:
"editor.formatOnSave": true, "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.codeActionsOnSave": { "source.fixAll.eslint": true }
- Now, my meticulously selected formatting preferences will be applied to files in this repo any time you hit save!
- none identified
This software is licensed under GPL 3.0.
adriancamacho18 at gmail dot com
hello at jeremybanka dot com
maxreadswell at gmail dot com
sammaigutierrez at gmail dot com