{"_id":"@flourish/js2css","_rev":"73-d7a418e3019daf4b3407d49e1f3da3bb","name":"@flourish/js2css","dist-tags":{"latest":"1.0.0"},"versions":{"0.0.1":{"name":"@flourish/js2css","version":"0.0.1","author":{"name":"Kiln Enterprises Ltd"},"license":"UNLICENSED","_id":"@flourish/js2css@0.0.1","maintainers":[{"name":"larsvers","email":"lars@datamake.io"},{"name":"animateddata","email":"hello@animateddata.co.uk"},{"name":"keriley","email":"katie@kiln.it"},{"name":"mark-kiln","email":"mark@kiln.it"},{"name":"robinhouston","email":"robin@kiln.digital"},{"name":"duncanclark","email":"duncan@kiln.digital"},{"name":"daanlouter","email":"daan.louter@gmail.com"},{"name":"annaps","email":"anna@anna.ps"},{"name":"timbrock","email":"info@datatodisplay.com"},{"name":"hughsk","email":"hughskennedy@gmail.com"}],"homepage":"https://github.com/kiln/flourish-js2css#readme","bugs":{"url":"https://github.com/kiln/flourish-js2css/issues"},"dist":{"shasum":"88ec3efabf0bd0a391bb349b7806dedb9581913f","tarball":"https://registry.npmjs.org/@flourish/js2css/-/js2css-0.0.1.tgz","fileCount":4,"integrity":"sha512-Hq1xxVshTE7CbP9vR5M9nz1ulFfq65GqQdKIOKJcBRD5LfXEZK1XD3nzKg5Ky4fYG6MFCTmqe07OvP/WseXP2A==","signatures":[{"sig":"MEUCIA12NSMZF0FXKNnpYxsdHKrm/H8DDLyQa/s+Zd9DYaNAAiEAvlC7If8REIwUNGZNZ6ncARwIoYGS9uqdf1PDTyinWYI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":4318,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd55lYCRA9TVsSAnZWagAAkj8P/1Jh5K3wtm3mzhL/tMXa\nuzz7ysnwgOvULgJUeR2AKiCgBgfaX+O0kjV2ACq8mU9xGTRT/8e68FD5+Rxa\n0B9j68MUXo+TR3OLs6auDe1PojRkPDmjIYZz+Hx4AK1bgKeJ2XmtHRnwbNm1\nM4v0x+MRESJc6Tg0nDFN85Y+s0agtgIGHoqcRiskuDrLlsC6gTetR39E0oIm\n6rDZ4Zy3vos2Q4TEskx7nUpxvY+tl+/8lw0PyJLSV2dN+b0wSkNS4bIxWIPs\nSxEEplS/9OmpKJgmdvHjfsGB26oATyL3q1SYALv1F4ce4Wp44d+RkICU2Nz/\n16Yf+egoGM5ZFiBt8JUCtmv9TSo3YVJTIV0HnO4TU8QTkNRpjGTuYNwAWqHr\nQ3JPH2gr64PPBQIcobXCIrqq3X1bs652vJQTtT+O7DLTR0M5QZm1InZI5aeH\nQ+F44btI633Bu0Im7IYkIQYAnPwuNzC5mlqMiT9dMqXi5OUg6HCrdgFtGHBG\nUAhc2Sg7R3C0U7iI5o+uCdK7ZAgEKoj4Q4woB1O2g+BKdrWY1VwPG1MKyVfV\nh6MfzR/Z3qNEJyA4jiy/Qjt+cU5GGO1rNRjRjRT0F17tcna/OdTsADFAZf6S\nR1z/lwjvXbUVCxuMj/icqGWM1bl53KNun8PQatg5nfRIDeL70PBpgbXJ6cXa\n23I3\r\n=3P7H\r\n-----END PGP SIGNATURE-----\r\n"},"main":"js2css.js","module":"src/index.js","gitHead":"062fc0b0cea19e7fcc7fafc58d63d93b48308971","scripts":{"lint":"eslint src","build":"rollup -c","minify":"uglifyjs -m -o js2css.min.js js2css.js","prepare":"npm run build && npm run minify","precommit":"lint-staged"},"_npmUser":{"name":"daanlouter","email":"daan.louter@gmail.com"},"repository":{"url":"git://github.com/kiln/flourish-js2css.git","type":"git"},"_npmVersion":"6.4.1","description":"Flourish module to convert js inline styles to stylesheet","directories":{},"lint-staged":{"*.js":"eslint src"},"_nodeVersion":"8.16.0","_hasShrinkwrap":false,"devDependencies":{"husky":"^1.3.1","eslint":"^5.13.0","rollup":"^1.1.2","uglify-js":"^3.4.9","lint-staged":"^8.1.3","rollup-plugin-node-resolve":"^4.0.0","@flourish/eslint-plugin-flourish":"^0.7.2"},"_npmOperationalInternal":{"tmp":"tmp/js2css_0.0.1_1575459160448_0.3893070385451691","host":"s3://npm-registry-packages"}},"1.0.0":{"name":"@flourish/js2css","version":"1.0.0","author":{"name":"Kiln Enterprises Ltd"},"license":"UNLICENSED","_id":"@flourish/js2css@1.0.0","maintainers":[{"name":"animateddata","email":"hello@animateddata.co.uk"},{"name":"annaps","email":"anna@anna.ps"},{"name":"daanlouter","email":"daan.louter@gmail.com"},{"name":"duncanclark","email":"duncan@kiln.digital"},{"name":"hughsk","email":"hughskennedy@gmail.com"},{"name":"keriley","email":"katie@kiln.it"},{"name":"larsvers","email":"lars@datamake.io"},{"name":"mark-kiln","email":"mark@kiln.it"},{"name":"robinhouston","email":"robin@kiln.digital"},{"name":"timbrock","email":"info@datatodisplay.com"}],"homepage":"https://github.com/kiln/flourish-js2css#readme","bugs":{"url":"https://github.com/kiln/flourish-js2css/issues"},"dist":{"shasum":"648588b29ed3e85edc5d34f4aeb22f8f5eaa7121","tarball":"https://registry.npmjs.org/@flourish/js2css/-/js2css-1.0.0.tgz","fileCount":5,"integrity":"sha512-iIxsFoIz8nYmlH/5IiX62D/Jr2VsIEvoTsh43T64GMiVaAOPGg9sYqQSFhHW+Uv2nNwnIXjcA14oI2EP5tSyFQ==","signatures":[{"sig":"MEYCIQDvtWw1sL5n9CGGop34Sa7tMmei1V8WpPwOcbaX2sQ7WwIhAM9+D9x+Fs3zdZ3lhVG0mUc4MiIA2SxVFtUGrRXgak8c","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":5552,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+QGFCRA9TVsSAnZWagAATdAP/2L39hcDQMMcyMUGLS6a\nFJxla88+zjtPW/jqerlkTw7YJD2ci43mwx94KjXBJzD+hhNooT5QiNEB4rRh\nsm2QWxYPeKtgBlqMIlvMSJ1osrZFWoYSbdT9rJwM+My9fkOE57PSALJGRCjj\n5hMQiKcfu2c9PKzd8e8jnAuRwhZdqQ5SODwbdDfl3/p9EtNSYi/vipkjFky1\n/W5ElzomEcl1OaIkolZav7loBzyVZdwyyGfqE+QY3bd+AqN9OUVk4d7VrJaV\nbafnZIDhc4vKSRyMp2Z7GpYcwm1cKWSCcGZaHxn0mc/ATvTTwDR3XedWBIQW\nQsQPU7aAUhiECDp0x+V6hISWC41mxvPmmQ54VrAZrhptqAYdeQwtub68i9rX\nXnHG7MbmylYMheUaDfxsRISd47qaHUq2bZl6Dx3nkHa8i8VR5PP7PAkj9rY4\nCjPG46tMbueW9ZxXZb8MY9dzdab6nIcD4PDOzYQFPMiVTkxRlbmxJ/S+KIOL\nJCpkLA3KWRiUNgL6iot6NbbUurgCa7ImCC9Wg2wsHHpMtlN6Z/ul+Rb1iYc+\nMKX5HYU1bcNFdDP1WZ/nHsA/+DEgkRG1G3SZSnwpgLF1Sk4V2A9u0ir/iMrN\nXSv0qvE26Lk/WPmA7RUGFjugNpQvaMYhKPm1h6GEi1+qH+m/A/W5P59cr/zx\nv6b8\r\n=NhBL\r\n-----END PGP SIGNATURE-----\r\n"},"main":"js2css.js","module":"src/index.js","gitHead":"9ac7a270fac7fa7c94ffd88056ae9bd9a0a45f8a","scripts":{"lint":"eslint src","build":"rollup -c","minify":"uglifyjs -m -o js2css.min.js js2css.js","prepare":"npm run build && npm run minify","precommit":"lint-staged"},"_npmUser":{"name":"daanlouter","email":"daan.louter@gmail.com"},"repository":{"url":"git://github.com/kiln/flourish-js2css.git","type":"git"},"_npmVersion":"6.4.1","description":"Flourish module to convert js inline styles to stylesheet","directories":{},"lint-staged":{"*.js":"eslint src"},"_nodeVersion":"8.16.0","_hasShrinkwrap":false,"devDependencies":{"husky":"^1.3.1","eslint":"^5.13.0","rollup":"^1.1.2","uglify-js":"^3.4.9","lint-staged":"^8.1.3","rollup-plugin-node-resolve":"^4.0.0","@flourish/eslint-plugin-flourish":"^0.7.2"},"_npmOperationalInternal":{"tmp":"tmp/js2css_1.0.0_1576599941284_0.16999739288671756","host":"s3://npm-registry-packages"}}},"time":{"created":"2019-12-04T11:32:40.448Z","modified":"2026-08-19T18:13:27.176Z","0.0.1":"2019-12-04T11:32:40.595Z","1.0.0":"2019-12-17T16:25:41.672Z"},"bugs":{"url":"https://github.com/kiln/flourish-js2css/issues"},"author":{"name":"Kiln Enterprises Ltd"},"license":"UNLICENSED","homepage":"https://github.com/kiln/flourish-js2css#readme","repository":{"url":"git://github.com/kiln/flourish-js2css.git","type":"git"},"description":"Flourish module to convert js inline styles to stylesheet","maintainers":[{"email":"duncan@kiln.digital","name":"duncanclark"},{"email":"daan.louter@gmail.com","name":"daanlouter"},{"email":"hello@animateddata.co.uk","name":"animateddata"},{"email":"lars@datamake.io","name":"larsvers"},{"email":"luisabider@hotmail.com","name":"luptilu"},{"email":"h.robertson@icloud.com","name":"hrobertson"},{"email":"florin@kiln.digital","name":"florin.oprina"},{"email":"ben.lloyd@canva.com","name":"b3n-canva"},{"email":"brunoriddy@canva.com","name":"bruno-riddy"},{"email":"katietanner@canva.com","name":"katietannercanva"},{"email":"josephw@canva.com","name":"jwitcombe"},{"email":"becky.rush14@yahoo.co.uk","name":"rushlet"},{"email":"winna@canva.com","name":"winna_canva"},{"email":"jonty@canva.com","name":"jontyt"},{"email":"scottb@canva.com","name":"scottb-flourish"},{"email":"gwyneth@canva.com","name":"gwyneth.bassett"},{"email":"snavad@canva.com","name":"sega-canva"},{"email":"ci@kiln.it","name":"kiln-ci"},{"email":"niamhb@canva.com","name":"niamhb"},{"email":"guy.n@canva.com","name":"guyneedhamcanva"}],"readme":"### JS » CSS\n\nWrite CSS with D3-style selection syntax.\n\n```javascript\nselect(\"h1\")\n\t.style(\"color\", \"red\")\n\t.style(\"font-size\", \"1.25rem\");\n\n//\th1 {\n//\t\tcolor: red;\n//\t\tfont-size: 1.25rem;\n//\t}\n```\n\n## How to use\n\nInstall js2css with NPM `npm install -s @flourish/js2css`.\n\nImport and initialise js2css in your project, and create styles.\n\n```javascript\nimport Stylesheet from \"@flourish/js2css\";\n\nvar styles = new Stylesheet();\n\nstyles.select(\"h1\") // h1 {...}\n\t.style(\"color\", \"red\")\n\t.style(\"font-size\", \"1.2rem\")\n\t.style(\"font-weight\", \"bold\")\n\t.style(\"display\", function() {\n\t\treturn window.innerWidth < 400 ? \"none\" : null\n\t})\n\t.select(\"span\") // h1 span {...}\n\t.style(\"font-weight\", \"normal\");\n\ndocument.head.querySelector(\"#my_style_container\").innerHTML = styles.print(); // Add styles to <style> tag in head\n\nstyles.clear(); // Clear the styles\n```\n\n## Functions\n\n`select(selector)`\n\nCreate new CSS selection. Select can be called directly on the js2css object, or on an existing declaration to create nested CSS selection.\n\n`style(style_attribute, value)`\n\nCreate new style for current selection. The value can be a string, number or a function.\n\n`print()`\n\nReturns the parsed CSS string\n\n`clear()`\n\nClears the CSS string","readmeFilename":"README.md"}