filipe/personal-website
1
1
Fork 0
Code Issues Pull requests Activity

lots of stuff :P

Browse source
This commit is contained in:
Filipe Medeiros 2024-03-05 18:07:09 +00:00
parent f7a8c0eb69
commit 799d917a06
Signed by: filipe
GPG key ID: 9533BD5467CC1E78
26 changed files with 228 additions and 4960 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
frontend/bun.lockb Executable file
View file

Binary file not shown.

4841
frontend/pnpm-lock.yaml
View file

File diff suppressed because it is too large Load diff

0
frontend/src/components/mdx/BlogPostSubtitle.astro → frontend/src/components/BlogPostSubtitle.astro
View file

30
frontend/src/components/CardLink.astro
View file

@ -1,35 +1,39 @@
---
export interface Props {
link: string;
isExternal?: boolean;
}
const random = Math.round(Math.random() * 10) % 4;
const { link } = Astro.props;
const { link, isExternal = false } = Astro.props;
---
<li
class:list={[
'border-primary-800 border-2 transition-shadow duration-100 w-96 max-w-full mb-3 group/card',
'border-primary-800 hover:cursor-alias border-2 hover:shadow-primary-800 active:shadow-primary-800 transition-shadow duration-100 w-96 max-w-full group/card',
{
'hover:shadow-[-5px_-5px] hover:shadow-primary-800 ctive:shadow-[-5px_-5px] ctive:shadow-primary-800':
random === 0,
'hover:shadow-[-5px_5px] hover:shadow-primary-800 active:shadow-[-5px_5px] active:shadow-primary-800':
random === 1,
'hover:shadow-[5px_-5px] hover:shadow-primary-800 active:shadow-[5px_-5px] active:shadow-primary-800':
random === 2,
'hover:shadow-[5px_5px] hover:shadow-primary-800 active:shadow-[5px_5px] active:shadow-primary-800':
random === 3,
'hover:shadow-[-5px_-5px] active:shadow-[-5px_-5px]': random === 0,
'hover:shadow-[-5px_5px] active:shadow-[-5px_5px]': random === 1,
'hover:shadow-[5px_-5px] active:shadow-[5px_-5px]': random === 2,
'hover:shadow-[5px_5px] active:shadow-[5px_5px]': random === 3,
},
]}
>
<a href={link} class="px-4 py-3 block">
<a
href={link}
class:list={[
'px-4 py-3 block',
isExternal ? 'group-hover/card:cursor-alias' : '',
]}
>
<slot />
<div class="flex justify-end">
<span
class="pr-3 text-xl group-hover/card:pr-0 transition-[padding] duration-100"
>→</span
class="pr-3 text-3xl group-hover/card:pr-0 transition-[padding] duration-100"
>
{isExternal ? '⤤' : '→'}
</span>
</div>
</a>
</li>

7
frontend/src/components/InlineLink.astro
View file

@ -1,12 +1,17 @@
---
import type { HTMLAttributes } from 'astro/types';
export type Props = HTMLAttributes<'a'>;
export interface Props extends HTMLAttributes<'a'> {
isExternal?: boolean;
}
const { isExternal = false } = Astro.props;
---
<a
class:list={[
'text-primary-800 underline transition-colors duration-100 hover:text-primary-700',
isExternal ? 'hover:cursor-alias' : '',
Astro.props.class,
]}
{...Astro.props}><slot /></a

3
frontend/src/components/mdx/components/InlineLink.astro
View file

@ -3,12 +3,13 @@ import type { HTMLAttributes } from 'astro/types';
export type Props = HTMLAttributes<'a'>;
console.log(Astro.props);
const isExternal = Astro.props.href?.toString().startsWith('https://');
---
<a
class:list={[
'text-primary-800 underline transition-colors duration-100 hover:text-primary-700',
isExternal ? 'hover:cursor-alias' : '',
Astro.props.class,
]}
{...Astro.props}><slot /></a

3
frontend/src/components/mdx/components/LinkToFootnote.astro
View file

