mirror of
https://github.com/kogakure/website-astro-stefanimhoff.de.git
synced 2026-02-03 20:15:27 +00:00
65fe960af0
Use the least amount of image formats and sizes: - WebP for images - Avif with JPEG fallback for pictures
40 lines
969 B
Plaintext
40 lines
969 B
Plaintext
---
|
|
import PageTitle from '../components/PageTitle.astro';
|
|
import Picture from '../components/Picture.astro';
|
|
|
|
import GridLayout from './GridLayout.astro';
|
|
|
|
export interface Props {
|
|
class?: string;
|
|
frontmatter?: any;
|
|
grid?: 'wide' | 'narrow';
|
|
}
|
|
|
|
const { frontmatter, class: className, grid = 'narrow' } = Astro.props;
|
|
const gridVariant = frontmatter.grid || grid;
|
|
---
|
|
|
|
<GridLayout grid={gridVariant} class={className} {...frontmatter}>
|
|
<PageTitle slot="title" grid={gridVariant} {...frontmatter}>
|
|
{frontmatter.title}
|
|
</PageTitle>
|
|
{
|
|
frontmatter.cover && (
|
|
<div
|
|
slot="before-content"
|
|
class="col-span-full xl:col-start-1 xl:col-end-14 3xl:col-end-13 [&_div]:!border-x-0 [&_div]:!mbe-0 [&_div]:md:!border-s-0"
|
|
>
|
|
<Picture
|
|
alt={frontmatter.title}
|
|
aspect={1.5}
|
|
breakpoints={[500, 1000, 1500]}
|
|
src={frontmatter.cover}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
<slot name="before-content" />
|
|
<slot />
|
|
<slot name="after-content" />
|
|
</GridLayout>
|