From 5f39f6369c5268f435d2abbc392f846d2f6c4efd Mon Sep 17 00:00:00 2001 From: CDzungx <59353870+CDzungx@users.noreply.github.com> Date: Thu, 29 Jun 2023 22:56:52 +0700 Subject: [PATCH] v0.0.5 React for better animation (Framer Motion) #31 Change load priority for modules #30 Add a debug modal #29 Dependencies upgrade #28 PostCSS integrate #21 Better Pagespeed Insights #27 --- astro.config.mjs | 10 +- markdoc.config.mjs | 9 + package-lock.json | 311 ++++++++++++------ package.json | 17 +- src/components/NavFoot/DarkSwitch.jsx | 6 +- src/components/NavFoot/Debug.tsx | 34 +- src/components/NavFoot/DebugStore.ts | 3 +- src/components/animate/AnimatedStartBtn.tsx | 31 ++ .../{LandingBG.tsx => AnimtedCloseBtn} | 0 src/components/animate/LandingBG.jsx | 0 src/components/animate/Loader.jsx | 0 src/pages/landing.astro | 5 +- src/pages/vietnam.astro | 7 +- tsconfig.json | 10 +- 14 files changed, 294 insertions(+), 149 deletions(-) create mode 100644 markdoc.config.mjs create mode 100644 src/components/animate/AnimatedStartBtn.tsx rename src/components/animate/{LandingBG.tsx => AnimtedCloseBtn} (100%) create mode 100644 src/components/animate/LandingBG.jsx create mode 100644 src/components/animate/Loader.jsx diff --git a/astro.config.mjs b/astro.config.mjs index d6bcc7e..9b79f94 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,21 +1,24 @@ import { defineConfig } from "astro/config"; import prefetch from "@astrojs/prefetch"; import tailwind from "@astrojs/tailwind"; +import react from "@astrojs/react"; import solidJs from "@astrojs/solid-js"; +import alpinejs from "@astrojs/alpinejs"; import image from "@astrojs/image"; import sitemap from "@astrojs/sitemap"; -import alpinejs from "@astrojs/alpinejs"; import markdoc from "@astrojs/markdoc"; import vercel from "@astrojs/vercel/serverless"; import compress from "astro-compress"; + // https://astro.build/config export default defineConfig({ site: "https://prozekt-asolind.vercel.app/", integrations: [ + react(), + solidJs(), prefetch(), tailwind(), - solidJs(), image({ cacheDir: "./.cache/image", serviceEntryPoint: "@astrojs/image/sharp", @@ -24,12 +27,13 @@ export default defineConfig({ alpinejs(), markdoc(), compress(), + ], build: { inlineStylesheets: "auto", }, ssr: { - noExternal: ["@motionone/solid", "@solid-primitives/props", "animate.css"], + noExternal: ["animate.css"], }, output: "hybrid", adapter: vercel({ diff --git a/markdoc.config.mjs b/markdoc.config.mjs new file mode 100644 index 0000000..1f5a89b --- /dev/null +++ b/markdoc.config.mjs @@ -0,0 +1,9 @@ +// markdoc.config.mjs +import { defineMarkdocConfig, component } from "@astrojs/markdoc/config"; + +export default defineMarkdocConfig({ + tags: { + aside: { + }, + }, +}); diff --git a/package-lock.json b/package-lock.json index 0160beb..07f42f0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,33 +1,40 @@ { "name": "prozekt-asolind", - "version": "0.0.4", + "version": "0.0.5", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "prozekt-asolind", - "version": "0.0.4", + "version": "0.0.5", "dependencies": { "@astrojs/alpinejs": "^0.2.2", "@astrojs/image": "^0.17.1", - "@astrojs/markdoc": "^0.3.3", + "@astrojs/markdoc": "^0.4.0", "@astrojs/prefetch": "^0.2.3", + "@astrojs/react": "^2.2.1", "@astrojs/sitemap": "^1.3.3", "@astrojs/solid-js": "^2.2.0", "@astrojs/tailwind": "^4.0.0", - "@astrojs/vercel": "^3.5.0", + "@astrojs/vercel": "^3.5.1", "@motionone/solid": "^10.16.2", + "@nanostores/react": "^0.7.1", "@nanostores/solid": "^0.4.2", "@types/alpinejs": "^3.7.2", + "@types/react": "^18.2.14", + "@types/react-dom": "^18.2.6", "alpinejs": "^3.12.2", "animate.css": "^4.1.1", - "astro": "^2.7.0", + "astro": "^2.7.2", "astro-compress": "^1.1.47", "astro-google-fonts-optimizer": "^0.2.2", "astro-icon": "^0.8.1", + "framer-motion": "^10.12.17", "htmx.org": "^1.9.2", "nanostores": "^0.9.2", "postcss-preset-env": "^8.5.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", "sharp": "^0.32.1", "solid-js": "^1.7.7", "tailwindcss": "^3.3.2", @@ -39,7 +46,7 @@ "autoprefixer": "^10.4.14", "cssnano": "^6.0.1", "cssnano-preset-advanced": "^6.0.1", - "daisyui": "^3.1.6", + "daisyui": "^3.1.7", "motion": "^10.16.2", "postcss": "^8.4.24", "postcss-cli": "^10.1.0", @@ -87,9 +94,9 @@ } }, "node_modules/@astrojs/compiler": { - "version": "1.5.1", - "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-1.5.1.tgz", - "integrity": "sha512-iIGKu/uzB8sJ5VveQf0eHrVPPFEcrvSlp4qShYMOuY2aMmK2RVXQlX9dUjtmBQ+NAokfIOb7fwCutvH+p13l+g==" + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-1.5.2.tgz", + "integrity": "sha512-EZ3d5UTqN71N2zE3VdzVJeM+dM+pu0wV/jOi6g2VDU21LQTWozafsFMpbcLE/ksmTmbQM90/Tnn19/IR9fWGUw==" }, "node_modules/@astrojs/image": { "version": "0.17.1", @@ -114,9 +121,9 @@ } }, "node_modules/@astrojs/internal-helpers": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/@astrojs/internal-helpers/-/internal-helpers-0.1.0.tgz", - "integrity": "sha512-OSwvoFkTqVowiyP+codQeQZWoq/HOwY32x17NxDglWoCx2sdyXzplDZoVV4/3odmSEY6/A+48WMl5qkjmP1CXw==" + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@astrojs/internal-helpers/-/internal-helpers-0.1.1.tgz", + "integrity": "sha512-+LySbvFbjv2nO2m/e78suleQOGEru4Cnx73VsZbrQgB2u7A4ddsQg3P2T0zC0e10jgcT+c6nNlKeLpa6nRhQIg==" }, "node_modules/@astrojs/language-server": { "version": "1.0.8", @@ -142,13 +149,14 @@ } }, "node_modules/@astrojs/markdoc": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@astrojs/markdoc/-/markdoc-0.3.3.tgz", - "integrity": "sha512-6Lhaw2zSEKYKegoHpngQJKUaW2mQ8VXItFWqbUpSQaqZ+mTCgPCJfi34eirakLO43PRs0SiqbSZqPpv8d33XrQ==", + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/@astrojs/markdoc/-/markdoc-0.4.0.tgz", + "integrity": "sha512-F8ovLWJ2OIF7Mjl8b/ZZmkzPvtle8/Lu0PxdsDynGIxeoNruraD8Wc3p9VPQC9oeNNQL21ajz2YzRgB44PQcWQ==", "dependencies": { + "@astrojs/internal-helpers": "^0.1.0", "@astrojs/prism": "^2.1.2", "@markdoc/markdoc": "^0.3.0", - "esbuild": "^0.17.12", + "esbuild": "^0.17.19", "github-slugger": "^2.0.0", "gray-matter": "^4.0.3", "kleur": "^4.1.5", @@ -159,7 +167,7 @@ "node": ">=16.12.0" }, "peerDependencies": { - "astro": "^2.6.3" + "astro": "^2.7.2" } }, "node_modules/@astrojs/markdown-remark": { @@ -209,6 +217,24 @@ "node": ">=16.12.0" } }, + "node_modules/@astrojs/react": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/@astrojs/react/-/react-2.2.1.tgz", + "integrity": "sha512-nq5Zr8iWdwjSp5fh1NReaCplwsnL4w5PXAY5XWu1jE/frxEfF/ycGHrrhwWW0uJHX9G+kUtmQLR0GBhlR4FmAw==", + "dependencies": { + "@babel/core": ">=7.0.0-0 <8.0.0", + "@babel/plugin-transform-react-jsx": "^7.17.12" + }, + "engines": { + "node": ">=16.12.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", + "react-dom": "^17.0.2 || ^18.0.0" + } + }, "node_modules/@astrojs/sitemap": { "version": "1.3.3", "resolved": "https://registry.npmjs.org/@astrojs/sitemap/-/sitemap-1.3.3.tgz", @@ -266,21 +292,21 @@ } }, "node_modules/@astrojs/vercel": { - "version": "3.5.0", - "resolved": "https://registry.npmjs.org/@astrojs/vercel/-/vercel-3.5.0.tgz", - "integrity": "sha512-2uhwcY6fwgLZVlk13jgz6oN4pY6N1DDQZXeMwkcohVyGPbnToFxpjTnhI19neq0r9eA0aA7oHqY1oG6quV9/Og==", + "version": "3.5.1", + "resolved": "https://registry.npmjs.org/@astrojs/vercel/-/vercel-3.5.1.tgz", + "integrity": "sha512-qMJ0iLHOhHnFMNMK0qfwjSuaiGFo7Qjyl6WaS3ryKL53z8za1Z8PsgKdd83mM4Hjzir8/340GUNgSv3KW257qQ==", "dependencies": { - "@astrojs/internal-helpers": "^0.1.0", + "@astrojs/internal-helpers": "^0.1.1", "@astrojs/webapi": "^2.2.0", - "@vercel/analytics": "^0.1.8", - "@vercel/nft": "^0.22.1", - "esbuild": "^0.17.12", - "fast-glob": "^3.2.11", - "set-cookie-parser": "^2.5.1", - "web-vitals": "^3.1.1" + "@vercel/analytics": "^0.1.11", + "@vercel/nft": "^0.22.6", + "esbuild": "^0.17.19", + "fast-glob": "^3.2.12", + "set-cookie-parser": "^2.6.0", + "web-vitals": "^3.3.2" }, "peerDependencies": { - "astro": "^2.6.0" + "astro": "^2.7.1" } }, "node_modules/@astrojs/webapi": { @@ -1288,6 +1314,21 @@ "resolved": "https://registry.npmjs.org/@emmetio/scanner/-/scanner-1.0.4.tgz", "integrity": "sha512-IqRuJtQff7YHHBk4G8YZ45uB9BaAGcwQeVzgj/zj8/UdOhtQpEIupUhSk8dys6spFIWVZVeK20CzGEnqR5SbqA==" }, + "node_modules/@emotion/is-prop-valid": { + "version": "0.8.8", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz", + "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==", + "optional": true, + "dependencies": { + "@emotion/memoize": "0.7.4" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz", + "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==", + "optional": true + }, "node_modules/@esbuild/android-arm": { "version": "0.17.19", "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.17.19.tgz", @@ -1675,11 +1716,6 @@ "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz", "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==" }, - "node_modules/@ljharb/has-package-exports-patterns": { - "version": "0.0.2", - "resolved": "https://registry.npmjs.org/@ljharb/has-package-exports-patterns/-/has-package-exports-patterns-0.0.2.tgz", - "integrity": "sha512-4/RWEeXDO6bocPONheFe6gX/oQdP/bEpv0oL4HqjPP5DCenBSt0mHgahppY49N0CpsaqffdwPq+TlX9CYOq2Dw==" - }, "node_modules/@mapbox/node-pre-gyp": { "version": "1.0.10", "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.10.tgz", @@ -1845,6 +1881,24 @@ "tslib": "^2.3.1" } }, + "node_modules/@nanostores/react": { + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/@nanostores/react/-/react-0.7.1.tgz", + "integrity": "sha512-EXQg9N4MdI4eJQz/AZLIx3hxQ6BuBmV4Q55bCd5YCSgEOAW7tGTsIZxpRXxvxLXzflNvHTBvfrDNY38TlSVBkQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "engines": { + "node": "^16.0.0 || ^18.0.0 || >=20.0.0" + }, + "peerDependencies": { + "nanostores": "^0.9.0", + "react": ">=18.0.0" + } + }, "node_modules/@nanostores/solid": { "version": "0.4.2", "resolved": "https://registry.npmjs.org/@nanostores/solid/-/solid-0.4.2.tgz", @@ -2115,6 +2169,29 @@ "resolved": "https://registry.npmjs.org/@types/parse5/-/parse5-6.0.3.tgz", "integrity": "sha512-SuT16Q1K51EAVPz1K29DJ/sXjhSQ0zjvsypYJ6tlwVsRV9jwW5Adq2ch8Dq8kDBCkYnELS7N7VNCSB5nC56t/g==" }, + "node_modules/@types/prop-types": { + "version": "15.7.5", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" + }, + "node_modules/@types/react": { + "version": "18.2.14", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.14.tgz", + "integrity": "sha512-A0zjq+QN/O0Kpe30hA1GidzyFjatVvrpIvWLxD+xv67Vt91TWWgco9IvrJBkeyHm1trGaFS/FSGqPlhyeZRm0g==", + "dependencies": { + "@types/prop-types": "*", + "@types/scheduler": "*", + "csstype": "^3.0.2" + } + }, + "node_modules/@types/react-dom": { + "version": "18.2.6", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.6.tgz", + "integrity": "sha512-2et4PDvg6PVCyS7fuTc4gPoksV58bW0RwSxWKcPRcHZf0PRUGq03TKcD/rUHe3azfV6/5/biUBJw+HhCQjaP0A==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/resolve": { "version": "1.20.2", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.2.tgz", @@ -2128,6 +2205,11 @@ "@types/node": "*" } }, + "node_modules/@types/scheduler": { + "version": "0.16.3", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" + }, "node_modules/@types/unist": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.6.tgz", @@ -2384,12 +2466,12 @@ } }, "node_modules/astro": { - "version": "2.7.0", - "resolved": "https://registry.npmjs.org/astro/-/astro-2.7.0.tgz", - "integrity": "sha512-gUYx2R0V7fpZtFRN9f4nE0We95qYhJyAr+VW0nVFqlMMF1of9MzrjjJ+8rIGJ/6RooFK8XAaXWTQMGTok3ZzEA==", + "version": "2.7.2", + "resolved": "https://registry.npmjs.org/astro/-/astro-2.7.2.tgz", + "integrity": "sha512-2+vjXeVGU04aecs0mm93Qx9KdeVDw4OTeBIijs2Z+QLoe4RUYZnkqx5gR70VNfnoMdXoPp7+wB+ARcb0+ee/yg==", "dependencies": { "@astrojs/compiler": "^1.5.0", - "@astrojs/internal-helpers": "^0.1.0", + "@astrojs/internal-helpers": "^0.1.1", "@astrojs/language-server": "^1.0.0", "@astrojs/markdown-remark": "^2.2.1", "@astrojs/telemetry": "^2.1.1", @@ -2430,13 +2512,11 @@ "preferred-pm": "^3.0.3", "prompts": "^2.4.2", "rehype": "^12.0.1", - "semver": "^7.5.2", + "semver": "^7.5.3", "server-destroy": "^1.0.1", "shiki": "^0.14.1", - "slash": "^4.0.0", "string-width": "^5.1.2", "strip-ansi": "^7.1.0", - "supports-esm": "^1.0.0", "tsconfig-resolver": "^3.0.1", "typescript": "*", "unist-util-visit": "^4.1.2", @@ -2694,9 +2774,9 @@ } }, "node_modules/babel-preset-solid": { - "version": "1.7.4", - "resolved": "https://registry.npmjs.org/babel-preset-solid/-/babel-preset-solid-1.7.4.tgz", - "integrity": "sha512-0mbHNYkbOVYhH6L95VlHVkBEVQjOXSzUqLDiFxUcsg/tU4yTM/qx7FI8C+kmos9LHckQBSm3wtwoe1BZLNJR1w==", + "version": "1.7.7", + "resolved": "https://registry.npmjs.org/babel-preset-solid/-/babel-preset-solid-1.7.7.tgz", + "integrity": "sha512-tdxVzx3kgcIjNXAOmGRbzIhFBPeJjSakiN9yM+IYdL/+LtXNnbGqb0Va5tJb8Sjbk+QVEriovCyuzB5T7jeTvg==", "dependencies": { "babel-plugin-jsx-dom-expressions": "^0.36.10" }, @@ -3017,9 +3097,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001508", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001508.tgz", - "integrity": "sha512-sdQZOJdmt3GJs1UMNpCCCyeuS2IEGLXnHyAo9yIO5JJDjbjoVRij4M1qep6P6gFpptD1PqIYgzM+gwJbOi92mw==", + "version": "1.0.30001509", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001509.tgz", + "integrity": "sha512-2uDDk+TRiTX5hMcUYT/7CSyzMZxjfGu0vAUjS2g0LSD8UoXOv0LtpH4LxGMemsiPq6LCVIUjNwVM0erkOkGCDA==", "funding": [ { "type": "opencollective", @@ -3673,9 +3753,9 @@ "dev": true }, "node_modules/daisyui": { - "version": "3.1.6", - "resolved": "https://registry.npmjs.org/daisyui/-/daisyui-3.1.6.tgz", - "integrity": "sha512-P/2WUn4ZImEc2IfPSYw3qPCUnnJNju0P6ii0fUqtTURUj0oda6L0tm4EzrUmB2EbqB6grZ9nKHPTSniKaPYp1w==", + "version": "3.1.7", + "resolved": "https://registry.npmjs.org/daisyui/-/daisyui-3.1.7.tgz", + "integrity": "sha512-VQhaunQlB7Buo+AbE+S3i6H/eYknKEuKVHG67y7sbG58uEjeLK6n2rojG3YE7fwoOss6ldbUL8Oy0MyoJi0CHw==", "dev": true, "dependencies": { "colord": "^2.9", @@ -3991,9 +4071,9 @@ "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==" }, "node_modules/electron-to-chromium": { - "version": "1.4.440", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.440.tgz", - "integrity": "sha512-r6dCgNpRhPwiWlxbHzZQ/d9swfPaEJGi8ekqRBwQYaR3WmA5VkqQfBWSDDjuJU1ntO+W9tHx8OHV/96Q8e0dVw==" + "version": "1.4.445", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.445.tgz", + "integrity": "sha512-++DB+9VK8SBJwC+X1zlMfJ1tMA3F0ipi39GdEp+x3cV2TyBihqAgad8cNMWtLDEkbH39nlDQP7PfGrDr3Dr7HA==" }, "node_modules/emmet": { "version": "2.4.4", @@ -4287,6 +4367,29 @@ "url": "https://www.patreon.com/infusion" } }, + "node_modules/framer-motion": { + "version": "10.12.17", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-10.12.17.tgz", + "integrity": "sha512-IR+aAYntsyu6ofyxqQV4QYotmOqzcuKxhqNpfc3DXJjNWOPpOeSyH0A+In3IEBu49Yx/+PNht+YMeZSdCNaYbw==", + "dependencies": { + "tslib": "^2.4.0" + }, + "optionalDependencies": { + "@emotion/is-prop-valid": "^0.8.2" + }, + "peerDependencies": { + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fs-constants": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz", @@ -4519,6 +4622,18 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/globby/node_modules/slash": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", + "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/graceful-fs": { "version": "4.2.11", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", @@ -4577,17 +4692,6 @@ "node": ">=4" } }, - "node_modules/has-package-exports": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/has-package-exports/-/has-package-exports-1.3.0.tgz", - "integrity": "sha512-e9OeXPQnmPhYoJ63lXC4wWe34TxEGZDZ3OQX9XRqp2VwsfLl3bQBy7VehLnd34g3ef8CmYlBLGqEMKXuz8YazQ==", - "dependencies": { - "@ljharb/has-package-exports-patterns": "^0.0.2" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/has-unicode": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz", @@ -5252,9 +5356,9 @@ } }, "node_modules/log-symbols/node_modules/chalk": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz", - "integrity": "sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz", + "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==", "engines": { "node": "^12.17.0 || ^14.13 || >=16.0.0" }, @@ -5275,7 +5379,6 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", - "peer": true, "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" }, @@ -6563,9 +6666,9 @@ } }, "node_modules/ora/node_modules/chalk": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz", - "integrity": "sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz", + "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==", "engines": { "node": "^12.17.0 || ^14.13 || >=16.0.0" }, @@ -6922,18 +7025,6 @@ "postcss": "^8.0.0" } }, - "node_modules/postcss-cli/node_modules/slash": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz", - "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==", - "dev": true, - "engines": { - "node": ">=14.16" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/postcss-color-functional-notation": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/postcss-color-functional-notation/-/postcss-color-functional-notation-5.1.0.tgz", @@ -8416,7 +8507,6 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", - "peer": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -8424,6 +8514,18 @@ "node": ">=0.10.0" } }, + "node_modules/react-dom": { + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", + "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", + "dependencies": { + "loose-envify": "^1.1.0", + "scheduler": "^0.23.0" + }, + "peerDependencies": { + "react": "^18.2.0" + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", @@ -8743,9 +8845,9 @@ } }, "node_modules/rollup": { - "version": "3.25.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.25.2.tgz", - "integrity": "sha512-VLnkxZMDr3jpxgtmS8pQZ0UvhslmF4ADq/9w4erkctbgjCqLW9oa89fJuXEs4ZmgyoF7Dm8rMDKSS5b5u2hHUg==", + "version": "3.25.3", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.25.3.tgz", + "integrity": "sha512-ZT279hx8gszBj9uy5FfhoG4bZx8c+0A1sbqtr7Q3KNWIizpTdDEPZbV2xcbvHsnFp4MavCQYZyzApJ+virB8Yw==", "bin": { "rollup": "dist/bin/rollup" }, @@ -8923,6 +9025,14 @@ "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==" }, + "node_modules/scheduler": { + "version": "0.23.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", + "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", + "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", @@ -9133,11 +9243,12 @@ } }, "node_modules/slash": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", - "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz", + "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==", + "dev": true, "engines": { - "node": ">=12" + "node": ">=14.16" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -9388,14 +9499,6 @@ "node": ">=4" } }, - "node_modules/supports-esm": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/supports-esm/-/supports-esm-1.0.0.tgz", - "integrity": "sha512-96Am8CDqUaC0I2+C/swJ0yEvM8ZnGn4unoers/LSdE4umhX7mELzqyLzx3HnZAluq5PXIsGMKqa7NkqaeHMPcg==", - "dependencies": { - "has-package-exports": "^1.1.0" - } - }, "node_modules/supports-preserve-symlinks-flag": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", @@ -9769,9 +9872,9 @@ } }, "node_modules/tslib": { - "version": "2.5.3", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.3.tgz", - "integrity": "sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==" + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.0.tgz", + "integrity": "sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==" }, "node_modules/tunnel-agent": { "version": "0.6.0", @@ -9801,9 +9904,9 @@ "integrity": "sha512-IBB52GlJiTUOnomwdVVf7lWgC6gScn8md+26zTHj5oJWA+4pSuclHE76rbGI2hnyO+NT+QXdIUHbfjAY5nEtcw==" }, "node_modules/typescript": { - "version": "5.1.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.3.tgz", - "integrity": "sha512-XH627E9vkeqhlZFQuL+UsyAXEnibT0kWR2FWONlr4sTjvxyJYnyefgrkyECLzM5NenmKzRAy2rR/OlYLA1HkZw==", + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", + "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/package.json b/package.json index a1dc061..44a1a0a 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "prozekt-asolind", "type": "module", - "version": "0.0.4", + "version": "0.0.5", "scripts": { "dev": "astro dev", "start": "astro dev", @@ -12,24 +12,31 @@ "dependencies": { "@astrojs/alpinejs": "^0.2.2", "@astrojs/image": "^0.17.1", - "@astrojs/markdoc": "^0.3.3", + "@astrojs/markdoc": "^0.4.0", "@astrojs/prefetch": "^0.2.3", + "@astrojs/react": "^2.2.1", "@astrojs/sitemap": "^1.3.3", "@astrojs/solid-js": "^2.2.0", "@astrojs/tailwind": "^4.0.0", - "@astrojs/vercel": "^3.5.0", + "@astrojs/vercel": "^3.5.1", "@motionone/solid": "^10.16.2", + "@nanostores/react": "^0.7.1", "@nanostores/solid": "^0.4.2", "@types/alpinejs": "^3.7.2", + "@types/react": "^18.2.14", + "@types/react-dom": "^18.2.6", "alpinejs": "^3.12.2", "animate.css": "^4.1.1", - "astro": "^2.7.0", + "astro": "^2.7.2", "astro-compress": "^1.1.47", "astro-google-fonts-optimizer": "^0.2.2", "astro-icon": "^0.8.1", + "framer-motion": "^10.12.17", "htmx.org": "^1.9.2", "nanostores": "^0.9.2", "postcss-preset-env": "^8.5.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", "sharp": "^0.32.1", "solid-js": "^1.7.7", "tailwindcss": "^3.3.2", @@ -41,7 +48,7 @@ "autoprefixer": "^10.4.14", "cssnano": "^6.0.1", "cssnano-preset-advanced": "^6.0.1", - "daisyui": "^3.1.6", + "daisyui": "^3.1.7", "motion": "^10.16.2", "postcss": "^8.4.24", "postcss-cli": "^10.1.0", diff --git a/src/components/NavFoot/DarkSwitch.jsx b/src/components/NavFoot/DarkSwitch.jsx index 4654856..f2a7c48 100644 --- a/src/components/NavFoot/DarkSwitch.jsx +++ b/src/components/NavFoot/DarkSwitch.jsx @@ -1,5 +1,7 @@ +/** @jsxImportSource solid-js */ + import { createSignal, onMount } from "solid-js"; -import { $dataTheme, $currentTheme } from "./DebugStore"; +import { $dataTheme } from "./DebugStore"; function DarkSwitch() { const [currentThemeValue, setCurrentTheme] = createSignal(localStorage.getItem("data-theme") || "light"); function handleCheckboxChange(event) { @@ -7,7 +9,6 @@ function DarkSwitch() { setCurrentTheme(newTheme); localStorage.setItem("data-theme", newTheme); $dataTheme.set(currentThemeValue()); - $currentTheme.set(localStorage.getItem("theme")); } onMount(() => { @@ -22,7 +23,6 @@ function DarkSwitch() { } document.documentElement.setAttribute("data-theme", currentThemeValue()); $dataTheme.set(currentThemeValue()); - $currentTheme.set(localStorage.getItem("theme")); }); return ( diff --git a/src/components/NavFoot/Debug.tsx b/src/components/NavFoot/Debug.tsx index fc3f603..5c8a836 100644 --- a/src/components/NavFoot/Debug.tsx +++ b/src/components/NavFoot/Debug.tsx @@ -1,39 +1,33 @@ -import { onMount } from "solid-js"; -import { useStore } from "@nanostores/solid"; -import { $dataTheme, $currentTheme, $hasClickedStartButton } from "./DebugStore"; +import { useEffect } from "react"; +import { useStore } from "@nanostores/react"; +import { $dataTheme, $hasClickedStartButton } from "./DebugStore"; -function Debug() { +export default function Debug() { const hasClickedStartButton = useStore($hasClickedStartButton); const dataTheme = useStore($dataTheme); - const currentTheme = useStore($currentTheme); - onMount(() => { + useEffect(() => { if (localStorage.getItem("hasClickedStartButton") === "true") { $hasClickedStartButton.set("true"); } }); return ( <> - -
-

