feat(styles): one stylesheet source for react and svelte (#3350)

* feat(styles): create stylesheets for react and svelte based on one source

* refactor(styling): cleanup

* refactor(postcss): share a config

* refactor(postcss): replace env hack with env file

tooling/postcss-config/postcss.config.js

@@ -1,8 +1,23 @@
-module.exports = {
-  plugins: [
-    require('postcss-import'),
-    require('postcss-nested'),
-    require('postcss-combine-duplicated-selectors'),
-    require('autoprefixer'),
-  ],
+require('dotenv').config();
+
+const postcssImport = require('postcss-import');
+const postcssNested = require('postcss-nested');
+const postcssCombine = require('postcss-combine-duplicated-selectors');
+const postcssRename = require('postcss-rename');
+const autoprefixer = require('autoprefixer');
+const cssnano = require('cssnano');
+
+module.exports = (ctx) => {
+  return {
+    plugins: [
+      postcssImport,
+      postcssNested,
+      postcssCombine,
+      postcssRename({
+        strategy: (className) => className.replace('xy', process.env.LIB),
+      }),
+      autoprefixer,
+      ctx.env === 'production' && cssnano,
+    ],
+  };
 };