├── .npmignore
├── docs
├── icon.png
├── Icon.js
└── index.html
├── README.md
├── bin
└── objectify-css.js
└── package.json
/.npmignore:
--------------------------------------------------------------------------------
1 | docs
2 |
--------------------------------------------------------------------------------
/docs/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/lachlanjc/objectify-css/HEAD/docs/icon.png
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # objectify-css
2 |
3 | CLI for converting CSS rules to JavaScript style objects
4 |
5 | Uses CSS on clipboard and writes back to clipboard
6 |
7 | ```sh
8 | npm i -g objectify-css
9 | objectify-css
10 | ```
11 |
12 | MIT License
13 |
14 | ___
15 | *Another thing by [@lachlanjc](https://twitter.com/lachlanjc).*
16 |
--------------------------------------------------------------------------------
/bin/objectify-css.js:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env node
2 |
3 | const cssToObject = require('css-to-object')
4 | const stringifyObject = require('stringify-object')
5 | const clipboardy = require('clipboardy')
6 |
7 | const input = clipboardy.readSync()
8 | const css = cssToObject(input)
9 | const style = stringifyObject(css, { indent: ' ' })
10 |
11 | clipboardy.writeSync(style)
12 | console.log(style)
13 |
--------------------------------------------------------------------------------
/docs/Icon.js:
--------------------------------------------------------------------------------
1 | const { createElement: h } = require('react')
2 |
3 | const width = 512
4 | const widthIcon = 0.75 * width
5 | const padding = 0.125 * width
6 |
7 | module.exports = props =>
8 | h(
9 | 'div',
10 | {
11 | style: {
12 | boxSizing: 'border-box',
13 | margin: 0,
14 | padding,
15 | width,
16 | height: width,
17 | backgroundColor: '#f30',
18 | backgroundImage: 'linear-gradient(60deg, #f30, #f0c)'
19 | }
20 | },
21 | h('img', {
22 | src: 'https://icon.now.sh/tonality/ffffff',
23 | style: { width: widthIcon }
24 | })
25 | )
26 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "objectify-css",
3 | "version": "1.0.0",
4 | "description": "CLI for converting CSS rules to JavaScript style objects",
5 | "bin": {
6 | "objectify-css": "bin/objectify-css.js"
7 | },
8 | "scripts": {
9 | "icon": "repng docs/Icon.js -w 512 -h 512 --out-dir docs --filename icon"
10 | },
11 | "keywords": [
12 | "css",
13 | "css-in-js",
14 | "cli"
15 | ],
16 | "author": "Lachlan Campbell",
17 | "license": "MIT",
18 | "dependencies": {
19 | "clipboardy": "^1.1.2",
20 | "css-to-object": "^1.0.0",
21 | "meow": "^3.7.0",
22 | "stringify-object": "^3.2.0"
23 | },
24 | "devDependencies": {
25 | "react": "^15.5.4",
26 | "repng": "^2.0.0-alpha.1"
27 | }
28 | }
29 |
--------------------------------------------------------------------------------
/docs/index.html:
--------------------------------------------------------------------------------
1 |
2 | objectify-css
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
25 |
26 |
27 | objectify-css
28 | CLI for converting CSS rules to JavaScript style objects
29 | Uses CSS on clipboard and writes back to clipboard
30 | npm i -g objectify-css
31 | objectify-css
32 |
38 |
39 |
--------------------------------------------------------------------------------