Debug Info

+ + +

Debug Info

-
- Data-Theme: {dataTheme()} +
+ Data-Theme: {dataTheme}
-
- Current Theme: {currentTheme()} -
-
- Has Start Button Clicked: {hasClickedStartButton()} +
+ Has Start Button Clicked: {hasClickedStartButton}
-
- +
+
); } - -export default Debug; diff --git a/src/components/NavFoot/DebugStore.ts b/src/components/NavFoot/DebugStore.ts index 3faca9c..3b72529 100644 --- a/src/components/NavFoot/DebugStore.ts +++ b/src/components/NavFoot/DebugStore.ts @@ -1,7 +1,6 @@ import { atom } from "nanostores"; var $dataTheme = atom("light" || "dark"); -var $currentTheme = atom("light" || "dark"); var $hasClickedStartButton = atom("false" || "true"); -export { $dataTheme, $currentTheme, $hasClickedStartButton }; +export { $dataTheme, $hasClickedStartButton }; diff --git a/src/components/animate/AnimatedStartBtn.tsx b/src/components/animate/AnimatedStartBtn.tsx new file mode 100644 index 0000000..4c2a760 --- /dev/null +++ b/src/components/animate/AnimatedStartBtn.tsx @@ -0,0 +1,31 @@ +import { motion } from "framer-motion" +import { $hasClickedStartButton } from "../NavFoot/DebugStore"; + +function redirect() { + window.location.href = "#"; + localStorage.setItem("hasClickedStartButton", "true"); + $hasClickedStartButton.set("true"); + } + +export default function AnimatedStartBtn(){ + return ( + <> +
+ + + Get Started +
+ + + +
+ + +
+ + ); + }; \ No newline at end of file diff --git a/src/components/animate/LandingBG.tsx b/src/components/animate/AnimtedCloseBtn similarity index 100% rename from src/components/animate/LandingBG.tsx rename to src/components/animate/AnimtedCloseBtn diff --git a/src/components/animate/LandingBG.jsx b/src/components/animate/LandingBG.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/animate/Loader.jsx b/src/components/animate/Loader.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/landing.astro b/src/pages/landing.astro index cfd55c1..ae5fa62 100644 --- a/src/pages/landing.astro +++ b/src/pages/landing.astro @@ -1,5 +1,5 @@ --- -import LandingButton from "../components/animate/LandingButton"; +import AnimatedStartBtn from "../components/animate/AnimatedStartBtn"; import "animate.css/animate.min.css"; --- @@ -14,13 +14,12 @@ import "animate.css/animate.min.css";
- +