@ -2,10 +2,9 @@
import InlineLink from '../../InlineLink.astro';
import langToFootnoteString from '../../../lib/langToFootnoteString';
// @ts-expect-error Seems to be a bug between patches on Astro's side?
const footnoteString = langToFootnoteString(Astro);
// This is an incredible hack!! Ahah
// This is a huge hack!! Ahah
// Not sure if safe, but seems to be
declare global {
var footnoteCounts:

2
frontend/src/content/blog/pt/voto-digital.mdx
View file

@ -1,5 +1,5 @@
---
title: 'Voto digital e como democratizar a democracia'
title: Voto digital e como democratizar a democracia
slug: voto-digital-e-como-democratizar-a-democracia
summary: >
Como podemos usar o voto digital para tornar a democracia

2
frontend/src/content/config.ts
View file

@ -7,6 +7,8 @@ const libraryCollection = defineCollection({
checkedOut: z.boolean(),
link: z.string().url(),
description: z.ostring(),
date: z.date(),
mainAuthor: z.ostring(),
}),
});

2
frontend/src/content/library/en/doughnut-economics.yaml
View file

@ -1,6 +1,8 @@
title: 'Doughnut Economics: Seven Ways to Think Like a 21st-Century Economist'
checkedOut: true
link: 'https://www.kobo.com/ie/en/ebook/doughnut-economics'
date: 2024-03-03
mainAuthor: Kate Raworth
description: >
I loved it and highly recommend it! It's a book about economics, but a very unorthodox one.
It has a degrowth side to it, but it's a great read for any person that wants a breath of

2
frontend/src/content/library/en/limits-to-growth-30.yaml
View file

@ -1,6 +1,8 @@
title: 'Limits to Growth: The 30-Year Update'
checkedOut: true
link: 'https://www.kobo.com/ie/en/ebook/limits-to-growth-1'
date: 2024-03-03
mainAuthor: D. Meadows, J Randers, D. Meadows
description: >
This book completely solidified my urge to study political economics and
system dynamics. It takes on a realistic but duly urgent approach about the problems

4
frontend/src/content/library/en/mission-economy.yaml
View file

@ -1,6 +1,8 @@
title: 'Mission Economy: A Moonshot Guide to Changing Capitalism'
checkedOut: true
link: 'https://www.kobo.com/us/en/ebook/mission-economy-1'
link: https://www.kobo.com/us/en/ebook/mission-economy-1
date: 2024-03-03
mainAuthor: Mariana Mazzucato
description: >
I've read about half of the book (maybe a bit more, if you don't count references, etc).
I can't say I was impressed. The book tries to use the case of Nasa's Apolo XIII project

12
frontend/src/content/library/en/the-strange-library.yaml Normal file
View file

@ -0,0 +1,12 @@
title: The Strange Library
checkedOut: true
link: https://www.kobo.com/us/en/ebook/the-strange-library-1
date: 2024-03-04
mainAuthor: Haruki Murakami
description: >
This is a Murakami book that's very different from his other works.
It's tiny and it's as much visual as verbal, with beautiful illustrations
intertwined with the story. The creepy, unsettling and sometimes magical plot
is not new to the author, and he still managed to make me feel new emotions:
this time of fear and loneliness. The only unfortunate part is that the book
is so short that these strange emotions can be more fleeting than one would wish.

2
frontend/src/content/library/pt/doughnut-economics.yaml
View file

@ -1,6 +1,8 @@
title: 'Economia Donut: Sete Formas de Pensar Como um Economista no Século XXI'
checkedOut: true
link: 'https://www.wook.pt/ebook/economia-donut-kate-raworth/21400895'
mainAuthor: Kate Raworth
date: 2024-03-03
description: >
'Adorei e recomendo vivamente! É um livro sobre economia, mas muito pouco ortodoxo.
Tem uma faceta decrescentista, mas é uma ótima leitura para qualquer pessoa que queira

2
frontend/src/content/library/pt/limits-to-growth-30.yaml
View file

