Added phtography section

This commit is contained in:
Anton Pogrebnjak
2026-04-06 22:56:12 +02:00
parent d03478f81a
commit da9d256b71
15 changed files with 266 additions and 13 deletions

View File

@@ -0,0 +1,103 @@
---
import type { CollectionEntry } from "astro:content";
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Main from "../components/Main.astro";
import Footer from "../components/Footer.astro";
import FormattedDate from "../components/FormattedDate.astro";
type Props = CollectionEntry<"photography">["data"];
const { title, description, pubDate, src } = Astro.props;
---
<html lang="en">
<head>
<BaseHead title={title} description={description} image={src} />
<style>
article {
width: 100%;
}
h1::after {
content: "";
display: block;
/* width: 100%; */
height: 2px;
background-color: var(--primary);
margin: 0.5rem auto;
}
h2::after {
content: "";
display: block;
/* width: 100%; */
height: 2px;
background-color: var(--primary);
margin: 0.5rem auto;
}
.hero-image {
width: 100%;
}
.hero-image img {
display: block;
margin: 0 auto;
border-radius: 12px;
}
.prose {
width: 720px;
max-width: 100%;
margin: auto;
padding: 1em;
color: var(--text);
}
.title {
margin-bottom: 1em;
padding: 1em 0;
text-align: center;
line-height: 1;
}
.title h1 {
margin: 0 0 0.5em 0;
}
.date {
margin-bottom: 0.5em;
color: var(--text);
}
</style>
</head>
<body>
<Header />
<Main>
<article>
<div class="hero-image">
<img
width={1020}
height={510}
src={src}
alt=""
/>
</div>
<div class="prose">
<div class="title">
<div class="date">
<FormattedDate date={pubDate} />
</div>
<h1>{title}</h1>
</div>
<p>
{description}
</p>
</div>
</article>
</Main>
<Footer />
</body>
</html>