transform icons to SVGs

.eslintignore

@@ -0,0 +1 @@
+node_modules/**

.eslintrc

@@ -0,0 +1,17 @@
+{
+  "ignorePatterns": ["file-types/", "node_modules/"],
+  "plugins": ["@typescript-eslint", "prettier"],
+  "extends": [
+    "plugin:@typescript-eslint/recommended",
+    "prettier",
+    "prettier/@typescript-eslint"
+  ],
+  "rules": {
+    "no-console": ["warn"],
+    "prettier/prettier": ["error"],
+    "object-shorthand": ["error", "always"],
+    "eol-last": ["error", "always"],
+    "@typescript-eslint/explicit-function-return-type": "off",
+    "@typescript-eslint/no-non-null-assertion": "off"
+  }
+}

.gitignore

@@ -1,4 +1,7 @@
 .DS_Store
 npm-debug.log
 node_modules
+icons/
+!src/icons
+lib/
 styles/user-theme.less

.npmignore

@@ -0,0 +1,8 @@
+.DS_Store
+npm-debug.log
+node_modules
+src/
+scripts/
+types/
+file-types/
+styles/user-theme.less

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "printWidth": 100,
+  "singleQuote": true,
+  "semi": false,
+  "trailingComma": "none"
+}

README.md

@@ -4,7 +4,7 @@
 [![Gratipay Team](https://img.shields.io/gratipay/team/atom-seti-ui.svg?style=flat-square)](https://gratipay.com/Atom-Seti-UI/)
 
 ### Seti-UI Theme, and VS Code icon pack
- 
+
 This repo contains the latest version of the Seti UI theme. It's a dark interface theme crafted especially for [Atom](http://atom.io), with subtle colors that are meant to be easy on the eyes. It includes custom file icons, and new user configurable settings. [Seti Syntax](https://atom.io/themes/seti-syntax) is also available for all your codez.
 
 The icons in this repo are used as the defaults in the file explorer in VS Code also.
@@ -122,60 +122,51 @@ Once you're done working locally and ready to install the production version aga
 
 Given that changes to this repo are included in VS Code, we are somewhat conservative with adding new file icons because it can affect the performence for everyone. This means we only accept PRs for file icons for popular languages or toolsets. For example does your langauge/tool have package downloads or vscode extensions with thousands of users? If no, then there's a possibility we will deny your pull request.
 
-Adding an icon requires you have [node](https://nodejs.org/en/) and [gulp](https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md) installed.
-
-Once you have these, you will need to open a terminal window, navigate to the _seti-ui_ folder and run `npm install` (note you only need to do this once).
-
-Icon Style:
+Adding an icon requires you have [node](https://nodejs.org/en/) installed. Once you have it, you will need to open a terminal window, navigate to the _seti-ui_ folder and run `npm install` (note you only need to do this once).
 
- - Use a single color, the colors will be overwritten to one of the 9 below when shipped
- - You want to aim for a frame of 32x32 with the icon centered at and being about 18 x 18 big. There's a sketch file with examples in [this repo](./svgs.sketch).
+All of the icon's colors will be automatically converted to their closest equivalents on the supported color list. This process uses a very simple mathematical algorithm for determining what's "closest", and might not match what you subjectively feel to be appropriate. That's why if you don't like what the build script generates, choose the colors yourself.
 
 Once everything is setup, follow these steps any time you want to add a new icon:
 
-  1. Create an SVG icon with the name of the language, and save it to the `icons` folder _(do not use any spaces or special characters)_
+  1. Create an SVG icon with the name of the language, and save it to the `src/icons` folder _(do not use any spaces or special characters)_
 
-  2. Open [styles/components/icons/mapping.less](styles/components/icons/mapping.less) and create a link for the icon you just added with the `.icon-set` mixin. Assuming you were adding an icon for Sass it might look something like this: ```.icon-set('.scss', 'sass', @pink)```
+  2. Open [styles/components/icons/mapping.less](styles/components/icons/mapping.less) and create a link for the icon you just added with the `.icon-ext` mixin. Assuming you were adding an icon for Sass it might look something like this: ```.icon-ext('.scss', 'sass', 'pink')```
 
-  The first parameter `'.scss'` is the file extension you want to target, the second parameter `'sass'` is the name of the icon you just created, without the extension (sass.svg), and the last parameter `@pink` indicated what color the icon should be.
+  The first parameter `'.scss'` is the file extension you want to target, the second parameter `'sass'` is the name of the icon you just created, without the extension (sass.svg), and the last parameter `pink` indicated what color the icon should be.
 
   There are currently 9 supported icon colors:
-  
-    - `@blue`
-    - `@grey`
-    - `@green`
-    - `@orange`
-    - `@pink`
-    - `@purple`
-    - `@red`
-    - `@white`
-    - `@yellow`
+
+    - `blue`
+    - `grey`
+    - `green`
+    - `orange`
+    - `pink`
+    - `purple`
+    - `red`
+    - `white`
+    - `yellow`
 
   While, you _can_ add additional colors to [styles/ui-variables.less](styles/ui-variables.less), but please do not do this unless you find it _absolutely_ necessary. If you do add another color, please make sure that matches the general feel of the other colors. If you add something really bright or really pale, your pull request will likely be declined.
 
   You will need to do this once for every extension, you want to target. For example, if you want to target both **.sass** and **.scss** extensions, you would add the following:
 
   ```
-  .icon-set('.sass', 'sass', @pink);
-  .icon-set('.scss', 'sass', @pink);
+  .icon-set('.sass', 'sass', 'pink');
+  .icon-set('.scss', 'sass', 'pink');
   ```
 
-  3. Run `gulp svg` to minimize the svg files.
+  1. Run `npm run build:svg` to minimize the svg files.
 
 ## Previewing in VS Code
 
 This is a bit of work, but the steps:
 
-1. Make your changes, and run `gulp icon`
+1. Make your changes, and run `npm run build:svg`
 1. Clone VS Code, and make sure that it has the same parent as seti-ui
 1. Follow the [VS Code instructions](https://github.com/Microsoft/vscode/wiki/How-to-Contribute#build-and-run) to set up a local dev copy
-1. Once you've confirmed that, you need to update the icons. cd to `extensions/theme-seti` and run `node build/update-icon-theme.js`
-1. Make sure that inside `extensions/theme-seti/build/update-icon-theme.js` - `let FROM_DISK` is set to true
-
-Then, you can make you SVG changes, re-run `gulp icon`, `node build/update-icon-theme.js` and re-launch your dev copy of VS Code.
-
-Please don't include the built files in your Pull Requests, because it can cause conflicts between PRs and we only need to do this during deploys otherwise.
+2. Once you've confirmed that, you need to update the icons, run `npm run vs-theme`
 
+Then, you can make you SVG changes, re-run `npm run build:svg`, `npm run vs-theme` and re-launch your dev copy of VS Code.
 ## Deploying
 
 Run `npm publish`

file-types/.prettierignore

@@ -0,0 +1,37 @@
+---
+env:
+  browser: true
+  node: true
+  jquery: true
+globals:
+  ENV: true
+extends: standard
+plugins:
+- standard
+rules:
+  indent:
+  - error
+  - 2
+  - SwitchCase: 1
+    VariableDeclarator:
+      var: 2
+      let: 2
+      const: 3
+  key-spacing: 'off'
+  eol-last: 'off'
+  prefer-template: 'warn'
+  no-multi-spaces: 'off'
+  no-multiple-empty-lines: 'off'
+  no-path-concat: 'off'
+  no-unused-vars: error
+  one-var:
+  - warn
+  - always
+  padded-blocks: 'off'
+  quotes:
+  - error
+  - single
+  semi:
+  - 2
+  - always
+  space-before-function-paren: 'off'

file-types/.prettierrc

@@ -0,0 +1,37 @@
+---
+env:
+  browser: true
+  node: true
+  jquery: true
+globals:
+  ENV: true
+extends: standard
+plugins:
+- standard
+rules:
+  indent:
+  - error
+  - 2
+  - SwitchCase: 1
+    VariableDeclarator:
+      var: 2
+      let: 2
+      const: 3
+  key-spacing: 'off'
+  eol-last: 'off'
+  prefer-template: 'warn'
+  no-multi-spaces: 'off'
+  no-multiple-empty-lines: 'off'
+  no-path-concat: 'off'
+  no-unused-vars: error
+  one-var:
+  - warn
+  - always
+  padded-blocks: 'off'
+  quotes:
+  - error
+  - single
+  semi:
+  - 2
+  - always
+  space-before-function-paren: 'off'