diff --git a/vite-tailwindcss/dist (2).zip b/vite-tailwindcss/dist (2).zip new file mode 100644 index 0000000..0fbb8fa Binary files /dev/null and b/vite-tailwindcss/dist (2).zip differ diff --git a/vite-tailwindcss/dist.zip b/vite-tailwindcss/dist.zip index 2552495..40ef656 100644 Binary files a/vite-tailwindcss/dist.zip and b/vite-tailwindcss/dist.zip differ diff --git a/vite-tailwindcss/index.html b/vite-tailwindcss/index.html index 8572ce5..e1795a5 100644 --- a/vite-tailwindcss/index.html +++ b/vite-tailwindcss/index.html @@ -2,7 +2,7 @@ - + @@ -10,6 +10,7 @@ + 李琦&李逸烁的婚礼请柬 diff --git a/vite-tailwindcss/package-lock.json b/vite-tailwindcss/package-lock.json index bfb0b55..9e2536b 100644 --- a/vite-tailwindcss/package-lock.json +++ b/vite-tailwindcss/package-lock.json @@ -14,6 +14,7 @@ "@tailwindcss/vite": "^4.1.4", "@vueuse/head": "^2.0.0", "ant-design-vue": "^4.1.1", + "aos": "^2.3.4", "axios": "^1.6.2", "lucide-vue-next": "^0.507.0", "pinia": "^2.1.7", @@ -1756,6 +1757,17 @@ "vue": ">=3.2.0" } }, + "node_modules/aos": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/aos/-/aos-2.3.4.tgz", + "integrity": "sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==", + "license": "MIT", + "dependencies": { + "classlist-polyfill": "^1.0.3", + "lodash.debounce": "^4.0.6", + "lodash.throttle": "^4.0.1" + } + }, "node_modules/array-tree-filter": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz", @@ -1815,6 +1827,12 @@ "url": "https://paulmillr.com/funding/" } }, + "node_modules/classlist-polyfill": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", + "integrity": "sha512-GzIjNdcEtH4ieA2S8NmrSxv7DfEV5fmixQeyTmqmRmRJPGpRBaSnA2a0VrCjyT8iW8JjEdMbKzDotAJf+ajgaQ==", + "license": "Unlicense" + }, "node_modules/combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -2538,6 +2556,18 @@ "integrity": "sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==", "license": "MIT" }, + "node_modules/lodash.debounce": { + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", + "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==", + "license": "MIT" + }, + "node_modules/lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==", + "license": "MIT" + }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", diff --git a/vite-tailwindcss/package.json b/vite-tailwindcss/package.json index 3c82eaa..703669f 100644 --- a/vite-tailwindcss/package.json +++ b/vite-tailwindcss/package.json @@ -9,18 +9,19 @@ "preview": "vite preview" }, "dependencies": { - "tailwindcss": "^4.1.4", - "vue": "^3.5.13", "@ant-design-vue/pro-layout": "^3.2.5", "@ant-design/icons-vue": "^7.0.1", "@fortawesome/fontawesome-free": "^6.7.2", "@tailwindcss/vite": "^4.1.4", "@vueuse/head": "^2.0.0", "ant-design-vue": "^4.1.1", + "aos": "^2.3.4", "axios": "^1.6.2", "lucide-vue-next": "^0.507.0", "pinia": "^2.1.7", "swiper": "^11.0.5", + "tailwindcss": "^4.1.4", + "vue": "^3.5.13", "vue-router": "^4.2.5" }, "devDependencies": { diff --git a/vite-tailwindcss/pnpm-lock.yaml b/vite-tailwindcss/pnpm-lock.yaml index feb7113..b534f54 100644 --- a/vite-tailwindcss/pnpm-lock.yaml +++ b/vite-tailwindcss/pnpm-lock.yaml @@ -26,6 +26,9 @@ importers: ant-design-vue: specifier: ^4.1.1 version: 4.2.6(vue@3.5.40) + aos: + specifier: ^2.3.4 + version: 2.3.4 axios: specifier: ^1.6.2 version: 1.18.1(debug@4.4.3) @@ -678,6 +681,9 @@ packages: peerDependencies: vue: '>=3.2.0' + aos@2.3.4: + resolution: {integrity: sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==} + array-tree-filter@2.1.0: resolution: {integrity: sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw==} @@ -698,6 +704,9 @@ packages: resolution: {integrity: sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==} engines: {node: '>= 20.19.0'} + classlist-polyfill@1.2.0: + resolution: {integrity: sha512-GzIjNdcEtH4ieA2S8NmrSxv7DfEV5fmixQeyTmqmRmRJPGpRBaSnA2a0VrCjyT8iW8JjEdMbKzDotAJf+ajgaQ==} + combined-stream@1.0.8: resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==} engines: {node: '>= 0.8'} @@ -936,6 +945,12 @@ packages: lodash-es@4.18.1: resolution: {integrity: sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==} + lodash.debounce@4.0.8: + resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==} + + lodash.throttle@4.1.1: + resolution: {integrity: sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==} + lodash@4.18.1: resolution: {integrity: sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==} @@ -1619,6 +1634,12 @@ snapshots: vue-types: 3.0.2(vue@3.5.40) warning: 4.0.3 + aos@2.3.4: + dependencies: + classlist-polyfill: 1.2.0 + lodash.debounce: 4.0.8 + lodash.throttle: 4.1.1 + array-tree-filter@2.1.0: {} async-validator@4.2.5: {} @@ -1644,6 +1665,8 @@ snapshots: dependencies: readdirp: 5.0.0 + classlist-polyfill@1.2.0: {} + combined-stream@1.0.8: dependencies: delayed-stream: 1.0.0 @@ -1856,6 +1879,10 @@ snapshots: lodash-es@4.18.1: {} + lodash.debounce@4.0.8: {} + + lodash.throttle@4.1.1: {} + lodash@4.18.1: {} loose-envify@1.4.0: diff --git a/vite-tailwindcss/pnpm-workspace.yaml b/vite-tailwindcss/pnpm-workspace.yaml index ee14c69..e902f81 100644 --- a/vite-tailwindcss/pnpm-workspace.yaml +++ b/vite-tailwindcss/pnpm-workspace.yaml @@ -1,5 +1,5 @@ allowBuilds: - '@parcel/watcher': set this to true or false - core-js: set this to true or false - esbuild: set this to true or false - vue-demi: set this to true or false + '@parcel/watcher': true + core-js: true + esbuild: true + vue-demi: true diff --git a/vite-tailwindcss/src/components/CanvasEffects.vue b/vite-tailwindcss/src/components/CanvasEffects.vue index 8ff8ac7..b60c3d6 100644 --- a/vite-tailwindcss/src/components/CanvasEffects.vue +++ b/vite-tailwindcss/src/components/CanvasEffects.vue @@ -167,11 +167,11 @@ onUnmounted(() => { diff --git a/vite-tailwindcss/src/components/PhotoGallery.vue b/vite-tailwindcss/src/components/PhotoGallery.vue index c9ab4f3..d708a27 100644 --- a/vite-tailwindcss/src/components/PhotoGallery.vue +++ b/vite-tailwindcss/src/components/PhotoGallery.vue @@ -37,8 +37,13 @@ -
-
+
@@ -144,15 +149,19 @@ function polaroidTransform(i) { .gallery-subtitle { font-family: var(--font-display); } .gallery-desc { font-family: var(--font-kai); } -.nine-grid-reveal.reveal { - transform: translate3d(0, 12px, 0); - transition: - opacity 420ms ease-out, - transform 420ms cubic-bezier(0.22, 1, 0.36, 1); +.nine-grid-reveal { + opacity: 1; + transform: translate3d(0, 0, 0); +} +[data-aos='nine-grid-zoom'] { + opacity: 0; + transform: translate3d(0, 10px, 0) scale(0.94); + transition-property: opacity, transform; will-change: opacity, transform; } -.nine-grid-reveal.reveal--in { - transform: translate3d(0, 0, 0); +[data-aos='nine-grid-zoom'].aos-animate { + opacity: 1; + transform: translate3d(0, 0, 0) scale(1); } .nine-grid-img { width: 100%; diff --git a/vite-tailwindcss/src/main.js b/vite-tailwindcss/src/main.js index be13f1b..228d21e 100644 --- a/vite-tailwindcss/src/main.js +++ b/vite-tailwindcss/src/main.js @@ -4,6 +4,7 @@ import Antd from 'ant-design-vue' import './style.css' import './styles/animations.css' import './styles/frames.css' +import 'aos/dist/aos.css' import App from './App.vue' import '@fortawesome/fontawesome-free/css/all.css' // 引入所有样式 // 注册路由 diff --git a/vite-tailwindcss/src/views/index/index.vue b/vite-tailwindcss/src/views/index/index.vue index 5fb7aec..e1d30d5 100644 --- a/vite-tailwindcss/src/views/index/index.vue +++ b/vite-tailwindcss/src/views/index/index.vue @@ -1,5 +1,5 @@