From 230dca64cac51a3acb8c09023c4b52d46927960e Mon Sep 17 00:00:00 2001 From: enscribe Date: Tue, 10 Sep 2024 12:51:03 -0700 Subject: [PATCH] chore: layout --- astro.config.ts | 19 +- components.json | 20 ++ package-lock.json | 208 +++++++++++++++++- package.json | 11 +- src/components/Container.astro | 2 +- src/components/Footer.astro | 74 +------ src/components/Head.astro | 123 ----------- src/components/Header.astro | 41 ++-- src/components/MemberCard.astro | 14 +- src/components/TableOfContents.astro | 5 +- src/content/authors/enscribe.md | 14 +- .../blog/00-astro-micro-changelog/index.mdx | 2 +- src/content/config.ts | 14 +- src/layouts/Layout.astro | 8 +- src/pages/404.astro | 4 +- src/pages/about.astro | 4 +- src/pages/authors/[...slug].astro | 26 +-- src/pages/authors/index.astro | 12 +- src/pages/blog/[...slug].astro | 4 +- src/pages/blog/index.astro | 2 +- src/pages/index.astro | 2 +- src/pages/rss.xml.ts | 8 +- src/pages/tags/[...slug].astro | 4 +- src/pages/tags/index.astro | 2 +- src/styles/global.css | 107 +++++---- tailwind.config.ts | 51 ++++- tsconfig.json | 4 +- 27 files changed, 446 insertions(+), 339 deletions(-) create mode 100644 components.json diff --git a/astro.config.ts b/astro.config.ts index 4a7f0d3..e03cd1c 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -8,10 +8,19 @@ import remarkEmoji from 'remark-emoji' import remarkMath from 'remark-math' import remarkToc from 'remark-toc' +import react from '@astrojs/react' + // https://astro.build/config export default defineConfig({ site: 'https://astro-micro-academic.vercel.app', - integrations: [tailwind(), sitemap(), mdx()], + integrations: [ + tailwind({ + applyBaseStyles: false, + }), + sitemap(), + mdx(), + react(), + ], markdown: { shikiConfig: { theme: 'css-variables', @@ -19,5 +28,11 @@ export default defineConfig({ rehypePlugins: [rehypeHeadingIds, rehypeKatex], remarkPlugins: [remarkToc, remarkMath, remarkEmoji], }, - server: { port: 1234, host: true }, + server: { + port: 1234, + host: true, + }, + devToolbar: { + enabled: false, + }, }) diff --git a/components.json b/components.json new file mode 100644 index 0000000..8ff1f8e --- /dev/null +++ b/components.json @@ -0,0 +1,20 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "new-york", + "rsc": false, + "tsx": true, + "tailwind": { + "config": "tailwind.config.ts", + "css": "src/styles/global.css", + "baseColor": "neutral", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "lib": "@/lib", + "hooks": "@/hooks" + } +} diff --git a/package-lock.json b/package-lock.json index 49a08cc..09e425a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,20 +11,29 @@ "@astrojs/check": "^0.7.0", "@astrojs/markdown-remark": "^5.2.0", "@astrojs/mdx": "^3.1.2", + "@astrojs/react": "^3.6.2", "@astrojs/rss": "^4.0.7", "@astrojs/sitemap": "^3.1.6", "@astrojs/tailwind": "^5.1.0", "@fontsource/geist-mono": "^5.0.3", "@fontsource/geist-sans": "^5.0.3", + "@radix-ui/react-icons": "^1.3.0", + "@types/react": "^18.3.5", + "@types/react-dom": "^18.3.0", "astro": "^4.11.3", "bootstrap-icons": "^1.11.3", + "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "lucide-react": "^0.439.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "rehype-katex": "^7.0.0", "remark-emoji": "^5.0.1", "remark-math": "^6.0.0", "remark-toc": "^9.0.0", - "tailwind-merge": "^2.3.0", + "tailwind-merge": "^2.5.2", "tailwindcss": "^3.4.3", + "tailwindcss-animate": "^1.0.7", "typescript": "^5.4.5" }, "devDependencies": { @@ -222,6 +231,24 @@ "node": "^18.17.1 || ^20.3.0 || >=21.0.0" } }, + "node_modules/@astrojs/react": { + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/@astrojs/react/-/react-3.6.2.tgz", + "integrity": "sha512-fK29lYI7zK/KG4ZBy956x4dmauZcZ18osFkuyGa8r3gmmCQa2NZ9XNu9WaVYEUm0j89f4Gii4tbxLoyM8nk2MA==", + "dependencies": { + "@vitejs/plugin-react": "^4.3.1", + "ultrahtml": "^1.5.3" + }, + "engines": { + "node": "^18.17.1 || ^20.3.0 || >=21.0.0" + }, + "peerDependencies": { + "@types/react": "^17.0.50 || ^18.0.21", + "@types/react-dom": "^17.0.17 || ^18.0.6", + "react": "^17.0.2 || ^18.0.0 || ^19.0.0-beta", + "react-dom": "^17.0.2 || ^18.0.0 || ^19.0.0-beta" + } + }, "node_modules/@astrojs/rss": { "version": "4.0.7", "resolved": "https://registry.npmjs.org/@astrojs/rss/-/rss-4.0.7.tgz", @@ -593,6 +620,34 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/plugin-transform-react-jsx-self": { + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.24.7.tgz", + "integrity": "sha512-fOPQYbGSgH0HUp4UJO4sMBFjY6DuWq+2i8rixyUMb3CdGixs/gccURvYOAhajBdKDoGajFr3mUq5rH3phtkGzw==", + "dependencies": { + "@babel/helper-plugin-utils": "^7.24.7" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/plugin-transform-react-jsx-source": { + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.24.7.tgz", + "integrity": "sha512-J2z+MWzZHVOemyLweMqngXrgGC42jQ//R0KdxqkIz/OrbVIIlhFI3WigZ5fO+nwFvBlncr4MGapd8vTyc7RPNQ==", + "dependencies": { + "@babel/helper-plugin-utils": "^7.24.7" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, "node_modules/@babel/template": { "version": "7.24.7", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.7.tgz", @@ -1705,6 +1760,14 @@ "node": ">=14" } }, + "node_modules/@radix-ui/react-icons": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-icons/-/react-icons-1.3.0.tgz", + "integrity": "sha512-jQxj/0LKgp+j9BiTXz3O3sgs26RNet2iLWmsPyRz2SIcR4q/4SbazXfnYwbAr+vLYKSfc7qxzyGQA1HLlYiuNw==", + "peerDependencies": { + "react": "^16.x || ^17.x || ^18.x" + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.18.1", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.18.1.tgz", @@ -2082,6 +2145,28 @@ "undici-types": "~5.26.4" } }, + "node_modules/@types/prop-types": { + "version": "15.7.12", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.12.tgz", + "integrity": "sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==" + }, + "node_modules/@types/react": { + "version": "18.3.5", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.5.tgz", + "integrity": "sha512-WeqMfGJLGuLCqHGYRGHxnKrXcTitc6L/nBUWfWPcTarG3t9PsquqUMuVeXZeca+mglY4Vo5GZjCi0A3Or2lnxA==", + "dependencies": { + "@types/prop-types": "*", + "csstype": "^3.0.2" + } + }, + "node_modules/@types/react-dom": { + "version": "18.3.0", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz", + "integrity": "sha512-EhwApuTmMBmXuFOikhQLIBUn6uFg81SwLMOAUgodJF14SOBOCMdU04gDoYi0WOJJHD144TL32z4yDqCW3dnkQg==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/sax": { "version": "1.2.7", "resolved": "https://registry.npmjs.org/@types/sax/-/sax-1.2.7.tgz", @@ -2108,6 +2193,24 @@ "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==", "license": "ISC" }, + "node_modules/@vitejs/plugin-react": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.1.tgz", + "integrity": "sha512-m/V2syj5CuVnaxcUJOQRel/Wr31FFXRFlnOoq1TVtkCxsY5veGMTEmpWHndrhB2U8ScHtCQB1e+4hWYExQc6Lg==", + "dependencies": { + "@babel/core": "^7.24.5", + "@babel/plugin-transform-react-jsx-self": "^7.24.5", + "@babel/plugin-transform-react-jsx-source": "^7.24.1", + "@types/babel__core": "^7.20.5", + "react-refresh": "^0.14.2" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "peerDependencies": { + "vite": "^4.2.0 || ^5.0.0" + } + }, "node_modules/@volar/kit": { "version": "2.4.0-alpha.15", "resolved": "https://registry.npmjs.org/@volar/kit/-/kit-2.4.0-alpha.15.tgz", @@ -2832,6 +2935,25 @@ "node": ">=8" } }, + "node_modules/class-variance-authority": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/class-variance-authority/-/class-variance-authority-0.7.0.tgz", + "integrity": "sha512-jFI8IQw4hczaL4ALINxqLEXQbWcNjoSkloa4IaufXCJr6QawJyw7tuRysRsrE8w2p/4gGaxKIt/hX3qz/IbD1A==", + "dependencies": { + "clsx": "2.0.0" + }, + "funding": { + "url": "https://joebell.co.uk" + } + }, + "node_modules/class-variance-authority/node_modules/clsx": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz", + "integrity": "sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==", + "engines": { + "node": ">=6" + } + }, "node_modules/cli-boxes": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-3.0.0.tgz", @@ -2980,7 +3102,6 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", - "license": "MIT", "engines": { "node": ">=6" } @@ -3121,6 +3242,11 @@ "node": ">=4" } }, + "node_modules/csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + }, "node_modules/debug": { "version": "4.3.5", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz", @@ -4619,6 +4745,17 @@ "url": "https://github.com/sponsors/wooorm" } }, + "node_modules/loose-envify": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", + "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dependencies": { + "js-tokens": "^3.0.0 || ^4.0.0" + }, + "bin": { + "loose-envify": "cli.js" + } + }, "node_modules/lru-cache": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", @@ -4628,6 +4765,14 @@ "yallist": "^3.0.2" } }, + "node_modules/lucide-react": { + "version": "0.439.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.439.0.tgz", + "integrity": "sha512-PafSWvDTpxdtNEndS2HIHxcNAbd54OaqSYJO90/b63rab2HWYqDbH194j0i82ZFdWOAcf0AHinRykXRRK2PJbw==", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc" + } + }, "node_modules/magic-string": { "version": "0.30.10", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz", @@ -6693,6 +6838,37 @@ ], "license": "MIT" }, + "node_modules/react": { + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", + "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "dependencies": { + "loose-envify": "^1.1.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/react-dom": { + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", + "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "dependencies": { + "loose-envify": "^1.1.0", + "scheduler": "^0.23.2" + }, + "peerDependencies": { + "react": "^18.3.1" + } + }, + "node_modules/react-refresh": { + "version": "0.14.2", + "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", + "integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", @@ -7161,6 +7337,14 @@ "integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==", "license": "ISC" }, + "node_modules/scheduler": { + "version": "0.23.2", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", + "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", + "dependencies": { + "loose-envify": "^1.1.0" + } + }, "node_modules/section-matter": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz", @@ -7586,10 +7770,9 @@ } }, "node_modules/tailwind-merge": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.4.0.tgz", - "integrity": "sha512-49AwoOQNKdqKPd9CViyH5wJoSKsCDjUlzL8DxuGp3P1FsGY36NJDAa18jLZcaHAUUuTj+JB8IAo8zWgBNvBF7A==", - "license": "MIT", + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.5.2.tgz", + "integrity": "sha512-kjEBm+pvD+6eAwzJL2Bi+02/9LFLal1Gs61+QB7HvTfQQ0aXwC5LGT8PEt1gS0CWKktKe6ysPTAy3cBC5MeiIg==", "funding": { "type": "github", "url": "https://github.com/sponsors/dcastil" @@ -7632,6 +7815,14 @@ "node": ">=14.0.0" } }, + "node_modules/tailwindcss-animate": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz", + "integrity": "sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==", + "peerDependencies": { + "tailwindcss": ">=3.0.0 || insiders" + } + }, "node_modules/tailwindcss/node_modules/glob-parent": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", @@ -7801,6 +7992,11 @@ "semver": "^7.3.8" } }, + "node_modules/ultrahtml": { + "version": "1.5.3", + "resolved": "https://registry.npmjs.org/ultrahtml/-/ultrahtml-1.5.3.tgz", + "integrity": "sha512-GykOvZwgDWZlTQMtp5jrD4BVL+gNn2NVlVafjcFUJ7taY20tqYdwdoWBFy6GBJsNTZe1GkGPkSl5knQAjtgceg==" + }, "node_modules/undici-types": { "version": "5.26.5", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", diff --git a/package.json b/package.json index d1deed1..ab5feec 100644 --- a/package.json +++ b/package.json @@ -15,20 +15,29 @@ "@astrojs/check": "^0.7.0", "@astrojs/markdown-remark": "^5.2.0", "@astrojs/mdx": "^3.1.2", + "@astrojs/react": "^3.6.2", "@astrojs/rss": "^4.0.7", "@astrojs/sitemap": "^3.1.6", "@astrojs/tailwind": "^5.1.0", "@fontsource/geist-mono": "^5.0.3", "@fontsource/geist-sans": "^5.0.3", + "@radix-ui/react-icons": "^1.3.0", + "@types/react": "^18.3.5", + "@types/react-dom": "^18.3.0", "astro": "^4.11.3", "bootstrap-icons": "^1.11.3", + "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "lucide-react": "^0.439.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "rehype-katex": "^7.0.0", "remark-emoji": "^5.0.1", "remark-math": "^6.0.0", "remark-toc": "^9.0.0", - "tailwind-merge": "^2.3.0", + "tailwind-merge": "^2.5.2", "tailwindcss": "^3.4.3", + "tailwindcss-animate": "^1.0.7", "typescript": "^5.4.5" }, "devDependencies": { diff --git a/src/components/Container.astro b/src/components/Container.astro index d937368..1cc48e6 100644 --- a/src/components/Container.astro +++ b/src/components/Container.astro @@ -2,4 +2,4 @@ --- -
+
diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 9253643..b295045 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -5,7 +5,7 @@ import BackToTop from '@components/BackToTop.astro' import SocialIcons from './SocialIcons.astro' --- -