build: build style assets with postcss

.stylelintrc

@@ -0,0 +1,3 @@
+{
+  "extends": ["stylelint-config-standard", "stylelint-prettier/recommended"]
+}

commitlint.config.js

@@ -1 +1 @@
-module.exports = {extends: ['@commitlint/config-conventional']}
+module.exports = { extends: ['@commitlint/config-conventional'] }

package.json

@@ -9,10 +9,12 @@
     "clean": "rm -rf coverage dist",
     "build:scripts": "rollup --config",
     "build:styles": "node-sass --output-style compressed --include-path styles -o dist/ styles/",
+    "build:css": "postcss styles/littlefoot.css --output dist/littlefoot.next.css",
     "build:types": "tsc --declaration --emitDeclarationOnly --declarationDir dist",
     "build": "yarn clean && mkdir -p dist && concurrently 'yarn build:types' 'yarn build:scripts' 'yarn build:styles'",
     "watch:scripts": "rollup --config --watch",
     "watch:styles": "node-sass --watch --output-style compressed --include-path styles -o dist/ styles/",
+    "watch:css": "yarn build:css --watch",
     "format": "prettier --write '{cypress,src,test}/**/*.{js,jsx,ts,tsx,json,css,md}'",
     "lint": "eslint '{cypress,src,test}/**/*.ts'",
     "pretest": "yarn lint",
@@ -54,6 +56,9 @@
   "module": "dist/littlefoot.mjs",
   "typings": "dist/index.d.ts",
   "style": "dist/littlefoot.css",
+  "browserslist": [
+    "defaults"
+  ],
   "devDependencies": {
     "@commitlint/cli": "11.0.0",
     "@commitlint/config-conventional": "11.0.0",
@@ -73,6 +78,7 @@
     "@typescript-eslint/parser": "4.6.0",
     "codecov": "3.8.0",
     "concurrently": "5.3.0",
+    "cssnano": "^4.1.10",
     "cypress": "5.4.0",
     "cypress-axe": "0.8.1",
     "cz-conventional-changelog": "3.3.0",
@@ -89,10 +95,18 @@
     "jest": "26.6.1",
     "lint-staged": "10.5.0",
     "node-sass": "4.14.1",
+    "pixrem": "^5.0.0",
+    "postcss": "^8.1.4",
+    "postcss-cli": "^8.1.0",
+    "postcss-preset-env": "^6.7.0",
     "prettier": "2.1.2",
     "rollup": "2.32.1",
     "rollup-plugin-terser": "7.0.2",
     "standard-version": "9.0.0",
+    "stylelint": "^13.7.2",
+    "stylelint-config-prettier": "^8.0.2",
+    "stylelint-config-standard": "^20.0.0",
+    "stylelint-prettier": "^1.1.2",
     "ts-jest": "26.4.2",
     "tslib": "2.0.3",
     "typescript": "4.0.3"

postcss.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  plugins: {
+    stylelint: {},
+    'postcss-preset-env': {
+      stage: 1,
+    },
+    pixrem: {},
+    cssnano: {},
+  },
+}

test/core.test.ts

@@ -8,11 +8,9 @@ function testSettings(
   overrides?: Partial<CoreSettings<Test>>
 ): CoreSettings<Test> {
   return {
-    activateCallback: () => undefined,
     activateDelay: 0,
     activateOnHover: false,
     allowMultiple: false,
-    dismissCallback: () => undefined,
     dismissDelay: 0,
     dismissOnUnhover: false,
     hoverDelay: 0,