67 lines
1.6 KiB
Text
67 lines
1.6 KiB
Text
---
|
|
import Layout from '../layouts/Layout.astro'
|
|
import { Page, Row, Logo } from '../../@dasig'
|
|
import ArticleCard from '../components/ArticleCard.astro'
|
|
|
|
const articles = Object.values(import.meta.glob('../content/articles/*.md', { eager: true }))
|
|
|
|
function getArticleData(post: any) {
|
|
const slug = post.frontmatter.slug
|
|
const alt = slug.replace(/-/g, ' ')
|
|
const category = post.frontmatter.category
|
|
let categoryColor
|
|
|
|
if (category === 'Technology') {
|
|
categoryColor = 'blue'
|
|
} else if (category === 'Poem') {
|
|
categoryColor = 'yellow'
|
|
}
|
|
|
|
return {
|
|
category: post.frontmatter.category,
|
|
categoryColor: categoryColor,
|
|
url: `read/${slug}`,
|
|
title: post.frontmatter.title,
|
|
subtitle: post.frontmatter.subtitle,
|
|
imageA: `../@dasig/images/${slug}.avif`,
|
|
imageW: `../@dasig/images/${slug}.webp`,
|
|
alt: alt,
|
|
minutes: post.frontmatter.minutes,
|
|
date: post.frontmatter.date,
|
|
}
|
|
}
|
|
---
|
|
|
|
<Layout title="Articles - Pat Alcala">
|
|
<Page alignment="column">
|
|
<Row wrap gap={1} content="left">
|
|
<Logo size={90} />
|
|
<h1 class="title">Pat's Articles</h1>
|
|
</Row>
|
|
|
|
<div class="articles">
|
|
<Row wrap gap={1}>
|
|
{
|
|
articles.map((post: any) => {
|
|
const data = getArticleData(post)
|
|
return <ArticleCard {...data} />
|
|
})
|
|
}
|
|
</Row>
|
|
</div>
|
|
</Page>
|
|
|
|
<style lang="sass">
|
|
@use '../../configs/design/colors.sass' as colors
|
|
@use '../styles/fonts.sass' as fonts
|
|
|
|
h1
|
|
color: colors.$white
|
|
margin: 0
|
|
font-family: fonts.$Literata
|
|
font-weight: bold
|
|
|
|
.articles
|
|
padding: 2rem 0 0 0
|
|
</style>
|
|
</Layout>
|