36 lines
1.4 KiB
Plaintext
36 lines
1.4 KiB
Plaintext
---
|
|
import Divider from "../components/misc/Divider.astro";
|
|
import Layout from "./Layout.astro";
|
|
import Nav from "../components/nav/Nav.astro";
|
|
const { frontmatter } = Astro.props;
|
|
---
|
|
|
|
<Layout>
|
|
<Nav/>
|
|
<main class="z-10 flex flex-col justify-center w-5/6 mx-auto mt-4 mb-6 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 overflow-hidden bg-gray-500 rounded-lg sm:pt-0 rounded-xl bg-clip-padding backdrop-filter backdrop-blur-md bg-opacity-10">
|
|
<div class="relative mb-4">
|
|
<img class="object-cover aspect-video rounded-xl max-h-[50vh] w-full" src={frontmatter.image} alt=""
|
|
draggable="false" />
|
|
<a href={frontmatter.imageattr} class="absolute bottom-0 right-0 h-[24px]">
|
|
<span class="material-symbols-outlined opacity-25 mr-[4px]">link</span>
|
|
</a>
|
|
</div>
|
|
<p class="my-2 text-5xl px-2 font-bold text-white">{frontmatter.title}</p>
|
|
<p class="text-gray-200 px-2">{frontmatter.date}</p>
|
|
<Divider />
|
|
<!-- Render our markdown with the normal header styling and some extra padding. -->
|
|
<style is:inline>
|
|
.astro-code {
|
|
margin-bottom: 1rem;
|
|
padding: 8px;
|
|
}
|
|
|
|
.prose p>img{
|
|
margin: auto;
|
|
}
|
|
</style>
|
|
<article id="article" class="max-w-full prose text-white px-2 pb-2">
|
|
<slot />
|
|
</article>
|
|
</main>
|
|
</Layout> |