39 lines
1.4 KiB
Svelte
39 lines
1.4 KiB
Svelte
<script lang="ts">
|
|
import { onMount } from "svelte";
|
|
import { Toast, ToastType } from "$lib/toast";
|
|
import { repos, loadRepos, addToast } from "$lib/stores";
|
|
import { timeSince } from "$lib/api/git";
|
|
import Card from "$lib/components/Cards/Card.svelte";
|
|
|
|
onMount(loadRepos);
|
|
</script>
|
|
|
|
<h1>My Projects</h1>
|
|
<p>This here is a list of my most recently worked on projects. Note this does not show any private repositories. For more in depth information <a href="https://git.luke-else.co.uk">Click Here</a>.</p>
|
|
|
|
<div class="container">
|
|
{#if $repos.length > 0}
|
|
<div style="display: none;">{addToast(new Toast("See a snapshot of my latest work.", ToastType.Info, true, 8_000))}</div>
|
|
<div class="cards">
|
|
{#each $repos as repo}
|
|
<Card>
|
|
<div slot="header">
|
|
<h2>{repo.name}</h2>
|
|
{repo.language}
|
|
</div>
|
|
<div slot="content">
|
|
<p class="not-required">{@html repo.description}</p>
|
|
</div>
|
|
<div slot="footer">
|
|
<!-- svelte-ignore a11y-invalid-attribute -->
|
|
<a href="{repo.html_url}">{repo.name}</a>
|
|
{timeSince(repo.updated_at)}
|
|
</div>
|
|
</Card>
|
|
{/each}
|
|
</div>
|
|
{:else}
|
|
<p>Loading repositories...</p>
|
|
{/if}
|
|
</div>
|