Adding support for LitElement (#28)

Co-authored-by: Jeremy Thomas <bbxdesign@gmail.com>

README.md

@@ -22,6 +22,13 @@ npm install minireset.css
 
 Or clone the repo.
 
+## Options
+It will be available in your modules directory in `/node_modules/minireset.css/`:
+* `minireset.css`: CSS rules
+* `minireset.min.css`: minified CSS rules (recommended for production sites)
+* `minireet.sass`: CSS rules written in SASS (recommended for SCSS/SASS projects)
+* `minireset.css.lit.js`: CSS rules exported as a `CSSResult` object for [LitElement](https://lit-element.polymer-project.org/) projects (recommended for Web Component projects based on LitElement)
+
 ## CDN
 
 [GitHub CDN for minireset.min.css](https://cdn.jsdelivr.net/gh/jgthms/minireset.css@master/minireset.min.css)

minireset.css.lit.js

@@ -0,0 +1,5 @@
+import { css } from 'lit-element';
+
+var minireset_min = css`/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}`;
+
+export { minireset_min as minireset };

package.json

@@ -1,12 +1,13 @@
 {
   "name": "minireset.css",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "A tiny modern CSS reset",
   "main": "minireset.css",
   "scripts": {
-    "build": "npm run build-sass && npm run build-min-sass",
+    "build": "npm run build-sass && npm run build-min-sass && npm run build-lit-js",
     "build-sass": "node-sass --output-style expanded minireset.sass minireset.css",
     "build-min-sass": "node-sass --output-style compressed minireset.sass minireset.min.css",
+    "build-lit-js": "rollup --config",
     "docs": "node-sass --output-style compressed docs/docs.sass docs/docs.css",
     "start": "npm run docs -- --watch"
   },
@@ -27,11 +28,14 @@
   },
   "homepage": "https://github.com/jgthms/minireset.css#readme",
   "devDependencies": {
-    "node-sass": "^4.12.0"
+    "node-sass": "^4.12.0",
+    "rollup": "^2.7.6",
+    "rollup-plugin-lit-css": "^2.0.3"
   },
   "files": [
     "minireset.css",
     "minireset.min.css",
+    "minireset.css.lit.js",
     "minireset.sass"
   ]
 }

rollup.config.js

@@ -0,0 +1,12 @@
+import litcss from 'rollup-plugin-lit-css'
+
+export default {
+  input: 'src/minireset.css.js',
+  plugins: [
+    litcss({ uglify: true })
+  ],
+  output: {
+    file: 'minireset.css.lit.js',
+    format: 'es'
+  }
+}

src/minireset.css.js

@@ -0,0 +1 @@
+export { default as minireset } from '../minireset.min.css'