wider blog

This commit is contained in:
rustdesk 2024-11-06 11:22:27 +08:00
parent 9115c66293
commit 0d6cd1f125
3 changed files with 7 additions and 7 deletions

View File

@ -2,7 +2,7 @@
const { title = await Astro.slots.render('default'), subtitle = await Astro.slots.render('subtitle') } = Astro.props; const { title = await Astro.slots.render('default'), subtitle = await Astro.slots.render('subtitle') } = Astro.props;
--- ---
<header class="mb-8 md:mb-16 text-center max-w-3xl mx-auto"> <header class="mb-8 md:mb-16 text-center max-w-4xl mx-auto">
<h1 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading" set:html={title} /> <h1 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading" set:html={title} />
{ {
subtitle && ( subtitle && (

View File

@ -21,7 +21,7 @@ const { post, url } = Astro.props;
<section class="py-8 sm:py-16 lg:py-20 mx-auto"> <section class="py-8 sm:py-16 lg:py-20 mx-auto">
<article> <article>
<header class={post.image ? '' : ''}> <header class={post.image ? '' : ''}>
<div class="flex justify-between flex-col sm:flex-row max-w-3xl mx-auto mt-0 mb-2 px-4 sm:px-6 sm:items-center"> <div class="flex justify-between flex-col sm:flex-row max-w-4xl mx-auto mt-0 mb-2 px-4 sm:px-6 sm:items-center">
<p> <p>
<Icon name="tabler:clock" class="w-4 h-4 inline-block -mt-0.5 dark:text-gray-400" /> <Icon name="tabler:clock" class="w-4 h-4 inline-block -mt-0.5 dark:text-gray-400" />
<time datetime={String(post.publishDate)} class="inline-block">{getFormattedDate(post.publishDate)}</time> <time datetime={String(post.publishDate)} class="inline-block">{getFormattedDate(post.publishDate)}</time>
@ -56,7 +56,7 @@ const { post, url } = Astro.props;
</div> </div>
<h1 <h1
class="px-4 sm:px-6 max-w-3xl mx-auto text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading" class="px-4 sm:px-6 max-w-4xl mx-auto text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading"
> >
{post.title} {post.title}
</h1> </h1>
@ -75,18 +75,18 @@ const { post, url } = Astro.props;
decoding="async" decoding="async"
/> />
) : ( ) : (
<div class="max-w-3xl mx-auto px-4 sm:px-6"> <div class="max-w-4xl mx-auto px-4 sm:px-6">
<div class="border-t dark:border-slate-700" /> <div class="border-t dark:border-slate-700" />
</div> </div>
) )
} }
</header> </header>
<div <div
class="mx-auto px-6 sm:px-6 max-w-3xl prose prose-md lg:prose-xl dark:prose-invert dark:prose-headings:text-slate-300 prose-headings:font-heading prose-headings:leading-tighter prose-headings:tracking-tighter prose-headings:font-bold prose-a:text-primary dark:prose-a:text-blue-400 prose-img:rounded-md prose-img:shadow-lg mt-8 prose-headings:scroll-mt-[80px] prose-li:my-0" class="mx-auto px-6 sm:px-6 max-w-4xl prose prose-md lg:prose-xl dark:prose-invert dark:prose-headings:text-slate-300 prose-headings:font-heading prose-headings:leading-tighter prose-headings:tracking-tighter prose-headings:font-bold prose-a:text-primary dark:prose-a:text-blue-400 prose-img:rounded-md prose-img:shadow-lg mt-8 prose-headings:scroll-mt-[80px] prose-li:my-0"
> >
<slot /> <slot />
</div> </div>
<div class="mx-auto px-6 sm:px-6 max-w-3xl mt-8 flex justify-between flex-col sm:flex-row"> <div class="mx-auto px-6 sm:px-6 max-w-4xl mt-8 flex justify-between flex-col sm:flex-row">
<PostTags tags={post.tags} class="mr-5 rtl:mr-0 rtl:ml-5" /> <PostTags tags={post.tags} class="mr-5 rtl:mr-0 rtl:ml-5" />
<SocialShare url={url} text={post.title} class="mt-5 sm:mt-1 align-middle text-gray-500 dark:text-slate-600" /> <SocialShare url={url} text={post.title} class="mt-5 sm:mt-1 align-middle text-gray-500 dark:text-slate-600" />
</div> </div>

View File

@ -7,7 +7,7 @@ import Button from '~/components/ui/Button.astro';
const { textDirection } = I18N; const { textDirection } = I18N;
--- ---
<div class="mx-auto px-6 sm:px-6 max-w-3xl pt-8 md:pt-4 pb-12 md:pb-20"> <div class="mx-auto px-6 sm:px-6 max-w-4xl pt-8 md:pt-4 pb-12 md:pb-20">
<Button variant="tertiary" class="px-3 md:px-3" href={getBlogPermalink()}> <Button variant="tertiary" class="px-3 md:px-3" href={getBlogPermalink()}>
{ {
textDirection === 'rtl' ? ( textDirection === 'rtl' ? (