From 44ffb3d986df72d6b5080b15f755ba83bbccb4af Mon Sep 17 00:00:00 2001 From: Jorge Vargas Date: Tue, 18 Feb 2025 21:14:28 -0600 Subject: [PATCH] Update to tailwind V4 --- astro.config.mjs | 6 +- package.json | 4 +- src/components/AlbumBox.astro | 6 +- src/components/albumPage/DownloadBtn.astro | 7 +- src/components/form/ForgorForm.tsx | 14 +- src/components/form/Input.tsx | 2 +- src/components/header/LoginButton.tsx | 11 +- src/layouts/base.astro | 1 + src/pages/album/[id].astro | 4 +- src/styles/global.css | 10 - src/styles/tailwind.css | 45 ++ tailwind.config.mjs | 25 - yarn.lock | 561 +++++++-------------- 13 files changed, 262 insertions(+), 434 deletions(-) create mode 100644 src/styles/tailwind.css delete mode 100644 tailwind.config.mjs diff --git a/astro.config.mjs b/astro.config.mjs index c5ff564..db2b32c 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,6 +1,6 @@ // @ts-check import { defineConfig } from 'astro/config' -import tailwind from '@astrojs/tailwind' +import tailwindcss from '@tailwindcss/vite' import node from '@astrojs/node' import react from '@astrojs/react' import paraglide from '@inlang/paraglide-astro' @@ -20,11 +20,13 @@ export default defineConfig({ } }, integrations: [ - tailwind(), paraglide({ project: './project.inlang', outdir: './src/paraglide' }), icon({ iconDir: 'src/img/icons' }), react() ], + vite: { + plugins: [tailwindcss()] + }, image: { domains: ['cdn.sittingonclouds.net'] }, output: 'server', adapter: node({ mode: 'standalone' }), diff --git a/package.json b/package.json index 987c8d4..e23efe5 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,9 @@ "@astrojs/node": "9.0.0", "@astrojs/react": "4.1.3", "@astrojs/rss": "4.0.11", - "@astrojs/tailwind": "^6.0.0", "@inlang/paraglide-astro": "^0.2.2", "@prisma/client": "^6.3.1", + "@tailwindcss/vite": "^4.0.7", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", "astro": "5.1.5", @@ -31,7 +31,7 @@ "react-hot-toast": "^2.4.1", "react-svg-spinners": "^0.3.1", "sharp": "^0.33.5", - "tailwindcss": "^3.4.17", + "tailwindcss": "^4.0.7", "typescript": "^5.6.2" }, "devDependencies": { diff --git a/src/components/AlbumBox.astro b/src/components/AlbumBox.astro index 766fcc5..c960934 100644 --- a/src/components/AlbumBox.astro +++ b/src/components/AlbumBox.astro @@ -16,7 +16,7 @@ const { title, href, image, loading = false } = props { loading ? (
-
+
) : (
-
-
+
+
) : ( diff --git a/src/components/albumPage/DownloadBtn.astro b/src/components/albumPage/DownloadBtn.astro index b584c6f..0ec587c 100644 --- a/src/components/albumPage/DownloadBtn.astro +++ b/src/components/albumPage/DownloadBtn.astro @@ -14,12 +14,13 @@ const disabled = direct && !permissions.includes('SKIP_ADS') - {icon ? {alt : null} + {icon ? {alt : null} diff --git a/src/components/form/ForgorForm.tsx b/src/components/form/ForgorForm.tsx index fe8f937..e209177 100644 --- a/src/components/form/ForgorForm.tsx +++ b/src/components/form/ForgorForm.tsx @@ -40,13 +40,23 @@ export default function ForgorForm(props: { token: string }) { - +
- +
) } diff --git a/src/components/header/LoginButton.tsx b/src/components/header/LoginButton.tsx index 205a315..9a76884 100644 --- a/src/components/header/LoginButton.tsx +++ b/src/components/header/LoginButton.tsx @@ -65,13 +65,18 @@ function LoginForm(props: { setForm: SetState; setModalOpen: SetSta - +
- +
@@ -132,7 +137,7 @@ function CreateForgorForm(props: { setForm: SetState; setModalOpen: - +