fix: reorder footer content to fix insufficient spacing between links, adjust desktop layout to prevent narrowing caused by native scrollbar

This commit is contained in:
radishzzz 2025-05-17 12:00:13 +01:00
parent 1c374367fd
commit 3ee10e2d18
6 changed files with 14 additions and 14 deletions

View file

@ -28,9 +28,9 @@ const nextUrl = useSupportedLangs
<div
class:list={[
'absolute flex gap-6 top-14.6 right-7.25vw min-[823px]:max-[1024px]:right-[calc(50vw-22rem)]',
'absolute right-7.25vw top-14.6 flex gap-6 min-[823px]:max-[1024px]:right-[calc(50vw-22rem)]',
'[@supports(-webkit-touch-callout:none)]:top-13.6', // fix position issue on ios
'lg:(fixed w-14rem top-auto bottom-47 right-[max(5.625rem,calc(50vw-34.375rem))])',
'lg:(fixed bottom-47 right-[max(5rem,calc(50vw-35rem))] top-auto w-14rem)',
]}
>
<!-- Language Switcher -->

View file

@ -22,11 +22,11 @@ const links = socialLinks.map((link) => {
return link
})
const footerLinkClass = 'highlight-hover footer-highlight-position-fix py-0.8 transition-colors after:bottom-0.1 hover:c-primary'
const footerLinkClass = 'highlight-hover footer-highlight-position-fix py-0.8 transition-colors after:bottom-0.15em hover:c-primary'
---
<footer
class="text-3 leading-0.9em font-navbar lg:text-3.5"
class="mb-4 text-3 leading-1.25em font-navbar lg:(mb-0 text-3.5)"
lg="uno-desktop-column bottom-20"
>
<p>
@ -41,10 +41,10 @@ const footerLinkClass = 'highlight-hover footer-highlight-position-fix py-0.8 tr
</p>
<p>
Powered by <a class={footerLinkClass} href="https://astro.build/" target="_blank" rel="noopener noreferrer">Astro</a> and <a class={footerLinkClass} href="https://github.com/radishzzz/astro-theme-retypeset" target="_blank" rel="noopener noreferrer">Retypeset</a>
</p>
<p class="py-0.8">
© {year} {author}
</p>
<p>
Powered by <a class={footerLinkClass} href="https://astro.build/" target="_blank" rel="noopener noreferrer">Astro</a> and <a class={footerLinkClass} href="https://github.com/radishzzz/astro-theme-retypeset" target="_blank" rel="noopener noreferrer">Retypeset</a>
</p>
</footer>

View file

@ -82,7 +82,7 @@ function getPostPath(post: Post) {
{isHome && (
<div
class="heti hidden"
lg="mt-2 block"
lg="mt-2.25 block"
>
<p>{generateDescription(post, 'list')}</p>
</div>

View file

@ -37,7 +37,7 @@ const MarginBottom = isPost && themeConfig.comment?.enabled
<div
class="mx-auto max-w-205.848 min-h-vh w-full min-h-dvh"
p="x-[min(7.25vw,3.731rem)] y-9"
lg="p-0 min-h-full max-w-[min(calc(75vw-16rem),44rem)] mx-[max(5.625rem,calc(50vw-34.375rem))] my-20"
lg="mx-[max(5rem,calc(50vw-35rem))] my-20 max-w-[min(calc(75vw-16rem),44rem)] min-h-full p-0"
>
<Header />
<Navbar />

View file

@ -61,7 +61,7 @@ h4:hover .heading-anchor-link svg:hover {
--at-apply: 'after:bottom-0.68em';
}
.footer-highlight-position-fix {
--at-apply: 'after:bottom-0.34em';
--at-apply: 'after:bottom-0.39em';
}
}