Switch to native tailwind

Wave-Studio · Dec 2, 2023 · 81c4dac · 81c4dac · Blocksnmore · Dec 2, 2023
1 parent da68319
commit 81c4dac
Show file tree

Hide file tree

Showing 7 changed files with 187 additions and 162 deletions.
diff --git a/README.md b/README.md
@@ -6,4 +6,3 @@ Event Ticketing of the future
 
 Events is built with [Deno Deploy](https://deno.com/deploy) support in mind but you should be able to selfhost this anywhere, just copy `.env.example` to `.env` and update the variables.
 If you're selfhosting then KV requires an extra step with either creating a `db` folder for the database to be stored in or setting `DENO_DEPLOYMENT_ID` to anything for it to use the global version.
-
diff --git a/deno.jsonc b/deno.jsonc
@@ -1,19 +1,19 @@
 {
   "lock": false,
+  "nodeModulesDir": true,
   "tasks": {
     "check": "deno fmt --check && deno lint && deno check **/*.ts && deno check **/*.tsx",
     "fmt": "npx prettier . --write",
     "start": "deno run -A --unstable --watch=static/,routes/ dev.ts",
     "build": "deno run -A --unstable dev.ts build",
-    "preview": "deno run -A main.ts",
-    "update": "deno run --unstable -A -r https://fresh.deno.dev/update .",
-    "css": "npx tailwindcss -i ./static/styles.css -o ./static/output.css --watch --minify"
+    "preview": "deno run --unstable -A main.ts",
+    "update": "deno run --unstable -A -r https://fresh.deno.dev/update ."
   },
   "lint": { "rules": { "tags": ["fresh", "recommended"] } },
   "imports": {
-    "$fresh/": "https://deno.land/x/fresh@1.5.4/",
-    "preact": "https://esm.sh/preact@10.18.1",
-    "preact/": "https://esm.sh/preact@10.18.1/",
+    "$fresh/": "https://deno.land/x/fresh@1.6.0/",
+    "preact": "https://esm.sh/preact@10.19.2",
+    "preact/": "https://esm.sh/preact@10.19.2/",
     "preact-render-to-string": "https://esm.sh/*[email protected]",
     "@preact/signals": "https://esm.sh/*@preact/[email protected]",
     "@preact/signals-core": "https://esm.sh/*@preact/[email protected]",
@@ -22,9 +22,11 @@
     "$tabler/": "https://deno.land/x/[email protected]/tsx/",
     "yup": "https://esm.sh/[email protected]",
     "imagekit": "npm:[email protected]",
-    "barcode-polyfill": "https://esm.sh/[email protected]"
+    "barcode-polyfill": "https://esm.sh/[email protected]",
+    "tailwindcss": "npm:[email protected]",
+    "tailwindcss/": "npm:/[email protected]/",
+    "tailwindcss/plugin": "npm:/[email protected]/plugin.js"
   },
   "compilerOptions": { "jsx": "react-jsx", "jsxImportSource": "preact" },
-  "nodeModulesDir": true,
   "exclude": ["**/_fresh/*"]
 }
diff --git a/fresh.config.ts b/fresh.config.ts
@@ -1,13 +1,16 @@
 import { defineConfig } from "$fresh/server.ts";
 import unocssPlugin from "@/utils/plugins/unocss.ts";
+import tailwind from "$fresh/plugins/tailwind.ts";
 import { kvInsightsPlugin } from "https://deno.land/x/[email protected]/mod.ts";
 import { kv } from "@/utils/db/kv.ts";
 
+
 export default defineConfig({
   plugins: [
     unocssPlugin(),
     kvInsightsPlugin({
       kv,
     }),
+	tailwind()
   ],
 });
diff --git a/fresh.gen.ts b/fresh.gen.ts
diff --git a/routes/_app.tsx b/routes/_app.tsx
@@ -1,18 +1,18 @@
-import { AppProps } from "$fresh/server.ts";
+import { PageProps } from "$fresh/server.ts";
 import { asset } from "$fresh/runtime.ts";
 import { Partial } from "$fresh/runtime.ts";
 
 const logo = asset("/orange-logo.svg");
 
-export default function App({ Component }: AppProps) {
+export default function App({ Component }: PageProps) {
   return (
     <html lang="en">
       <head>
         <meta charSet="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>Events - OSS Ticketing Software for the Future</title>
         <link rel="icon" href={logo} />
-        <link rel="stylesheet" href={asset("/output.css")} />
+        <link rel="stylesheet" href={asset("/styles.css")} />
       </head>
       <body class="text-gray-900 [scrollbar-gutter:stable]" /*f-client-nav*/>
         {/* <Partial name="body"> */}

diff --git a/static/output.css b/static/output.css
diff --git a/tailwind.config.js → tailwind.config.ts b/tailwind.config.js → tailwind.config.ts
@@ -1,5 +1,9 @@
-module.exports = {
-  content: ["./{routes,islands,components}/**/*.{tsx,ts}"],
+import { type Config } from "tailwindcss";
+
+export default {
+  content: [
+    "{routes,islands,components}/**/*.{ts,tsx}",
+  ],
   theme: {
     extend: {
       colors: {
@@ -12,5 +16,4 @@ module.exports = {
       },
     },
   },
-  plugins: [],
-};
+} as Config;
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,4 +6,3 @@ Event Ticketing of the future

		Events is built with [Deno Deploy](https://deno.com/deploy) support in mind but you should be able to selfhost this anywhere, just copy `.env.example` to `.env` and update the variables.
		If you're selfhosting then KV requires an extra step with either creating a `db` folder for the database to be stored in or setting `DENO_DEPLOYMENT_ID` to anything for it to use the global version.