all repos — website @ main

Unnamed repository; edit this file 'description' to name the repository.

src/components/LinkList.astro (view raw)

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 
---
import type { Link } from "@/types";

interface Props {
	links: Link[];
}
const { links } = Astro.props;
---

<ul>
    {links.map((link) => (
   	  <li>
          <a class="link" href={link.href}>{link.title}</a>
      </li>
    ))}
</ul>

<style>
ul {
    display: inline-flex;
    flex-direction: column;
    gap: 0.5rem;
    list-style: none;

    li {
        margin-left: 2ch;
    }

    a {
        --fg: var(--subtext1);

        display: inline-flex;
        align-items: center;
        gap: 1ch;

        font-size: 1.25rem;
        font-weight: 500;

        svg {
            width: 1.5rem;
            height: 1.5rem;
        }
    }
}
</style>