Init client

.gitignore

@@ -32,8 +32,8 @@ venv.bak/
 dmypy.json
 
 # Frontend
-client/node_modules/
+fluidcontrol/client/node_modules/
-client/build/
+fluidcontrol/client/build/
 
 # Visual Studio Code
 .vscode

fluidcontrol/client/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "fluidcontrol-client",
+  "version": "1.0.0",
+  "description": "",
+  "private": true,
+  "main": "index.js",
+  "scripts": {
+    "build": "rollup --config rollup.config.js",
+    "watch": "rollup --config rollup.config.js --watch"
+  },
+  "keywords": [],
+  "author": "Evan Walsh <evan@hellowelcome.org>",
+  "license": "AGPL-3.0",
+  "browserslist": [
+    "> 0.5%",
+    "last 2 versions",
+    "Firefox ESR",
+    "not dead"
+  ],
+  "devDependencies": {
+    "postcss": "^7.0.24",
+    "postcss-import": "^12.0.1",
+    "postcss-preset-env": "^6.7.0",
+    "rollup": "^1.27.9",
+    "rollup-plugin-commonjs": "^10.1.0",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-postcss": "^2.0.3",
+    "rollup-plugin-svelte": "^5.1.1",
+    "tailwindcss": "^1.1.4"
+  },
+  "dependencies": {
+    "svelte": "^3.16.7"
+  }
+}

fluidcontrol/client/rollup.config.js

@@ -0,0 +1,54 @@
+import commonjs from 'rollup-plugin-commonjs'
+import nodeResolve from 'rollup-plugin-node-resolve'
+import postcss from 'rollup-plugin-postcss'
+import svelte from 'rollup-plugin-svelte'
+
+// PostCSS plugins
+import atImport from 'postcss-import'
+import presetEnv from 'postcss-preset-env'
+import tailwind from 'tailwindcss'
+
+const isProduction = process.env.NODE_ENV === 'production'
+
+export default {
+  input: 'src/main.js',
+  output: {
+    dir: 'build',
+    format: 'iife'
+  },
+  plugins: [
+    nodeResolve(),
+    commonjs({
+      include: 'node_modules/**'
+    }),
+    svelte({
+      emitCss: true
+    }),
+    postcss({
+      extract: true,
+      minimize: isProduction,
+      plugins: [
+        atImport(),
+        tailwind({
+          theme: {
+            container: {
+              center: true,
+              padding: '1rem'
+            },
+            screens: {
+              sm: '640px',
+              md: '768px',
+              lg: '1024px',
+              xl: '1280px',
+              dark: {'raw': '(prefers-color-scheme: dark)'},
+              light: {'raw': '(prefers-color-scheme: light)'}
+            }
+          }
+        }),
+        presetEnv({
+          stage: 1
+        })
+      ]
+    })
+  ]
+}