postcss and scripts

devenv.nix

@@ -13,7 +13,6 @@
   packages = [
     pkgs.openssl
     pkgs.nodejs
-    pkgs.nodePackages.tailwindcss
   ];
 
   # https://devenv.sh/languages/
@@ -35,7 +34,6 @@
   # https://devenv.sh/processes/
   processes = {
     surreal_db.exec = "docker run --rm --pull always -p 8000:8000 --net=host --user $(id -u) -v $(pwd)/database:/database surrealdb/surrealdb:latest-dev start rocksdb:/database/database.db --user root_user --pass root_password";
-    # tailwind_css.exec = "tailwindcss --input assets/input.css --output assets/style.css -w > tailwind.log 2>&1";
   };
 
   services = {

package.json

@@ -1,5 +1,18 @@
 {
+  "scripts": {
+    "build:css": "postcss assets/input.css -o assets/style.css",
+    "watch:css": "postcss assets/input.css -o assets/style.css --watch",
+    "build:tailwind": "tailwindcss --input assets/input.css --output assets/style.css",
+    "watch:tailwind": "tailwindcss --input assets/input.css --output assets/style.css --watch",
+    "dev": "npm-run-all --parallel watch:css watch:tailwind"
+  },
   "devDependencies": {
-    "daisyui": "^4.12.20"
+    "autoprefixer": "^10.4.20",
+    "cssnano": "^7.0.6",
+    "daisyui": "^4.12.23",
+    "npm-run-all": "^4.1.5",
+    "postcss": "^8.4.49",
+    "postcss-cli": "^11.0.0",
+    "tailwindcss": "^3.4.17"
   }
 }

postcss.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  plugins: [
+    require('tailwindcss'),
+    require('autoprefixer'),
+    require('cssnano')({
+      preset: 'default', // Minify CSS
+    }),
+  ],
+};

templates/index.html

@@ -1,7 +1,7 @@
 {% extends "body_base.html" %}
 {% block main %}
 {% if user %}
-<p>HI</p>
+<p class="text-blue-950">HI</p>
 {% else %}
 <div class="flex flex-col items-center justify-center min-h-[80vh] space-y-8">
   <!-- Hero Section -->
@@ -31,4 +31,4 @@
   </div>
 </div>
 {% endif %}
-{% endblock %}
+{% endblock %}