mirror of
https://github.com/reonokiy/blog.nokiy.net.git
synced 2025-06-15 11:12:54 +02:00
refactor: replace css fade animations with gsap, optimize post page animations and mobile responsiveness
This commit is contained in:
parent
90c2099fec
commit
db4aa56987
9 changed files with 239 additions and 211 deletions
81
.vscode/settings.json
vendored
81
.vscode/settings.json
vendored
|
@ -57,84 +57,5 @@
|
||||||
"typescript.tsdk": "node_modules/typescript/lib",
|
"typescript.tsdk": "node_modules/typescript/lib",
|
||||||
"files.associations": {
|
"files.associations": {
|
||||||
"*.mdx": "markdown"
|
"*.mdx": "markdown"
|
||||||
},
|
}
|
||||||
"cSpell.words": [
|
|
||||||
"abbrlink",
|
|
||||||
"antfu",
|
|
||||||
"apiflash",
|
|
||||||
"apos",
|
|
||||||
"Artículos",
|
|
||||||
"astrodotbuild",
|
|
||||||
"astrojs",
|
|
||||||
"attributify",
|
|
||||||
"backref",
|
|
||||||
"belleza",
|
|
||||||
"Beze",
|
|
||||||
"Blockquotes",
|
|
||||||
"blurhash",
|
|
||||||
"bmoji",
|
|
||||||
"canvaskit",
|
|
||||||
"Cpath",
|
|
||||||
"Csvg",
|
|
||||||
"Disqus",
|
|
||||||
"Etiquetas",
|
|
||||||
"figcaption",
|
|
||||||
"Frontmatter",
|
|
||||||
"Fuwriu",
|
|
||||||
"Giscus",
|
|
||||||
"GSAP",
|
|
||||||
"gtag",
|
|
||||||
"hètí",
|
|
||||||
"Heti",
|
|
||||||
"katex",
|
|
||||||
"Lightbox",
|
|
||||||
"Macbook",
|
|
||||||
"mdast",
|
|
||||||
"Moeyua",
|
|
||||||
"msrc",
|
|
||||||
"msvalidate",
|
|
||||||
"noopener",
|
|
||||||
"noreferrer",
|
|
||||||
"Noto",
|
|
||||||
"oklch",
|
|
||||||
"opengraph",
|
|
||||||
"overlayscrollbars",
|
|
||||||
"pagefind",
|
|
||||||
"partytown",
|
|
||||||
"photoswipe",
|
|
||||||
"pswp",
|
|
||||||
"radishzz",
|
|
||||||
"rashomon",
|
|
||||||
"rehype",
|
|
||||||
"reimagines",
|
|
||||||
"Retipografía",
|
|
||||||
"Retypeset",
|
|
||||||
"Reviviendo",
|
|
||||||
"Roundhand",
|
|
||||||
"Segoe",
|
|
||||||
"Sentimentalisme",
|
|
||||||
"Servetus",
|
|
||||||
"shiki",
|
|
||||||
"Sobre",
|
|
||||||
"srcset",
|
|
||||||
"STIX",
|
|
||||||
"stylesheet",
|
|
||||||
"tipográfica",
|
|
||||||
"titlebar",
|
|
||||||
"Twikoo",
|
|
||||||
"Umami",
|
|
||||||
"unocss",
|
|
||||||
"unpic",
|
|
||||||
"vite",
|
|
||||||
"waline",
|
|
||||||
"walinejs",
|
|
||||||
"weibo",
|
|
||||||
"Возрождая",
|
|
||||||
"красоту",
|
|
||||||
"Переверстка",
|
|
||||||
"Посты",
|
|
||||||
"себе",
|
|
||||||
"Теги",
|
|
||||||
"типографики"
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,6 +22,7 @@
|
||||||
"astro-robots-txt": "^1.0.0",
|
"astro-robots-txt": "^1.0.0",
|
||||||
"canvaskit-wasm": "^0.40.0",
|
"canvaskit-wasm": "^0.40.0",
|
||||||
"feed": "^5.0.1",
|
"feed": "^5.0.1",
|
||||||
|
"gsap": "^3.13.0",
|
||||||
"katex": "^0.16.22",
|
"katex": "^0.16.22",
|
||||||
"markdown-it": "^14.1.0",
|
"markdown-it": "^14.1.0",
|
||||||
"mdast-util-to-string": "^4.0.0",
|
"mdast-util-to-string": "^4.0.0",
|
||||||
|
|
206
pnpm-lock.yaml
generated
206
pnpm-lock.yaml
generated
|
@ -10,7 +10,7 @@ importers:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@astrojs/mdx':
|
'@astrojs/mdx':
|
||||||
specifier: ^4.2.6
|
specifier: ^4.2.6
|
||||||
version: 4.2.6(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))
|
version: 4.2.6(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))
|
||||||
'@astrojs/partytown':
|
'@astrojs/partytown':
|
||||||
specifier: ^2.1.4
|
specifier: ^2.1.4
|
||||||
version: 2.1.4
|
version: 2.1.4
|
||||||
|
@ -19,10 +19,10 @@ importers:
|
||||||
version: 3.4.0
|
version: 3.4.0
|
||||||
astro:
|
astro:
|
||||||
specifier: ^5.7.13
|
specifier: ^5.7.13
|
||||||
version: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
version: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
||||||
astro-og-canvas:
|
astro-og-canvas:
|
||||||
specifier: ^0.7.0
|
specifier: ^0.7.0
|
||||||
version: 0.7.0(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))
|
version: 0.7.0(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))
|
||||||
astro-robots-txt:
|
astro-robots-txt:
|
||||||
specifier: ^1.0.0
|
specifier: ^1.0.0
|
||||||
version: 1.0.0
|
version: 1.0.0
|
||||||
|
@ -32,6 +32,9 @@ importers:
|
||||||
feed:
|
feed:
|
||||||
specifier: ^5.0.1
|
specifier: ^5.0.1
|
||||||
version: 5.0.1
|
version: 5.0.1
|
||||||
|
gsap:
|
||||||
|
specifier: ^3.13.0
|
||||||
|
version: 3.13.0
|
||||||
katex:
|
katex:
|
||||||
specifier: ^0.16.22
|
specifier: ^0.16.22
|
||||||
version: 0.16.22
|
version: 0.16.22
|
||||||
|
@ -829,103 +832,103 @@ packages:
|
||||||
rollup:
|
rollup:
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-android-arm-eabi@4.40.2':
|
'@rollup/rollup-android-arm-eabi@4.41.0':
|
||||||
resolution: {integrity: sha512-JkdNEq+DFxZfUwxvB58tHMHBHVgX23ew41g1OQinthJ+ryhdRk67O31S7sYw8u2lTjHUPFxwar07BBt1KHp/hg==}
|
resolution: {integrity: sha512-KxN+zCjOYHGwCl4UCtSfZ6jrq/qi88JDUtiEFk8LELEHq2Egfc/FgW+jItZiOLRuQfb/3xJSgFuNPC9jzggX+A==}
|
||||||
cpu: [arm]
|
cpu: [arm]
|
||||||
os: [android]
|
os: [android]
|
||||||
|
|
||||||
'@rollup/rollup-android-arm64@4.40.2':
|
'@rollup/rollup-android-arm64@4.41.0':
|
||||||
resolution: {integrity: sha512-13unNoZ8NzUmnndhPTkWPWbX3vtHodYmy+I9kuLxN+F+l+x3LdVF7UCu8TWVMt1POHLh6oDHhnOA04n8oJZhBw==}
|
resolution: {integrity: sha512-yDvqx3lWlcugozax3DItKJI5j05B0d4Kvnjx+5mwiUpWramVvmAByYigMplaoAQ3pvdprGCTCE03eduqE/8mPQ==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [android]
|
os: [android]
|
||||||
|
|
||||||
'@rollup/rollup-darwin-arm64@4.40.2':
|
'@rollup/rollup-darwin-arm64@4.41.0':
|
||||||
resolution: {integrity: sha512-Gzf1Hn2Aoe8VZzevHostPX23U7N5+4D36WJNHK88NZHCJr7aVMG4fadqkIf72eqVPGjGc0HJHNuUaUcxiR+N/w==}
|
resolution: {integrity: sha512-2KOU574vD3gzcPSjxO0eyR5iWlnxxtmW1F5CkNOHmMlueKNCQkxR6+ekgWyVnz6zaZihpUNkGxjsYrkTJKhkaw==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [darwin]
|
os: [darwin]
|
||||||
|
|
||||||
'@rollup/rollup-darwin-x64@4.40.2':
|
'@rollup/rollup-darwin-x64@4.41.0':
|
||||||
resolution: {integrity: sha512-47N4hxa01a4x6XnJoskMKTS8XZ0CZMd8YTbINbi+w03A2w4j1RTlnGHOz/P0+Bg1LaVL6ufZyNprSg+fW5nYQQ==}
|
resolution: {integrity: sha512-gE5ACNSxHcEZyP2BA9TuTakfZvULEW4YAOtxl/A/YDbIir/wPKukde0BNPlnBiP88ecaN4BJI2TtAd+HKuZPQQ==}
|
||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [darwin]
|
os: [darwin]
|
||||||
|
|
||||||
'@rollup/rollup-freebsd-arm64@4.40.2':
|
'@rollup/rollup-freebsd-arm64@4.41.0':
|
||||||
resolution: {integrity: sha512-8t6aL4MD+rXSHHZUR1z19+9OFJ2rl1wGKvckN47XFRVO+QL/dUSpKA2SLRo4vMg7ELA8pzGpC+W9OEd1Z/ZqoQ==}
|
resolution: {integrity: sha512-GSxU6r5HnWij7FoSo7cZg3l5GPg4HFLkzsFFh0N/b16q5buW1NAWuCJ+HMtIdUEi6XF0qH+hN0TEd78laRp7Dg==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [freebsd]
|
os: [freebsd]
|
||||||
|
|
||||||
'@rollup/rollup-freebsd-x64@4.40.2':
|
'@rollup/rollup-freebsd-x64@4.41.0':
|
||||||
resolution: {integrity: sha512-C+AyHBzfpsOEYRFjztcYUFsH4S7UsE9cDtHCtma5BK8+ydOZYgMmWg1d/4KBytQspJCld8ZIujFMAdKG1xyr4Q==}
|
resolution: {integrity: sha512-KGiGKGDg8qLRyOWmk6IeiHJzsN/OYxO6nSbT0Vj4MwjS2XQy/5emsmtoqLAabqrohbgLWJ5GV3s/ljdrIr8Qjg==}
|
||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [freebsd]
|
os: [freebsd]
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm-gnueabihf@4.40.2':
|
'@rollup/rollup-linux-arm-gnueabihf@4.41.0':
|
||||||
resolution: {integrity: sha512-de6TFZYIvJwRNjmW3+gaXiZ2DaWL5D5yGmSYzkdzjBDS3W+B9JQ48oZEsmMvemqjtAFzE16DIBLqd6IQQRuG9Q==}
|
resolution: {integrity: sha512-46OzWeqEVQyX3N2/QdiU/CMXYDH/lSHpgfBkuhl3igpZiaB3ZIfSjKuOnybFVBQzjsLwkus2mjaESy8H41SzvA==}
|
||||||
cpu: [arm]
|
cpu: [arm]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm-musleabihf@4.40.2':
|
'@rollup/rollup-linux-arm-musleabihf@4.41.0':
|
||||||
resolution: {integrity: sha512-urjaEZubdIkacKc930hUDOfQPysezKla/O9qV+O89enqsqUmQm8Xj8O/vh0gHg4LYfv7Y7UsE3QjzLQzDYN1qg==}
|
resolution: {integrity: sha512-lfgW3KtQP4YauqdPpcUZHPcqQXmTmH4nYU0cplNeW583CMkAGjtImw4PKli09NFi2iQgChk4e9erkwlfYem6Lg==}
|
||||||
cpu: [arm]
|
cpu: [arm]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm64-gnu@4.40.2':
|
'@rollup/rollup-linux-arm64-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-KlE8IC0HFOC33taNt1zR8qNlBYHj31qGT1UqWqtvR/+NuCVhfufAq9fxO8BMFC22Wu0rxOwGVWxtCMvZVLmhQg==}
|
resolution: {integrity: sha512-nn8mEyzMbdEJzT7cwxgObuwviMx6kPRxzYiOl6o/o+ChQq23gfdlZcUNnt89lPhhz3BYsZ72rp0rxNqBSfqlqw==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm64-musl@4.40.2':
|
'@rollup/rollup-linux-arm64-musl@4.41.0':
|
||||||
resolution: {integrity: sha512-j8CgxvfM0kbnhu4XgjnCWJQyyBOeBI1Zq91Z850aUddUmPeQvuAy6OiMdPS46gNFgy8gN1xkYyLgwLYZG3rBOg==}
|
resolution: {integrity: sha512-l+QK99je2zUKGd31Gh+45c4pGDAqZSuWQiuRFCdHYC2CSiO47qUWsCcenrI6p22hvHZrDje9QjwSMAFL3iwXwQ==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-loongarch64-gnu@4.40.2':
|
'@rollup/rollup-linux-loongarch64-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-Ybc/1qUampKuRF4tQXc7G7QY9YRyeVSykfK36Y5Qc5dmrIxwFhrOzqaVTNoZygqZ1ZieSWTibfFhQ5qK8jpWxw==}
|
resolution: {integrity: sha512-WbnJaxPv1gPIm6S8O/Wg+wfE/OzGSXlBMbOe4ie+zMyykMOeqmgD1BhPxZQuDqwUN+0T/xOFtL2RUWBspnZj3w==}
|
||||||
cpu: [loong64]
|
cpu: [loong64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-powerpc64le-gnu@4.40.2':
|
'@rollup/rollup-linux-powerpc64le-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-3FCIrnrt03CCsZqSYAOW/k9n625pjpuMzVfeI+ZBUSDT3MVIFDSPfSUgIl9FqUftxcUXInvFah79hE1c9abD+Q==}
|
resolution: {integrity: sha512-eRDWR5t67/b2g8Q/S8XPi0YdbKcCs4WQ8vklNnUYLaSWF+Cbv2axZsp4jni6/j7eKvMLYCYdcsv8dcU+a6QNFg==}
|
||||||
cpu: [ppc64]
|
cpu: [ppc64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-riscv64-gnu@4.40.2':
|
'@rollup/rollup-linux-riscv64-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-QNU7BFHEvHMp2ESSY3SozIkBPaPBDTsfVNGx3Xhv+TdvWXFGOSH2NJvhD1zKAT6AyuuErJgbdvaJhYVhVqrWTg==}
|
resolution: {integrity: sha512-TWrZb6GF5jsEKG7T1IHwlLMDRy2f3DPqYldmIhnA2DVqvvhY2Ai184vZGgahRrg8k9UBWoSlHv+suRfTN7Ua4A==}
|
||||||
cpu: [riscv64]
|
cpu: [riscv64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-riscv64-musl@4.40.2':
|
'@rollup/rollup-linux-riscv64-musl@4.41.0':
|
||||||
resolution: {integrity: sha512-5W6vNYkhgfh7URiXTO1E9a0cy4fSgfE4+Hl5agb/U1sa0kjOLMLC1wObxwKxecE17j0URxuTrYZZME4/VH57Hg==}
|
resolution: {integrity: sha512-ieQljaZKuJpmWvd8gW87ZmSFwid6AxMDk5bhONJ57U8zT77zpZ/TPKkU9HpnnFrM4zsgr4kiGuzbIbZTGi7u9A==}
|
||||||
cpu: [riscv64]
|
cpu: [riscv64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-s390x-gnu@4.40.2':
|
'@rollup/rollup-linux-s390x-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-B7LKIz+0+p348JoAL4X/YxGx9zOx3sR+o6Hj15Y3aaApNfAshK8+mWZEf759DXfRLeL2vg5LYJBB7DdcleYCoQ==}
|
resolution: {integrity: sha512-/L3pW48SxrWAlVsKCN0dGLB2bi8Nv8pr5S5ocSM+S0XCn5RCVCXqi8GVtHFsOBBCSeR+u9brV2zno5+mg3S4Aw==}
|
||||||
cpu: [s390x]
|
cpu: [s390x]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-x64-gnu@4.40.2':
|
'@rollup/rollup-linux-x64-gnu@4.41.0':
|
||||||
resolution: {integrity: sha512-lG7Xa+BmBNwpjmVUbmyKxdQJ3Q6whHjMjzQplOs5Z+Gj7mxPtWakGHqzMqNER68G67kmCX9qX57aRsW5V0VOng==}
|
resolution: {integrity: sha512-XMLeKjyH8NsEDCRptf6LO8lJk23o9wvB+dJwcXMaH6ZQbbkHu2dbGIUindbMtRN6ux1xKi16iXWu6q9mu7gDhQ==}
|
||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-linux-x64-musl@4.40.2':
|
'@rollup/rollup-linux-x64-musl@4.41.0':
|
||||||
resolution: {integrity: sha512-tD46wKHd+KJvsmije4bUskNuvWKFcTOIM9tZ/RrmIvcXnbi0YK/cKS9FzFtAm7Oxi2EhV5N2OpfFB348vSQRXA==}
|
resolution: {integrity: sha512-m/P7LycHZTvSQeXhFmgmdqEiTqSV80zn6xHaQ1JSqwCtD1YGtwEK515Qmy9DcB2HK4dOUVypQxvhVSy06cJPEg==}
|
||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [linux]
|
os: [linux]
|
||||||
|
|
||||||
'@rollup/rollup-win32-arm64-msvc@4.40.2':
|
'@rollup/rollup-win32-arm64-msvc@4.41.0':
|
||||||
resolution: {integrity: sha512-Bjv/HG8RRWLNkXwQQemdsWw4Mg+IJ29LK+bJPW2SCzPKOUaMmPEppQlu/Fqk1d7+DX3V7JbFdbkh/NMmurT6Pg==}
|
resolution: {integrity: sha512-4yodtcOrFHpbomJGVEqZ8fzD4kfBeCbpsUy5Pqk4RluXOdsWdjLnjhiKy2w3qzcASWd04fp52Xz7JKarVJ5BTg==}
|
||||||
cpu: [arm64]
|
cpu: [arm64]
|
||||||
os: [win32]
|
os: [win32]
|
||||||
|
|
||||||
'@rollup/rollup-win32-ia32-msvc@4.40.2':
|
'@rollup/rollup-win32-ia32-msvc@4.41.0':
|
||||||
resolution: {integrity: sha512-dt1llVSGEsGKvzeIO76HToiYPNPYPkmjhMHhP00T9S4rDern8P2ZWvWAQUEJ+R1UdMWJ/42i/QqJ2WV765GZcA==}
|
resolution: {integrity: sha512-tmazCrAsKzdkXssEc65zIE1oC6xPHwfy9d5Ta25SRCDOZS+I6RypVVShWALNuU9bxIfGA0aqrmzlzoM5wO5SPQ==}
|
||||||
cpu: [ia32]
|
cpu: [ia32]
|
||||||
os: [win32]
|
os: [win32]
|
||||||
|
|
||||||
'@rollup/rollup-win32-x64-msvc@4.40.2':
|
'@rollup/rollup-win32-x64-msvc@4.41.0':
|
||||||
resolution: {integrity: sha512-bwspbWB04XJpeElvsp+DCylKfF4trJDa2Y9Go8O6A7YLX2LIKGcNK/CYImJN6ZP4DcuOHB4Utl3iCbnR62DudA==}
|
resolution: {integrity: sha512-h1J+Yzjo/X+0EAvR2kIXJDuTuyT7drc+t2ALY0nIcGPbTatNOf0VWdhEA2Z4AAjv6X1NJV7SYo5oCTYRJhSlVA==}
|
||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [win32]
|
os: [win32]
|
||||||
|
|
||||||
|
@ -1903,8 +1906,8 @@ packages:
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
eslint: '>=8'
|
eslint: '>=8'
|
||||||
|
|
||||||
eslint-plugin-import-x@4.11.1:
|
eslint-plugin-import-x@4.12.2:
|
||||||
resolution: {integrity: sha512-CiqREASJRnhwCB0NujkTdo4jU+cJAnhQrd4aCnWC1o+rYWIWakVbyuzVbnCriUUSLAnn5CoJ2ob36TEgNzejBQ==}
|
resolution: {integrity: sha512-0jVUgJQipbs0yUfLe7LwYD6p8rIGqCysWZdyJFgkPzDyJgiKpuCaXlywKUAWgJ6u1nLpfrdt21B60OUkupyBrQ==}
|
||||||
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
|
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
eslint: ^8.57.0 || ^9.0.0
|
eslint: ^8.57.0 || ^9.0.0
|
||||||
|
@ -2194,6 +2197,9 @@ packages:
|
||||||
graphemer@1.4.0:
|
graphemer@1.4.0:
|
||||||
resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
|
resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
|
||||||
|
|
||||||
|
gsap@3.13.0:
|
||||||
|
resolution: {integrity: sha512-QL7MJ2WMjm1PHWsoFrAQH/J8wUeqZvMtHO58qdekHpCfhvhSL4gSiz6vJf5EeMP0LOn3ZCprL2ki/gjED8ghVw==}
|
||||||
|
|
||||||
gzip-size@6.0.0:
|
gzip-size@6.0.0:
|
||||||
resolution: {integrity: sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==}
|
resolution: {integrity: sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==}
|
||||||
engines: {node: '>=10'}
|
engines: {node: '>=10'}
|
||||||
|
@ -3181,8 +3187,8 @@ packages:
|
||||||
rfdc@1.4.1:
|
rfdc@1.4.1:
|
||||||
resolution: {integrity: sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==}
|
resolution: {integrity: sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==}
|
||||||
|
|
||||||
rollup@4.40.2:
|
rollup@4.41.0:
|
||||||
resolution: {integrity: sha512-tfUOg6DTP4rhQ3VjOO6B4wyrJnGOX85requAXvqYTHsOgb2TFJdZ3aWpT8W2kPoypSGP7dZUyzxJ9ee4buM5Fg==}
|
resolution: {integrity: sha512-HqMFpUbWlf/tvcxBFNKnJyzc7Lk+XO3FGc3pbNBLqEbOz0gPLRgcrlS3UF4MfUrVlstOaP/q0kM6GVvi+LrLRg==}
|
||||||
engines: {node: '>=18.0.0', npm: '>=8.0.0'}
|
engines: {node: '>=18.0.0', npm: '>=8.0.0'}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
|
@ -3956,7 +3962,7 @@ snapshots:
|
||||||
eslint-merge-processors: 2.0.0(eslint@9.27.0(jiti@2.4.2))
|
eslint-merge-processors: 2.0.0(eslint@9.27.0(jiti@2.4.2))
|
||||||
eslint-plugin-antfu: 3.1.1(eslint@9.27.0(jiti@2.4.2))
|
eslint-plugin-antfu: 3.1.1(eslint@9.27.0(jiti@2.4.2))
|
||||||
eslint-plugin-command: 3.2.0(eslint@9.27.0(jiti@2.4.2))
|
eslint-plugin-command: 3.2.0(eslint@9.27.0(jiti@2.4.2))
|
||||||
eslint-plugin-import-x: 4.11.1(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3)
|
eslint-plugin-import-x: 4.12.2(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3)
|
||||||
eslint-plugin-jsdoc: 50.6.17(eslint@9.27.0(jiti@2.4.2))
|
eslint-plugin-jsdoc: 50.6.17(eslint@9.27.0(jiti@2.4.2))
|
||||||
eslint-plugin-jsonc: 2.20.1(eslint@9.27.0(jiti@2.4.2))
|
eslint-plugin-jsonc: 2.20.1(eslint@9.27.0(jiti@2.4.2))
|
||||||
eslint-plugin-n: 17.18.0(eslint@9.27.0(jiti@2.4.2))
|
eslint-plugin-n: 17.18.0(eslint@9.27.0(jiti@2.4.2))
|
||||||
|
@ -4059,12 +4065,12 @@ snapshots:
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- supports-color
|
- supports-color
|
||||||
|
|
||||||
'@astrojs/mdx@4.2.6(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))':
|
'@astrojs/mdx@4.2.6(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0))':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@astrojs/markdown-remark': 6.3.1
|
'@astrojs/markdown-remark': 6.3.1
|
||||||
'@mdx-js/mdx': 3.1.0(acorn@8.14.1)
|
'@mdx-js/mdx': 3.1.0(acorn@8.14.1)
|
||||||
acorn: 8.14.1
|
acorn: 8.14.1
|
||||||
astro: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
astro: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
||||||
es-module-lexer: 1.7.0
|
es-module-lexer: 1.7.0
|
||||||
estree-util-visit: 2.0.0
|
estree-util-visit: 2.0.0
|
||||||
hast-util-to-html: 9.0.5
|
hast-util-to-html: 9.0.5
|
||||||
|
@ -4612,72 +4618,72 @@ snapshots:
|
||||||
dependencies:
|
dependencies:
|
||||||
dotenv: 16.5.0
|
dotenv: 16.5.0
|
||||||
|
|
||||||
'@rollup/pluginutils@5.1.4(rollup@4.40.2)':
|
'@rollup/pluginutils@5.1.4(rollup@4.41.0)':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@types/estree': 1.0.7
|
'@types/estree': 1.0.7
|
||||||
estree-walker: 2.0.2
|
estree-walker: 2.0.2
|
||||||
picomatch: 4.0.2
|
picomatch: 4.0.2
|
||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
rollup: 4.40.2
|
rollup: 4.41.0
|
||||||
|
|
||||||
'@rollup/rollup-android-arm-eabi@4.40.2':
|
'@rollup/rollup-android-arm-eabi@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-android-arm64@4.40.2':
|
'@rollup/rollup-android-arm64@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-darwin-arm64@4.40.2':
|
'@rollup/rollup-darwin-arm64@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-darwin-x64@4.40.2':
|
'@rollup/rollup-darwin-x64@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-freebsd-arm64@4.40.2':
|
'@rollup/rollup-freebsd-arm64@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-freebsd-x64@4.40.2':
|
'@rollup/rollup-freebsd-x64@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm-gnueabihf@4.40.2':
|
'@rollup/rollup-linux-arm-gnueabihf@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm-musleabihf@4.40.2':
|
'@rollup/rollup-linux-arm-musleabihf@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm64-gnu@4.40.2':
|
'@rollup/rollup-linux-arm64-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-arm64-musl@4.40.2':
|
'@rollup/rollup-linux-arm64-musl@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-loongarch64-gnu@4.40.2':
|
'@rollup/rollup-linux-loongarch64-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-powerpc64le-gnu@4.40.2':
|
'@rollup/rollup-linux-powerpc64le-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-riscv64-gnu@4.40.2':
|
'@rollup/rollup-linux-riscv64-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-riscv64-musl@4.40.2':
|
'@rollup/rollup-linux-riscv64-musl@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-s390x-gnu@4.40.2':
|
'@rollup/rollup-linux-s390x-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-x64-gnu@4.40.2':
|
'@rollup/rollup-linux-x64-gnu@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-linux-x64-musl@4.40.2':
|
'@rollup/rollup-linux-x64-musl@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-win32-arm64-msvc@4.40.2':
|
'@rollup/rollup-win32-arm64-msvc@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-win32-ia32-msvc@4.40.2':
|
'@rollup/rollup-win32-ia32-msvc@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@rollup/rollup-win32-x64-msvc@4.40.2':
|
'@rollup/rollup-win32-x64-msvc@4.41.0':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
'@shikijs/core@3.4.2':
|
'@shikijs/core@3.4.2':
|
||||||
|
@ -5349,9 +5355,9 @@ snapshots:
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- supports-color
|
- supports-color
|
||||||
|
|
||||||
astro-og-canvas@0.7.0(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)):
|
astro-og-canvas@0.7.0(astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)):
|
||||||
dependencies:
|
dependencies:
|
||||||
astro: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
astro: 5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0)
|
||||||
canvaskit-wasm: 0.39.1
|
canvaskit-wasm: 0.39.1
|
||||||
deterministic-object-hash: 2.0.2
|
deterministic-object-hash: 2.0.2
|
||||||
entities: 4.5.0
|
entities: 4.5.0
|
||||||
|
@ -5361,7 +5367,7 @@ snapshots:
|
||||||
valid-filename: 4.0.0
|
valid-filename: 4.0.0
|
||||||
zod: 3.24.4
|
zod: 3.24.4
|
||||||
|
|
||||||
astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.40.2)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0):
|
astro@5.7.13(@types/node@22.15.18)(jiti@2.4.2)(lightningcss@1.29.3)(rollup@4.41.0)(terser@5.39.0)(typescript@5.8.3)(yaml@2.8.0):
|
||||||
dependencies:
|
dependencies:
|
||||||
'@astrojs/compiler': 2.12.0
|
'@astrojs/compiler': 2.12.0
|
||||||
'@astrojs/internal-helpers': 0.6.1
|
'@astrojs/internal-helpers': 0.6.1
|
||||||
|
@ -5369,7 +5375,7 @@ snapshots:
|
||||||
'@astrojs/telemetry': 3.2.1
|
'@astrojs/telemetry': 3.2.1
|
||||||
'@capsizecss/unpack': 2.4.0
|
'@capsizecss/unpack': 2.4.0
|
||||||
'@oslojs/encoding': 1.1.0
|
'@oslojs/encoding': 1.1.0
|
||||||
'@rollup/pluginutils': 5.1.4(rollup@4.40.2)
|
'@rollup/pluginutils': 5.1.4(rollup@4.41.0)
|
||||||
acorn: 8.14.1
|
acorn: 8.14.1
|
||||||
aria-query: 5.3.2
|
aria-query: 5.3.2
|
||||||
axobject-query: 4.1.0
|
axobject-query: 4.1.0
|
||||||
|
@ -5901,7 +5907,7 @@ snapshots:
|
||||||
eslint: 9.27.0(jiti@2.4.2)
|
eslint: 9.27.0(jiti@2.4.2)
|
||||||
eslint-compat-utils: 0.5.1(eslint@9.27.0(jiti@2.4.2))
|
eslint-compat-utils: 0.5.1(eslint@9.27.0(jiti@2.4.2))
|
||||||
|
|
||||||
eslint-plugin-import-x@4.11.1(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3):
|
eslint-plugin-import-x@4.12.2(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3):
|
||||||
dependencies:
|
dependencies:
|
||||||
'@typescript-eslint/utils': 8.32.1(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3)
|
'@typescript-eslint/utils': 8.32.1(eslint@9.27.0(jiti@2.4.2))(typescript@5.8.3)
|
||||||
comment-parser: 1.4.1
|
comment-parser: 1.4.1
|
||||||
|
@ -6287,6 +6293,8 @@ snapshots:
|
||||||
|
|
||||||
graphemer@1.4.0: {}
|
graphemer@1.4.0: {}
|
||||||
|
|
||||||
|
gsap@3.13.0: {}
|
||||||
|
|
||||||
gzip-size@6.0.0:
|
gzip-size@6.0.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
duplexer: 0.1.2
|
duplexer: 0.1.2
|
||||||
|
@ -7729,30 +7737,30 @@ snapshots:
|
||||||
|
|
||||||
rfdc@1.4.1: {}
|
rfdc@1.4.1: {}
|
||||||
|
|
||||||
rollup@4.40.2:
|
rollup@4.41.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@types/estree': 1.0.7
|
'@types/estree': 1.0.7
|
||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
'@rollup/rollup-android-arm-eabi': 4.40.2
|
'@rollup/rollup-android-arm-eabi': 4.41.0
|
||||||
'@rollup/rollup-android-arm64': 4.40.2
|
'@rollup/rollup-android-arm64': 4.41.0
|
||||||
'@rollup/rollup-darwin-arm64': 4.40.2
|
'@rollup/rollup-darwin-arm64': 4.41.0
|
||||||
'@rollup/rollup-darwin-x64': 4.40.2
|
'@rollup/rollup-darwin-x64': 4.41.0
|
||||||
'@rollup/rollup-freebsd-arm64': 4.40.2
|
'@rollup/rollup-freebsd-arm64': 4.41.0
|
||||||
'@rollup/rollup-freebsd-x64': 4.40.2
|
'@rollup/rollup-freebsd-x64': 4.41.0
|
||||||
'@rollup/rollup-linux-arm-gnueabihf': 4.40.2
|
'@rollup/rollup-linux-arm-gnueabihf': 4.41.0
|
||||||
'@rollup/rollup-linux-arm-musleabihf': 4.40.2
|
'@rollup/rollup-linux-arm-musleabihf': 4.41.0
|
||||||
'@rollup/rollup-linux-arm64-gnu': 4.40.2
|
'@rollup/rollup-linux-arm64-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-arm64-musl': 4.40.2
|
'@rollup/rollup-linux-arm64-musl': 4.41.0
|
||||||
'@rollup/rollup-linux-loongarch64-gnu': 4.40.2
|
'@rollup/rollup-linux-loongarch64-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-powerpc64le-gnu': 4.40.2
|
'@rollup/rollup-linux-powerpc64le-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-riscv64-gnu': 4.40.2
|
'@rollup/rollup-linux-riscv64-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-riscv64-musl': 4.40.2
|
'@rollup/rollup-linux-riscv64-musl': 4.41.0
|
||||||
'@rollup/rollup-linux-s390x-gnu': 4.40.2
|
'@rollup/rollup-linux-s390x-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-x64-gnu': 4.40.2
|
'@rollup/rollup-linux-x64-gnu': 4.41.0
|
||||||
'@rollup/rollup-linux-x64-musl': 4.40.2
|
'@rollup/rollup-linux-x64-musl': 4.41.0
|
||||||
'@rollup/rollup-win32-arm64-msvc': 4.40.2
|
'@rollup/rollup-win32-arm64-msvc': 4.41.0
|
||||||
'@rollup/rollup-win32-ia32-msvc': 4.40.2
|
'@rollup/rollup-win32-ia32-msvc': 4.41.0
|
||||||
'@rollup/rollup-win32-x64-msvc': 4.40.2
|
'@rollup/rollup-win32-x64-msvc': 4.41.0
|
||||||
fsevents: 2.3.3
|
fsevents: 2.3.3
|
||||||
|
|
||||||
run-parallel@1.2.0:
|
run-parallel@1.2.0:
|
||||||
|
@ -8266,7 +8274,7 @@ snapshots:
|
||||||
fdir: 6.4.4(picomatch@4.0.2)
|
fdir: 6.4.4(picomatch@4.0.2)
|
||||||
picomatch: 4.0.2
|
picomatch: 4.0.2
|
||||||
postcss: 8.5.3
|
postcss: 8.5.3
|
||||||
rollup: 4.40.2
|
rollup: 4.41.0
|
||||||
tinyglobby: 0.2.13
|
tinyglobby: 0.2.13
|
||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
'@types/node': 22.15.18
|
'@types/node': 22.15.18
|
||||||
|
|
|
@ -19,8 +19,7 @@ const { waline: { serverURL = '', emoji = [], search = false, imageUploader = fa
|
||||||
|
|
||||||
<div
|
<div
|
||||||
id="waline"
|
id="waline"
|
||||||
class="animation-fade-in mt-16"
|
class="mt-16"
|
||||||
style="--animation-delay: 0.8s;"
|
|
||||||
></div>
|
></div>
|
||||||
|
|
||||||
<!-- >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> -->
|
<!-- >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> -->
|
||||||
|
|
|
@ -4,7 +4,7 @@ import GoBackIcon from '@/assets/icons/go-back.svg';
|
||||||
|
|
||||||
<button
|
<button
|
||||||
id="back-button"
|
id="back-button"
|
||||||
class="animation-fade-goback hidden"
|
class="hidden"
|
||||||
lg="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors duration-300 ease-out c-secondary active:scale-90 hover:c-primary/80"
|
lg="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors duration-300 ease-out c-secondary active:scale-90 hover:c-primary/80"
|
||||||
aria-label="Go back"
|
aria-label="Go back"
|
||||||
>
|
>
|
97
src/components/Widgets/GsapAnimation.astro
Normal file
97
src/components/Widgets/GsapAnimation.astro
Normal file
|
@ -0,0 +1,97 @@
|
||||||
|
<script>
|
||||||
|
import { gsap } from 'gsap'
|
||||||
|
|
||||||
|
function setupPostPageAnimation() {
|
||||||
|
const allElements = Array.from(document.querySelectorAll('#gsap-post-page-content > *, #gsap-post-page-tags, #waline'))
|
||||||
|
const tocListChildren = Array.from(document.querySelectorAll('#toc-list > *')).slice(0, 20)
|
||||||
|
const dateElement = document.getElementById('gsap-post-page-date')
|
||||||
|
const backButton = document.getElementById('back-button')
|
||||||
|
const tocIcon = document.getElementById('toc-icon')
|
||||||
|
const tocContainer = document.getElementById('toc-container')
|
||||||
|
|
||||||
|
const isLargeScreen = window.matchMedia('(min-width: 1024px)').matches
|
||||||
|
|
||||||
|
// Post Content + Tags + Comments (First 15 elements)
|
||||||
|
gsap.from(allElements.slice(0, 15), {
|
||||||
|
opacity: 0,
|
||||||
|
y: '3rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.1,
|
||||||
|
ease: 'power2.out',
|
||||||
|
stagger: 0.05,
|
||||||
|
})
|
||||||
|
|
||||||
|
// Post Content + Tags + Comments (Rest elements)
|
||||||
|
if (allElements.length > 15) {
|
||||||
|
gsap.from(allElements.slice(15), {
|
||||||
|
opacity: 0,
|
||||||
|
y: '3rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.05 * 15 + 0.1,
|
||||||
|
ease: 'power2.out',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isLargeScreen) {
|
||||||
|
// Desktop Post Date
|
||||||
|
if (dateElement) {
|
||||||
|
gsap.from(dateElement, {
|
||||||
|
opacity: 0,
|
||||||
|
y: '1.5rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.1,
|
||||||
|
ease: 'power2.out',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// Desktop TOC Icon
|
||||||
|
if (tocIcon) {
|
||||||
|
gsap.from(tocIcon, {
|
||||||
|
opacity: 0,
|
||||||
|
y: '0.5rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.125,
|
||||||
|
ease: 'power2.out',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// Desktop Toc List
|
||||||
|
if (tocListChildren.length > 0) {
|
||||||
|
gsap.from(tocListChildren, {
|
||||||
|
opacity: 0,
|
||||||
|
y: '1.5rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.15,
|
||||||
|
ease: 'power2.out',
|
||||||
|
stagger: 0.025,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// Desktop Back Button
|
||||||
|
if (backButton) {
|
||||||
|
gsap.from(backButton, {
|
||||||
|
opacity: 0,
|
||||||
|
x: '0.5rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.15,
|
||||||
|
ease: 'power2.out',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// Mobile TOC Container
|
||||||
|
if (tocContainer) {
|
||||||
|
gsap.from(tocContainer, {
|
||||||
|
opacity: 0,
|
||||||
|
y: '3rem',
|
||||||
|
duration: 0.5,
|
||||||
|
delay: 0.1,
|
||||||
|
ease: 'power2.out',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setupPostPageAnimation()
|
||||||
|
document.addEventListener('astro:after-swap', setupPostPageAnimation)
|
||||||
|
</script>
|
|
@ -19,7 +19,10 @@ const filteredHeadings = headings.filter(heading =>
|
||||||
---
|
---
|
||||||
|
|
||||||
{filteredHeadings.length > 0 && (
|
{filteredHeadings.length > 0 && (
|
||||||
<div class="mb-4 uno-round-border bg-secondary/5 2xl:(fixed left-0 top-43.5 max-w-[min(calc(50vw-38rem),13rem)] border-none bg-secondary/0)">
|
<div
|
||||||
|
id="toc-container"
|
||||||
|
class="mb-4 uno-round-border bg-secondary/5 2xl:(fixed left-0 top-43.5 max-w-[min(calc(50vw-38rem),13rem)] border-none bg-secondary/0)"
|
||||||
|
>
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
id="toc-toggle"
|
id="toc-toggle"
|
||||||
|
@ -36,8 +39,9 @@ const filteredHeadings = headings.filter(heading =>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<TocIcon
|
<TocIcon
|
||||||
|
id="toc-icon"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
class="animation-fade-in ml-1 hidden aspect-square w-4.2 2xl:(mt-4 block origin-center active:scale-90)"
|
class="ml-1 hidden aspect-square w-4.2 2xl:(mt-4 block origin-center active:scale-90)"
|
||||||
fill="currentColor"
|
fill="currentColor"
|
||||||
/>
|
/>
|
||||||
</label>
|
</label>
|
||||||
|
@ -51,8 +55,8 @@ const filteredHeadings = headings.filter(heading =>
|
||||||
aria-label="Table of Contents"
|
aria-label="Table of Contents"
|
||||||
>
|
>
|
||||||
<ul
|
<ul
|
||||||
class="animation-fade-up toc-list"
|
id="toc-list"
|
||||||
style="--animation-interval: 0.04s;"
|
class="toc-list"
|
||||||
>
|
>
|
||||||
{filteredHeadings.map(heading => (
|
{filteredHeadings.map(heading => (
|
||||||
<li
|
<li
|
||||||
|
@ -83,13 +87,13 @@ const filteredHeadings = headings.filter(heading =>
|
||||||
<!-- Override heti default styles >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> -->
|
<!-- Override heti default styles >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> -->
|
||||||
<style>
|
<style>
|
||||||
.toc-title {
|
.toc-title {
|
||||||
--at-apply: 'font-semibold ml-4 select-none 2xl:hidden';
|
--at-apply: 'font-semibold ml-4 2xl:hidden';
|
||||||
}
|
}
|
||||||
.toc-list {
|
.toc-list {
|
||||||
--at-apply: 'list-none pl-0 space-y-2 mt-1 mb-4 2xl:space-y-1.2';
|
--at-apply: 'list-none pb-3.3 pl-0 space-y-2 mt-1 mb-4 2xl:space-y-1.2';
|
||||||
}
|
}
|
||||||
.toc-link-h2, .toc-link-h3, .toc-link-h4 {
|
.toc-link-h2, .toc-link-h3, .toc-link-h4 {
|
||||||
--at-apply: 'text-sm no-underline font-normal text-balance select-none 2xl:(text-3.2 c-secondary/60 transition-colors transition-font-weight duration-300 ease-out hover:(c-secondary font-medium))';
|
--at-apply: 'text-sm no-underline font-normal text-balance 2xl:(text-3.2 c-secondary/60 transition-colors transition-font-weight duration-300 ease-out hover:(c-secondary font-medium))';
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Initial collapsed state with zero height grid row */
|
/* Initial collapsed state with zero height grid row */
|
||||||
|
@ -97,7 +101,7 @@ const filteredHeadings = headings.filter(heading =>
|
||||||
--at-apply: 'grid rows-[0fr] duration-300 ease-in-out';
|
--at-apply: 'grid rows-[0fr] duration-300 ease-in-out';
|
||||||
}
|
}
|
||||||
.accordion-content {
|
.accordion-content {
|
||||||
--at-apply: 'max-h-66 overflow-hidden pl-4 pr-6 2xl:(max-h-[calc(100vh-21.5rem)] pl-1)';
|
--at-apply: 'max-h-66 overflow-hidden pl-4 pr-6 2xl:(max-h-[calc(100vh-26rem)] pl-1)';
|
||||||
}
|
}
|
||||||
|
|
||||||
/* When toggle is checked, expand the wrapper to show content */
|
/* When toggle is checked, expand the wrapper to show content */
|
||||||
|
|
|
@ -3,13 +3,12 @@ import Button from '@/components/Button.astro'
|
||||||
import Footer from '@/components/Footer.astro'
|
import Footer from '@/components/Footer.astro'
|
||||||
import Header from '@/components/Header.astro'
|
import Header from '@/components/Header.astro'
|
||||||
import Navbar from '@/components/Navbar.astro'
|
import Navbar from '@/components/Navbar.astro'
|
||||||
import FadeUpAnimation from '@/components/Widgets/FadeUpAnimation.astro'
|
|
||||||
import GithubCard from '@/components/Widgets/GithubCard.astro'
|
import GithubCard from '@/components/Widgets/GithubCard.astro'
|
||||||
|
import GsapAnimation from '@/components/Widgets/GsapAnimation.astro'
|
||||||
import PhotoSwipe from '@/components/Widgets/PhotoSwipe.astro'
|
import PhotoSwipe from '@/components/Widgets/PhotoSwipe.astro'
|
||||||
import themeConfig from '@/config'
|
import themeConfig from '@/config'
|
||||||
import Head from '@/layouts/Head.astro'
|
import Head from '@/layouts/Head.astro'
|
||||||
import { getPageInfo } from '@/utils/page'
|
import { getPageInfo } from '@/utils/page'
|
||||||
import '@/styles/animation.css'
|
|
||||||
import '@/styles/global.css'
|
import '@/styles/global.css'
|
||||||
import '@/styles/font.css'
|
import '@/styles/font.css'
|
||||||
import '@/styles/heti.css'
|
import '@/styles/heti.css'
|
||||||
|
@ -48,7 +47,7 @@ const MarginBottom = isPost && themeConfig.comment?.enabled
|
||||||
</main>
|
</main>
|
||||||
<Footer />
|
<Footer />
|
||||||
</div>
|
</div>
|
||||||
<FadeUpAnimation />
|
<GsapAnimation />
|
||||||
<Button supportedLangs={supportedLangs} />
|
<Button supportedLangs={supportedLangs} />
|
||||||
<GithubCard />
|
<GithubCard />
|
||||||
<PhotoSwipe />
|
<PhotoSwipe />
|
||||||
|
|
|
@ -3,7 +3,7 @@ import type { CollectionEntry } from 'astro:content'
|
||||||
import { getCollection, render } from 'astro:content'
|
import { getCollection, render } from 'astro:content'
|
||||||
import Comments from '@/components/Comments/index.astro'
|
import Comments from '@/components/Comments/index.astro'
|
||||||
import PostDate from '@/components/PostDate.astro'
|
import PostDate from '@/components/PostDate.astro'
|
||||||
import GoBack from '@/components/Widgets/GoBack.astro'
|
import BackButton from '@/components/Widgets/BackButton.astro'
|
||||||
import TOC from '@/components/Widgets/TOC.astro'
|
import TOC from '@/components/Widgets/TOC.astro'
|
||||||
import { allLocales, defaultLocale, moreLocales } from '@/config'
|
import { allLocales, defaultLocale, moreLocales } from '@/config'
|
||||||
import { getTagPath } from '@/i18n/path'
|
import { getTagPath } from '@/i18n/path'
|
||||||
|
@ -109,7 +109,7 @@ const { Content, headings, remarkPluginFrontmatter } = await render(post)
|
||||||
<article class="heti mb-12.6">
|
<article class="heti mb-12.6">
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
<!-- Go Back Button On Desktop -->
|
<!-- Go Back Button On Desktop -->
|
||||||
<GoBack />
|
<BackButton />
|
||||||
<!-- Title -->
|
<!-- Title -->
|
||||||
<h1 class="post-title">
|
<h1 class="post-title">
|
||||||
<span
|
<span
|
||||||
|
@ -123,8 +123,8 @@ const { Content, headings, remarkPluginFrontmatter } = await render(post)
|
||||||
|
|
||||||
<!-- Date -->
|
<!-- Date -->
|
||||||
<div
|
<div
|
||||||
class="animation-fade-in mb-16.3 block c-primary font-time"
|
id="gsap-post-page-date"
|
||||||
style="--animation-distance: 1rem;"
|
class="mb-16.3 block c-primary font-time"
|
||||||
transition:name={`time-${post.data.abbrlink || post.id}-${lang}`}
|
transition:name={`time-${post.data.abbrlink || post.id}-${lang}`}
|
||||||
data-disable-theme-transition
|
data-disable-theme-transition
|
||||||
>
|
>
|
||||||
|
@ -137,26 +137,25 @@ const { Content, headings, remarkPluginFrontmatter } = await render(post)
|
||||||
<!-- TOC -->
|
<!-- TOC -->
|
||||||
{post.data.toc && <TOC headings={headings} />}
|
{post.data.toc && <TOC headings={headings} />}
|
||||||
<!-- Content -->
|
<!-- Content -->
|
||||||
<div class="animation-fade-up">
|
<div id="gsap-post-page-content">
|
||||||
<Content />
|
<Content />
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- Tags -->
|
<!-- Tags -->
|
||||||
{post.data.tags && post.data.tags.length > 0 && (
|
{post.data.tags && post.data.tags.length > 0 && (
|
||||||
<div
|
<div id="gsap-post-page-tags">
|
||||||
class="animation-fade-in uno-decorative-line"
|
<div class="uno-decorative-line"></div>
|
||||||
style="--animation-delay: 0.8s;"
|
<div class="uno-tags-wrapper">
|
||||||
></div>
|
{post.data.tags.map((tag: string) => (
|
||||||
<div class="uno-tags-wrapper">
|
<a
|
||||||
{post.data.tags.map((tag: string) => (
|
href={getTagPath(tag, lang)}
|
||||||
<a
|
class="uno-tags-style"
|
||||||
href={getTagPath(tag, lang)}
|
>
|
||||||
class="uno-tags-style"
|
{tag}
|
||||||
>
|
</a>
|
||||||
{tag}
|
))}
|
||||||
</a>
|
</div>
|
||||||
))}
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<!-- Comments -->
|
<!-- Comments -->
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue