feat: performance optimizations and ui improvements (#26)

* test: remove astro-compress

* test: remove astro-compress

* perf: add astro-compress, optimize resource preloading

* perf: moving photoswipe styles to head with non-blocking preload strategy

* test: disable astro-compress

* test: enable astro-compress

* fix: typescript hints

* chore: adjust toc style and gsap animation

* style: optimize gsap animation logic, adjust toc style

* chore: adjust toc style

* fix: photoswipe transition position offset caused by scrollbar-gutter
This commit is contained in:
radishzz 2025-05-26 20:21:38 +01:00 committed by GitHub
parent 054aa85509
commit 47e1df9b3d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 64 additions and 69 deletions

View file

@ -22,7 +22,7 @@ const filteredHeadings = headings.filter(heading =>
// TOC Container
<div
id="toc-container"
class="mb-6 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)"
class="mb-6 uno-round-border bg-secondary/5 2xl:(fixed left-0 top-45.5 max-w-[min(calc(50vw-38rem),13rem)] border-none bg-secondary/0)"
>
{/* Hidden Checkbox */}
<input
@ -46,7 +46,7 @@ const filteredHeadings = headings.filter(heading =>
<TocIcon
id="toc-icon"
aria-hidden="true"
class="ml-1 hidden aspect-square w-4.2 2xl:(mt-4 block origin-center active:scale-90!)"
class="ml-4 hidden aspect-square w-4.2 2xl:(mt-4 block origin-center active:scale-90!)"
fill="currentColor"
/>
</label>
@ -96,18 +96,20 @@ const filteredHeadings = headings.filter(heading =>
--at-apply: 'ml-4 font-semibold 2xl:hidden';
}
.toc-list {
--at-apply: 'mb-4 mt-1 list-none pl-0 space-y-2 2xl:space-y-1.2';
--at-apply: 'mb-2.2 mt-0 list-none pl-0 space-y-1.1 2xl:(mb-2 space-y-1)';
}
.toc-link-h2, .toc-link-h3, .toc-link-h4 {
--at-apply: 'text-balance text-sm font-normal no-underline 2xl:(text-3.2 c-secondary/60 transition-colors transition-font-weight duration-300 ease-out hover:c-secondary hover:font-medium)';
}
.toc-list > :first-child {
--at-apply: 'mt-0';
}
/* Initial collapsed state with zero height grid row */
.accordion-wrapper {
--at-apply: 'grid rows-[0fr] transition-all duration-350 ease-in-out';
}
.accordion-content {
--at-apply: 'max-h-66 overflow-hidden pl-4 pr-6 2xl:(max-h-[calc(100vh-26rem)] pl-1)';
--at-apply: 'max-h-58 overflow-hidden pl-4 pr-6 2xl:max-h-[calc(100vh-26.5rem)]';
}
/* When toggle is checked, expand the wrapper to show content */