@ -1,6 +1,8 @@
title: 'Limites do Crescimento: A Atualização de 30 Anos'
checkedOut: true
link: 'https://www.scribd.com/document/422266661/Limites-Do-Crescimento-A-Atualizacao-de-30-Anos'
date: 2024-03-03
mainAuthor: D. Meadows, J Randers, D. Meadows
description: >
Este livro solidificou por completo a minha vontade de estudar economia política
e dinâmica de sistemas. É uma abordagem realista mas devidamente urgente sobre os

2
frontend/src/content/library/pt/mission-economy.yaml
View file

@ -1,6 +1,8 @@
title: 'Economia de Missão: Um guia ousado e inovador para mudar o capitalismo'
checkedOut: true
link: 'https://www.wook.pt/ebook/economia-de-missao-mariana-mazzucato/25383261'
date: 2024-03-03
mainAuthor: Mariana Mazzucato
description: >
Já li cerca de metade do livro (talvez mais, se excluir referências, etc).
Não posso dizer que fiquei impressionado. O livro tenta usar o caso do projeto Apolo XIII

13
frontend/src/content/library/pt/the-strange-library.yaml Normal file
View file

@ -0,0 +1,13 @@
title: The Strange Library
checkedOut: true
link: https://www.fnac.pt/The-Strange-Library-Haruki-Murakami/a807074?NUMERICAL=Y#bl=FA_ebook
mainAuthor: Haruki Murakami
date: 2024-03-04
description: >
Este é um livro de Murakami que é muito diferente das suas outras obras.
É minúsculo e é tanto visual como verbal, contando com belíssimas ilustrações
que alternam com a estória. O enredo pertubador, desconcertante e por vezes
mágico não é novo para o autor, e ainda assim conseguiu provocar-me novas
emoções: desta vez, de medo e solidão. A única parte infeliz é que o livro é
tão curto que estas emoções estranhas podem ser mais efémeres do que gostaríamos.
(Ainda não foi traduzido para português)

6
frontend/src/layouts/Layout.astro
View file

@ -49,17 +49,17 @@ const hasFooter = !!footer;
</ul>
<ul class="flex gap-3">
<li>
<InlineLink href="https://social.filipesm.eu/@filipe">
<InlineLink isExternal href="https://social.filipesm.eu/@filipe">
Fediverso
</InlineLink>
</li>
<li>
<InlineLink href="https://git.filipesm.eu/filipe">
<InlineLink isExternal href="https://git.filipesm.eu/filipe">
<span class="italic">Software</span>
</InlineLink>
</li>
<li>
<InlineLink href="https://bandcamp.com/filipesm">
<InlineLink isExternal href="https://bandcamp.com/filipesm">
Bandcamp
</InlineLink>
</li>

34
frontend/src/pages/biblioteca/index.astro
View file

