Use standalone CLI of TailwindCSS

.gitignore

@@ -1,3 +1,3 @@
 .qlot
 public/dist.css
-node_modules
+bin/tailwindcss

Makefile

@@ -1,12 +1,35 @@
-install: ## Install dependencies
+TAILWINDCSS_URL=https://github.com/tailwindlabs/tailwindcss/releases/latest/download/tailwindcss-macos-arm64
+TAILWIND_TARGET=tailwindcss-macos-arm64
+BIN_DIR=./bin
+TAILWIND_BIN=$(BIN_DIR)/tailwindcss
+STYLE_SRC=./public/style.css
+STYLE_DIST=./public/dist.css
+
+all: install
+
+install: ## Download TailwindCSS binary and install other dependencies
+	@echo "Creating bin directory if it doesn't exist..."
+	mkdir -p $(BIN_DIR)
+	@echo "Downloading TailwindCSS binary..."
+	curl -sLO $(TAILWINDCSS_URL)
+	@echo "Making TailwindCSS binary executable..."
+	chmod +x $(TAILWIND_TARGET)
+	@echo "Moving TailwindCSS binary to $(BIN_DIR)..."
+	mv $(TAILWIND_TARGET) $(TAILWIND_BIN)
+	@echo "TailwindCSS is ready in $(BIN_DIR)/"
+	@echo "Installing qlot dependencies..."
 	@qlot install
 
-watch: ## Run watch mode
-	@bun run tailwindcss -i ./public/style.css -o ./public/dist.css --watch=always
+watch: ## Start TailwindCSS in watch mode for automatic rebuilds
+	@$(TAILWIND_BIN) -i $(STYLE_SRC) -o $(STYLE_DIST) --watch=always
 
-build: ## Build
-	@bun run tailwindcss -i ./public/style.css -o ./public/dist.css
+build: ## Generate the final CSS output
+	@$(TAILWIND_BIN) -i $(STYLE_SRC) -o $(STYLE_DIST)
 
-help: ## Show options
+help: ## Display available commands and their descriptions
 	@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | \
-		awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-20s\033[0m %s\n", $$1, $$2}'
+		awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-20s\033[0m %s\n", $$1, $$2}'
+
+clean: ## Remove the bin directory and clean up generated files
+	@echo "Removing $(BIN_DIR)..."
+	rm -rf $(BIN_DIR)

package.json

@@ -1,6 +0,0 @@
-{
-  "devDependencies": {
-    "daisyui": "^4.12.2",
-    "tailwindcss": "^3.4.4"
-  }
-}

qlfile.lock

@@ -17,7 +17,7 @@
 ("hsx" .
  (:class qlot/source/git:source-git
   :initargs (:remote-url "https://github.com/skyizwhite/hsx.git")
-  :version "git-4e83acaae7570b89efaf821809a534e2d5de278e"))
+  :version "git-6f8df3e00da00b977c623cc2e1b42d53d06d259f"))
 ("ningle-fbr" .
  (:class qlot/source/git:source-git
   :initargs (:remote-url "https://github.com/skyizwhite/ningle-fbr.git")

src/routes/index.lisp

@@ -6,8 +6,18 @@
 
 (defcomp page ()
   (hsx
-   (h1 :class "text-primary"
-     "こんにちは")))
+   (<>
+     (h1 :class "text-green-600"
+       "こんにちは")
+     (div :x-data "{
+         open: false,
+         get isOpen() { return this.open },
+         toggle() { this.open = ! this.open },
+     }"
+       (button :@click "toggle()"
+         "Toggle")
+       (div :x-show "isOpen"
+         "Content ...")))))
 
 (defun handle-get (params)
   (declare (ignore params))

src/routes/not-found.lisp

@@ -11,7 +11,7 @@
 
 (defcomp page ()
   (hsx
-   (h1 :class "text-primary"
+   (h1 :class "text-red-600"
      "404 Not Found")))
 
 (defun handle-not-found ()

tailwind.config.js

@@ -5,10 +5,5 @@ module.exports = {
     "./src/routes/**/*.lisp",
     "./src/components/**/*.lisp",
   ],
-  theme: {
-    extend: {},
-  },
-  plugins: [
-    require('daisyui'),
-  ],
+  plugins: [],
 }