mirror of
https://github.com/xHyroM/website.git
synced 2024-11-21 22:41:06 +01:00
feat: add date to blog
This commit is contained in:
parent
4213322fbc
commit
ca77ffa5d5
5 changed files with 47 additions and 19 deletions
|
@ -1,7 +1,7 @@
|
|||
module.exports = {
|
||||
plugins: [
|
||||
require.resolve("prettier-plugin-astro"),
|
||||
//require.resolve("prettier-plugin-tailwindcss"),
|
||||
require.resolve("prettier-plugin-tailwindcss"),
|
||||
],
|
||||
overrides: [
|
||||
{
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div class="fireworks-container absolute top-0 left-0 z-[-1000] h-full w-full">
|
||||
<div class="fireworks-container absolute left-0 top-0 z-[-1000] h-full w-full">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -23,16 +23,24 @@ const parseDepth = (depth: number) => {
|
|||
|
||||
<ul class="mt-24 flex flex-col gap-4">
|
||||
{
|
||||
headings.map(({ slug, text, depth }: {
|
||||
slug: string;
|
||||
text: string;
|
||||
depth: number;
|
||||
}) => {
|
||||
return (
|
||||
<li class={`text-slate-100 hover:text-slate-700 ${parseDepth(depth)}`}>
|
||||
<a href={`#${slug}`}>{text}</a>
|
||||
</li>
|
||||
);
|
||||
})
|
||||
headings.map(
|
||||
({
|
||||
slug,
|
||||
text,
|
||||
depth,
|
||||
}: {
|
||||
slug: string;
|
||||
text: string;
|
||||
depth: number;
|
||||
}) => {
|
||||
return (
|
||||
<li
|
||||
class={`text-slate-100 hover:text-slate-700 ${parseDepth(depth)}`}
|
||||
>
|
||||
<a href={`#${slug}`}>{text}</a>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
)
|
||||
}
|
||||
</ul>
|
||||
|
|
|
@ -8,13 +8,30 @@ const { item } = Astro.props;
|
|||
const url = Astro.url.pathname;
|
||||
---
|
||||
|
||||
<Layout description={item.frontmatter.title} date={item.frontmatter.date} url={`https://xhyrom.dev${url}`}>
|
||||
<Layout
|
||||
description={item.frontmatter.title}
|
||||
date={item.frontmatter.date}
|
||||
url={`https://xhyrom.dev${url}`}
|
||||
>
|
||||
<Navbar />
|
||||
<h1 class="w-full py-32 text-center text-5xl font-extrabold text-white">
|
||||
{item.frontmatter.title}
|
||||
</h1>
|
||||
<div class="w-full py-32">
|
||||
<div class="flex flex-col items-center justify-center gap-2">
|
||||
<h1 class="text-5xl font-extrabold text-white">
|
||||
{item.frontmatter.title}
|
||||
</h1>
|
||||
<h2 class="text-2xl font-semibold text-white text-opacity-40">
|
||||
{
|
||||
new Date(item.frontmatter.date).toLocaleDateString("en-us", {
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
})
|
||||
}
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Container class="prose prose-invert text-2xl content-center justify-center">
|
||||
<Container class="prose prose-invert content-center justify-center text-2xl">
|
||||
<article>
|
||||
<slot />
|
||||
</article>
|
||||
|
|
|
@ -3,8 +3,11 @@ import Layout from "@layouts/Layout.astro";
|
|||
import Navbar from "@components/widgets/Navbar.astro";
|
||||
import Container from "@components/atoms/Container.astro";
|
||||
import Button from "~/components/widgets/Button.astro";
|
||||
import type { PaginateFunction } from "astro";
|
||||
|
||||
export async function getStaticPaths({ paginate }) {
|
||||
export async function getStaticPaths({ paginate }: {
|
||||
paginate: PaginateFunction;
|
||||
}) {
|
||||
// Load your data with fetch(), Astro.glob(), etc.
|
||||
const posts = (await Astro.glob('@blog/*.md')).sort(
|
||||
(a, b) => new Date(b.frontmatter.date).valueOf() - new Date(a.frontmatter.date).valueOf()
|
||||
|
|
Loading…
Reference in a new issue