Tailwind CSS と daisyUI のセットアップ

nakaterm · nakaterm · commit af0ed672dd62 · 2024-11-08T03:33:54.000+09:00
diff --git a/.cspell.json b/.cspell.json
@@ -4,7 +4,9 @@
   "words": [
     "autoincrement",
     "bunx",
+    "chrono",
     "coursemate",
+    "daisyui",
     "datasource",
     "direnv",
     "ECCS",
@@ -13,11 +15,10 @@
     "notistack",
     "psql",
     "qiita",
+    "reqwest",
     "safify",
     "supabase",
-    "swiper",
-    "reqwest",
-    "chrono"
+    "swiper"
   ],
   "dictionaries": [
     "softwareTerms",
diff --git a/web/app/globals.css b/web/app/globals.css
@@ -0,0 +1,10 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.icon-image-preview {
+    /* TODO: make it flexible */
+    max-width: 450px;
+    max-height: 450px;
+  }
+  
diff --git a/web/app/index.css b/web/app/index.css
diff --git a/web/app/layout.tsx b/web/app/layout.tsx
@@ -3,7 +3,7 @@
 import { CssBaseline, ThemeProvider, createTheme } from "@mui/material";
 import { SnackbarProvider } from "notistack";
 import React from "react";
-import "./index.css";
+import "./globals.css";
 import "@fontsource/roboto/300.css";
 import "@fontsource/roboto/400.css";
 import "@fontsource/roboto/500.css";
diff --git a/web/bun.lockb b/web/bun.lockb
diff --git a/web/package.json b/web/package.json
@@ -30,8 +30,12 @@
     "@types/css-modules": "^1.0.5",
     "@types/react": "^18.2.66",
     "@types/react-dom": "^18.2.22",
+    "autoprefixer": "^10.4.20",
+    "daisyui": "^4.12.14",
     "eslint": "^9.14.0",
     "globals": "^15.9.0",
+    "postcss": "^8.4.47",
+    "tailwindcss": "^3.4.14",
     "typescript": "^5.2.2"
   }
 }
diff --git a/web/postcss.config.js b/web/postcss.config.js
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
@@ -0,0 +1,8 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ["./app/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}"],
+  theme: {
+    extend: {},
+  },
+  plugins: [require("daisyui")],
+};

Original file line number	Diff line number	Diff line change
`@@ -30,8 +30,12 @@`
`30`	`30`	`"@types/css-modules": "^1.0.5",`
`31`	`31`	`"@types/react": "^18.2.66",`
`32`	`32`	`"@types/react-dom": "^18.2.22",`
	`33`	`+ "autoprefixer": "^10.4.20",`
	`34`	`+ "daisyui": "^4.12.14",`
`33`	`35`	`"eslint": "^9.14.0",`
`34`	`36`	`"globals": "^15.9.0",`
	`37`	`+ "postcss": "^8.4.47",`
	`38`	`+ "tailwindcss": "^3.4.14",`
`35`	`39`	`"typescript": "^5.2.2"`
`36`	`40`	`}`
`37`	`41`	`}`