chore: layout

This commit is contained in:
enscribe 2024-09-10 12:51:03 -07:00
parent b9561ad2d0
commit 230dca64ca
No known key found for this signature in database
GPG key ID: 9BBD5C4114E25322
27 changed files with 446 additions and 339 deletions

View file

@ -9,10 +9,10 @@ import { SITE } from '@consts'
<Layout title="404" description={SITE.DESCRIPTION}>
<Container>
<div class="mt-16 grid place-items-center gap-3">
<h4 class="animate text-2xl font-semibold text-black dark:text-white">
<h4 class="text-2xl font-semibold text-black dark:text-white">
404: Page not found
</h4>
<span class="animate">
<span>
<BackToPrevious href="/">Go to home page</BackToPrevious>
</span>
</div>

View file

@ -8,8 +8,8 @@ import { Image } from 'astro:assets'
<Layout title="About" description="About">
<Container>
<div class="space-y-10">
<div class="animate font-semibold text-black dark:text-white">About</div>
<section class="animate not-prose flex flex-col gap-4 text-justify">
<div class="font-semibold text-black dark:text-white">About</div>
<section class="not-prose flex flex-col gap-4 text-justify">
<p class="text-justify">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores porro
hic minima incidunt explicabo obcaecati consectetur consequuntur at

View file

@ -1,33 +1,33 @@
---
import { type CollectionEntry, getCollection, getEntry } from "astro:content";
import Layout from "@layouts/Layout.astro";
import MemberCard from "@components/MemberCard.astro";
import { type CollectionEntry, getCollection, getEntry } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import MemberCard from '@components/MemberCard.astro'
export async function getStaticPaths() {
const authors = await getCollection("authors");
const authors = await getCollection('authors')
return authors.map((member) => ({
params: { slug: member.slug },
props: { member },
}));
}))
}
type Props = {
member: CollectionEntry<"authors">;
};
member: CollectionEntry<'authors'>
}
const { member } = Astro.props;
const { member } = Astro.props
const allPosts = await getCollection("blog");
const allPosts = await getCollection('blog')
const memberPosts = allPosts
.filter((post) => {
if (typeof post.data.author === 'string') {
return post.data.author === member.data.name && !post.data.draft;
return post.data.author === member.data.name && !post.data.draft
} else if (post.data.author && 'slug' in post.data.author) {
return post.data.author.slug === member.slug && !post.data.draft;
return post.data.author.slug === member.slug && !post.data.draft
}
return false;
return false
})
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
---
<Layout

View file

@ -1,16 +1,14 @@
---
import { getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import MemberCard from "@components/MemberCard.astro";
import { getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import MemberCard from '@components/MemberCard.astro'
const authors = await getCollection("authors");
const authors = await getCollection('authors')
---
<Layout title="authors" description="authors">
<section>
<ul
class="animate not-prose grid grid-cols-1 gap-4 lg:grid-cols-2 xl:grid-cols-3"
>
<ul class="not-prose grid grid-cols-1 gap-4 lg:grid-cols-2 xl:grid-cols-3">
{
authors.map((member) => (
<li>

View file

@ -53,7 +53,7 @@ const { Content, headings } = await post.render()
<BackToPrevious href="/blog">Back to blog</BackToPrevious>
</div>
<div class="my-10 space-y-4">
<div class="animate flex items-center gap-1.5">
<div class="flex items-center gap-1.5">
<div class="font-base text-sm">
<FormattedDate date={post.data.date} />
</div>
@ -62,7 +62,7 @@ const { Content, headings } = await post.render()
{readingTime(post.body)}
</div>
</div>
<h1 class="animate text-4xl font-semibold text-black dark:text-white">
<h1 class="text-4xl font-semibold text-black dark:text-white">
{post.data.title}
</h1>
<div class="font-base text-sm">

View file

@ -30,7 +30,7 @@ const years = Object.keys(posts).sort((a, b) => parseInt(b) - parseInt(a))
<div class="space-y-4">
{
years.map((year) => (
<section class="animate space-y-4">
<section class="space-y-4">
<div class="font-semibold text-black dark:text-white">{year}</div>
<div>
<ul class="not-prose flex flex-col gap-4">

View file

@ -16,7 +16,7 @@ const blog = (await getCollection('blog'))
<Layout title="Home" description="Home">
<Container>
<section class="animate space-y-6">
<section class="space-y-6">
<div class="flex flex-wrap items-center justify-between gap-y-2">
<h2 class="font-semibold text-black dark:text-white">Latest posts</h2>
<Link href="/blog"> See all posts </Link>

View file

@ -1,23 +1,23 @@
import rss from '@astrojs/rss'
import { SITE } from '@consts'
import { getCollection } from 'astro:content'
import type { APIContext } from 'astro'
import { getCollection } from 'astro:content'
export async function GET(context: APIContext) {
try {
const blog = (await getCollection('blog')).filter(
(post) => !post.data.draft
(post) => !post.data.draft,
)
// Filter posts by tag 'rss-feed'
const filteredBlogs = blog.filter(
(post) => post.data.tags && post.data.tags.includes('rss-feed')
(post) => post.data.tags && post.data.tags.includes('rss-feed'),
)
// Sort posts by date
const items = [...filteredBlogs].sort(
(a, b) =>
new Date(b.data.date).valueOf() - new Date(a.data.date).valueOf()
new Date(b.data.date).valueOf() - new Date(a.data.date).valueOf(),
)
// Return RSS feed

View file

@ -36,7 +36,7 @@ export async function getStaticPaths() {
>
<Container>
<div class="space-y-10">
<div class="animate font-semibold text-black dark:text-white">
<div class="font-semibold text-black dark:text-white">
Tag: <span
class="mx-2 rounded-full bg-orange-300 px-3 py-2 transition-colors duration-300 ease-in-out hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500"
>#{tag}</span
@ -45,7 +45,7 @@ export async function getStaticPaths() {
<div class="space-y-4">
{
posts.map((post) => (
<section class="animate space-y-4">
<section class="space-y-4">
<div>
<ul class="not-prose flex flex-col gap-4">
<li>

View file

@ -14,7 +14,7 @@ const tags = blog
<Layout title="Tags" description="Tags">
<Container>
<div class="space-y-10">
<div class="animate font-semibold text-black dark:text-white">Tags</div>
<div class="font-semibold text-black dark:text-white">Tags</div>
<ul class="flex flex-wrap">
{
tags.map((tag) => (