Files for my website
bwc9876.dev
1---
2import ProjectCard from "./ProjectCard.astro";
3import { getCollection } from "astro:content";
4
5export interface Props {
6 limitTo?: number;
7}
8
9const projectEntries = await getCollection("projects");
10let entries = projectEntries.sort((a, b) => {
11 const [yearA, yearB] = [a.data.timespan.from, b.data.timespan.from];
12 const [intA, intB] = [a.data.internalSort ?? 0, b.data.internalSort ?? 0];
13 const yearSort = yearB - yearA;
14 return yearSort === 0 ? intB - intA : yearSort;
15});
16
17const { limitTo } = Astro.props;
18if (limitTo) {
19 entries = entries.slice(0, limitTo);
20}
21---
22
23<div>
24 {entries.map((p) => <ProjectCard project={p} />)}
25</div>
26
27<style>
28 @media (width >= 1700px) {
29 div {
30 grid-template-columns: 1fr 1fr 1fr;
31 }
32 }
33 @media (1200px <= width <= 1700px) {
34 div {
35 grid-template-columns: 1fr 1fr;
36 }
37 }
38 @media (width <= 1200px) {
39 div {
40 grid-template-columns: 1fr;
41 }
42 }
43 div {
44 display: grid;
45 gap: var(--3);
46 margin-bottom: calc(var(--4) + var(--2));
47 }
48</style>