@ -5,9 +5,9 @@ import PageTitle from '../../components/PageTitle.astro';
import Layout from '../../layouts/Layout.astro';
import { getCollection } from 'astro:content';
const libraryItems = await getCollection('library', ({ id }) =>
id.startsWith('pt'),
);
const libraryItems = (
await getCollection('library', ({ id }) => id.startsWith('pt'))
).sort((a, b) => b.data.date.getTime() - a.data.date.getTime());
---
<Layout
@ -18,29 +18,33 @@ const libraryItems = await getCollection('library', ({ id }) =>
>
<header class="mb-10">
<PageTitle class="mb-3">Biblioteca</PageTitle>
<h2>
Livros, artigos, <span class="italic">etc.</span> que já li e que
recomendo ou que quero ler num futuro próximo. Se um item tiver uma marca
"<span class="text-primary-700">✓</span>", siginifca que eu já o li, vi, <span
class="italic">etc.</span
>
</h2>
<p>
Livros, artigos, <span class="italic">etc.</span> que já li e que recomendo
ou que quero ler num futuro próximo. Se um item tiver uma marca "<span
class="text-primary-700">✓</span
>", siginifca que eu já o li, vi, <span class="italic">etc.</span>
</p>
</header>
<ol class="grid lg:grid-cols-3 md:grid-cols-2 items-start gap-4">
<ol class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-4 items-start">
{
libraryItems.map(({ data: { title, description, link, checkedOut } }) => (
<CardLink link={link}>
libraryItems.map(
({ data: { title, description, link, checkedOut, mainAuthor } }) => (
<CardLink link={link} isExternal>
<article>
<div class="flex gap-2">
<h2 class="text-lg sm:text-xl font-medium break-words text-primary-700 block mb-3">
<h2 class="text-lg sm:text-xl font-medium break-words text-primary-700 block">
{title}
</h2>
{checkedOut && <span class="text-primary-700 text-3xl">✓</span>}
</div>
{mainAuthor && (
<h3 class="mb-3 sm:text-lg text-end">{mainAuthor}</h3>
)}
<p class="mb-5">{description}</p>
</article>
</CardLink>
))
),
)
}
</ol>
<Fragment slot="footer">

2
frontend/src/pages/blog/[slug]/index.astro
View file

@ -1,5 +1,5 @@
---
import BlogPostSubtitle from '../../../components/mdx/BlogPostSubtitle.astro';
import BlogPostSubtitle from '../../../components/BlogPostSubtitle.astro';
import ButtonLink from '../../../components/ButtonLink.astro';
import PageTitle from '../../../components/PageTitle.astro';
import Layout from '../../../layouts/Layout.astro';

12
frontend/src/pages/blog/index.astro
View file

@ -5,22 +5,24 @@ import CardLink from '../../components/CardLink.astro';
import PageTitle from '../../components/PageTitle.astro';
import Layout from '../../layouts/Layout.astro';
const posts = await getCollection('blog', ({ id }) => id.startsWith('en'));
const posts = (
await getCollection('blog', ({ id }) => id.startsWith('en'))
).sort((a, b) => b.data.publishDate.getTime() - a.data.publishDate.getTime());
---
<Layout title="Blog - Filipe Medeiros" ptUrl="/blogue" enUrl="/blog" lang="en">
<header class="mb-10">
<PageTitle class="mb-3">Blog</PageTitle>
<h2>Uma coleção de artigos que vou escrevendo. Sobretudo por diversão.</h2>
<p>Uma coleção de artigos que vou escrevendo. Sobretudo por diversão.</p>
</header>
<ol>
<ol class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-4 items-start">
{
posts.map(({ data: { title, publishDate, summary }, slug }) => (
<CardLink link={`/blog/${slug}`}>
<article class="flex flex-col gap-2">
<span class="text-lg sm:text-xl font-medium break-words text-primary-700">
<h2 class="text-lg sm:text-xl font-medium break-words text-primary-700">
{title}
</span>
</h2>
<time
datetime={publishDate.toLocaleDateString('pt', {
dateStyle: 'short',

2
frontend/src/pages/blogue/[slug]/index.astro
View file

@ -1,5 +1,5 @@
---
import BlogPostSubtitle from '../../../components/mdx/BlogPostSubtitle.astro';
import BlogPostSubtitle from '../../../components/BlogPostSubtitle.astro';
import ButtonLink from '../../../components/ButtonLink.astro';
import PageTitle from '../../../components/PageTitle.astro';
import Layout from '../../../layouts/Layout.astro';

12
frontend/src/pages/blogue/index.astro
View file

@ -6,7 +6,9 @@ import Layout from '../../layouts/Layout.astro';
import { getCollection } from 'astro:content';
const posts = await getCollection('blog', ({ id }) => id.startsWith('pt'));
const posts = (
await getCollection('blog', ({ id }) => id.startsWith('pt'))
).sort((a, b) => b.data.publishDate.getTime() - a.data.publishDate.getTime());
---
<Layout
@ -17,16 +19,16 @@ const posts = await getCollection('blog', ({ id }) => id.startsWith('pt'));
>
<header class="mb-10">
<PageTitle class="mb-3">Blogue</PageTitle>
<h2>Uma coleção de artigos que vou escrevendo. Sobretudo por diversão.</h2>
<p>Uma coleção de artigos que vou escrevendo. Sobretudo por diversão.</p>
</header>
<ol>
<ol class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-4 items-start">
{
posts.map(({ data: { title, publishDate, summary }, slug }) => (
<CardLink link={`/blogue/${slug}`}>
<article class="flex flex-col gap-2">
<span class="text-lg sm:text-xl font-medium break-words text-primary-700">
<h2 class="text-lg sm:text-xl font-medium break-words text-primary-700">
{title}
</span>
</h2>
<time
datetime={publishDate.toLocaleDateString('pt', {
dateStyle: 'short',

56
frontend/src/pages/home.astro
View file

@ -14,28 +14,41 @@ import Layout from '../layouts/Layout.astro';
<p class="mb-3">
I like animals, politics, reading about economics. I don't like to cook
(yet) and I don't like cold wind. Occasionally, I like to program some
stuff and take care of my <InlineLink href="https://git.filipesm.eu">
stuff and take care of my <InlineLink
isExternal
href="https://git.filipesm.eu"
>
{'little'}
</InlineLink>{' '}
<InlineLink href="https://social.filipesm.eu">{'corner'}</InlineLink> on
the internet.
<InlineLink isExternal href="https://social.filipesm.eu">
{'corner'}
</InlineLink> on the internet.
</p>
<p class="mb-3">
I'm an ecologial and environmental activist (I help <InlineLink
href="https://www.climaximo.pt/english/"
>
{'Climáximo'}
</InlineLink> and other organisations
I'm an ecologial and environmental activist (I help environmental
organisations
<InlineLink
isExternal
href="https://sicnoticias.pt/pais/2023-05-13-Gas-e-morte-morte-e-Gas-mais-de-150-ativistas-em-marcha-no-centro-de-Sines-b856581e"
>
{'whenever I can'}
{'from time to time'}
</InlineLink>) and I support <InlineLink
href="https://pt.wikipedia.org/wiki/Ecossocialismo"
isExternal
href="https://wikipedia.org/wiki/Ecossocialism"
>
{'ecosocialism CONFIRMAR'}
</InlineLink> (I'm a member of <InlineLink
isExternal
href="https://diem25.org"
>
{'ecosocialism'}
</InlineLink> (I'm a member of <InlineLink href="https://diem25.org">
{'DiEM25'}
</InlineLink>, of <InlineLink isExternal href="https://partidolivre.pt">
{'LIVRE'}
</InlineLink> and of the <InlineLink
isExternal
href="https://ecolecon.eu"
>
{'European Society of Ecological Economics CONFIRMAR'}
</InlineLink>).
</p>
<p class="mb-3">
@ -43,19 +56,25 @@ import Layout from '../layouts/Layout.astro';
That means I'm not really interested in making ultra-advanced robots, but
more interested in helping people from the whole world live together and
be happy. I'm in favor of <InlineLink
isExternal
href="https://www.w3.org/standards/faq#std"
class="italic"
>
{'standards'}
</InlineLink>, free libre open source software (<InlineLink
isExternal
href="https://git.filipesm.eu/filipe/personal-website"
>
{'just like this wesbite!'}
</InlineLink>), <InlineLink href="https://wikipedia.org/wiki/Copyleft">
</InlineLink>), <InlineLink
isExternal
href="https://wikipedia.org/wiki/Copyleft"
>
<span class="italic">{'copyleft'}</span> licenses
</InlineLink>
and
<InlineLink
isExternal
href="https://www.ica.coop/en/cooperatives/what-is-a-cooperative"
>
{'cooperatives'}
@ -63,22 +82,25 @@ import Layout from '../layouts/Layout.astro';
</p>
<p class="mb-3">
I'm very passionate about <InlineLink
isExternal
href="https://doughnuteconomics.org/about-doughnut-economics"
>
{'Doughnut Economics'}
</InlineLink> and political, social and ecological/environmental
economics. I used to be a progammer. These day I study <InlineLink
</InlineLink> and political, social and ecological/environmental economics.
I used to be a progammer. These day I study <InlineLink
isExternal
href="https://wikipedia.org/wiki/System_Dynamics"
>
{'system dynamics'}
</InlineLink>
at the <InlineLink href="https://www.uib.no">
at the <InlineLink isExternal href="https://www.uib.no">
{'University of Bergen'}
</InlineLink>, so that one day I can be an economist or build policies
(not to be a politician); who knows, maybe for the Europen Union.
</p>
<p class="mb-3">
I live (at the moment) in <InlineLink
isExternal
href="https://www.bergen.kommune.no"
>
{'Bergen, Norway'}
@ -93,10 +115,12 @@ import Layout from '../layouts/Layout.astro';
<p>
This website tries to be as sustainable as possible: we save energy on
your device and on servers. It's powered by renewables (courtesy of <InlineLink
isExternal
href="https://uberspace.de"
>
{'Uberspace'}
</InlineLink>) and heavily inspired by <InlineLink
isExternal
href="https://solar.lowtechmagazine.com"
>
{"Low Tech Magazine's solar version"}

60
frontend/src/pages/index.astro
View file

@ -19,27 +19,38 @@ import Layout from '../layouts/Layout.astro';
<p class="mb-3">
Gosto de política, de ler sobre economia e de animais. Não gosto de
cozinhar (ainda) nem de vento frio. Ocasionalmente gosto de programar
algumas coisas e manter o meu <InlineLink href="https://git.filipesm.eu">
algumas coisas e manter o meu <InlineLink
isExternal
href="https://git.filipesm.eu"
>
{'cantinho'}
</InlineLink>{' '}
<InlineLink href="https://social.filipesm.eu">{'digital'}</InlineLink>.
<InlineLink isExternal href="https://social.filipesm.eu">
{'digital'}
</InlineLink>.
</p>
<p class="mb-3">
Sou ativista ecológico e ambiental (ajudo a <InlineLink
href="https://climaximo.pt"
>
{'Climáximo'}
</InlineLink> e outras organizações
Sou ativista ecológico e ambiental (ajudo organizações de ativismo
ambiental
<InlineLink
isExternal
href="https://sicnoticias.pt/pais/2023-05-13-Gas-e-morte-morte-e-Gas-mais-de-150-ativistas-em-marcha-no-centro-de-Sines-b856581e"
>
{'quando posso'}
{'de tempos a tempos'}
</InlineLink>) e apoio o <InlineLink
isExternal
href="https://pt.wikipedia.org/wiki/Ecossocialismo"
>
{'ecosocialismo'}
</InlineLink> (sou membro do <InlineLink href="https://diem25.org/pt/">
</InlineLink> (sou membro do <InlineLink
isExternal
href="https://diem25.org/pt/"
>
{'DiEM25'}
</InlineLink>, do <InlineLink isExternal href="https://partidolivre.pt">
{'LIVRE'}
</InlineLink> e da <InlineLink isExternal href="https://ecolecon.eu">
{'Sociedade Europeia de Economia Ecológia CONFIRMAR'}
</InlineLink>).
</p>
<p class="mb-3">
@ -47,21 +58,27 @@ import Layout from '../layouts/Layout.astro';
justa e sustentável. Isso significa que não estou muito interessado em
fazer robôs ultra-avançados, mas mais interessado em ajudar as pessoas de
todo o mundo a conviver e serem felizes. Sou a favor de <InlineLink
isExternal
href="https://www.w3.org/standards/faq#std"
class="italic"
>
{'standards'}
</InlineLink>, <span class="italic">software</span> de código aberto livre
e grátis (<InlineLink
isExternal
href="https://git.filipesm.eu/filipe/personal-website"
>
{'como é este site!'}
</InlineLink>), <InlineLink href="https://pt.wikipedia.org/wiki/Copyleft">
</InlineLink>), <InlineLink
isExternal
href="https://pt.wikipedia.org/wiki/Copyleft"
>
{'licenças '}
<span class="italic">{'copyleft'}</span>
</InlineLink>
e de
<InlineLink
isExternal
href="https://www.ica.coop/en/cooperatives/what-is-a-cooperative"
>
{'cooperativas'}
@ -69,22 +86,27 @@ import Layout from '../layouts/Layout.astro';
</p>
<p class="mb-3">
Sou apaixonado pela <InlineLink
isExternal
href="https://doughnuteconomics.org/about-doughnut-economics"
>
{'Economia do Donut'}
</InlineLink> e por economia política, social e ambiental/ecológica. Já
fui programador. Hoje estudo <InlineLink
</InlineLink> e por economia política, social e ambiental/ecológica. Já fui
programador. Hoje estudo <InlineLink
isExternal
href="https://pt.wikipedia.org/wiki/Din%C3%A2mica_de_sistemas"
>
{'dinâmica de sistemas'}
</InlineLink>
na <InlineLink href="https://www.uib.no">
na <InlineLink isExternal href="https://www.uib.no">
{'Universidade de Bergen'}
</InlineLink>, para um dia poder ser economista ou construir políticas
(não ser "político"); quem sabe, talvez para a União Europeia.
</p>
<p class="mb-3">
Moro (neste momento) em <InlineLink href="https://www.bergen.kommune.no">
Moro (neste momento) em <InlineLink
isExternal
href="https://www.bergen.kommune.no"
>
{'Bergen, Noruega'}
</InlineLink>.
</p>
@ -95,14 +117,12 @@ import Layout from '../layouts/Layout.astro';
uma foto minha!
</p>
<p>
Este <span class="italic">site</span> tenta ser o mais sustentável
possível: poupamos energia no teu dispositivo e em servidores. É
alimentado por energia renóvavel (cortesia do <InlineLink
href="https://uberspace.de"
>
Este <span class="italic">site</span> tenta ser o mais sustentável possível:
poupamos energia no teu dispositivo e em servidores. É alimentado por energia
renóvavel (cortesia do <InlineLink isExternal href="https://uberspace.de">
{'Uberspace'}
</InlineLink>) e teve muita inspiração da
<InlineLink href="https://solar.lowtechmagazine.com">
<InlineLink isExternal href="https://solar.lowtechmagazine.com">
{'versão solar da Low Tech Magazine'}
</InlineLink>.
</p>

41
frontend/src/pages/library/index.astro
View file

@ -5,9 +5,9 @@ import PageTitle from '../../components/PageTitle.astro';
import Layout from '../../layouts/Layout.astro';
import { getCollection } from 'astro:content';
const libraryItems = await getCollection('library', ({ id }) =>
id.startsWith('en'),
);
const libraryItems = (
await getCollection('library', ({ id }) => id.startsWith('en'))
).sort((a, b) => b.data.date.getTime() - a.data.date.getTime());
---
<Layout
@ -18,25 +18,34 @@ const libraryItems = await getCollection('library', ({ id }) =>
>
<header class="mb-10">
<PageTitle class="mb-3">Library</PageTitle>
<h2>
Books, articles, <span class="italic">etc.</span> that I've read and
recommend or that I want to check out in the near future. If an item has a
checkmark "<span class="text-primary-700">✓</span>", that means I've read
it, listened to it,
<p>
Books, articles, <span class="italic">etc.</span> that I've read and recommend
or that I want to check out in the near future. If an item has a checkmark
"<span class="text-primary-700">✓</span>", that means I've read it,
listened to it,
<span class="italic">etc.</span>
</h2>
</p>
</header>
<ol>
<ol class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-4 items-start">
{
libraryItems.map(({ data: { title, description, link, checkedOut } }) => (
<CardLink link={link}>
<span class="text-lg sm:text-xl font-medium break-words text-primary-700 block mb-3">
libraryItems.map(
({ data: { title, description, link, checkedOut, mainAuthor } }) => (
<CardLink link={link} isExternal>
<article>
<div class="flex gap-2">
<h2 class="text-lg sm:text-xl font-medium break-words text-primary-700 block">
{title}
</span>
<p class="mb-5">{description}</p>
</h2>
{checkedOut && <span class="text-primary-700 text-3xl">✓</span>}
</div>
{mainAuthor && (
<h3 class="mb-3 sm:text-lg text-end">{mainAuthor}</h3>
)}
<p class="mb-5">{description}</p>
</article>
</CardLink>
))
),
)
}
</ol>
<Fragment slot="footer">