Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kcmr/color-your-code

A visual editor for Visual Studio Code themes made with Web Components
https://github.com/kcmr/color-your-code

polymer-3 themes visual-studio-code web-components

Last synced: 2 months ago
JSON representation

A visual editor for Visual Studio Code themes made with Web Components

Host: GitHub
URL: https://github.com/kcmr/color-your-code
Owner: kcmr
Created: 2018-03-27T00:05:56.000Z (over 6 years ago)
Default Branch: master
Last Pushed: 2022-12-08T09:22:34.000Z (almost 2 years ago)
Last Synced: 2024-04-17T05:27:05.671Z (6 months ago)
Topics: polymer-3, themes, visual-studio-code, web-components
Language: JavaScript
Homepage: https://color-your-code.firebaseapp.com/
Size: 2.8 MB
Stars: 4
Watchers: 2
Forks: 0
Open Issues: 18
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Color Your Code

[![Build Status](https://img.shields.io/travis/kcmr/color-your-code/master.svg)](https://travis-ci.org/kcmr/color-your-code) 

[![codecov](https://codecov.io/gh/kcmr/color-your-code/branch/master/graph/badge.svg)](https://codecov.io/gh/kcmr/color-your-code)

> A visual editor for Visual Studio Code themes

[![Color Your Code](images/color-your-code-preview-large.png)](https://color-your-code.firebaseapp.com/)

[Color Your Code](https://color-your-code.firebaseapp.com/) aims to make customizing VSCode themes easier through a native color picker that lets you change the color of the selected area of the editor. It works better in Chrome and OS X due to the inconsistent behavior across browsers and operating systems of the native ``. 

For now, only workbench customizations are allowed (not token colors).

## Development

- Install dependencies without altering `package-lock.json` contents:

  ```

  npm ci

  ```

- Launch the app:

  ```

  npm start

  ```

- Create a new element or test file (the command will prompt you for the file type):

  ```

  npm run create:element

  ```

- Run the tests with coverage output:

  ```

  npm test

  ```

- Run the tests in the browser (all components):

  - Go to http://localhost:3000/test

  

- Run the tests of a single component:

  - Go to http://localhost:3000/test/index.html?only=[test-file-name.html]