luke-else/luke-else.co.uk
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'development' of ssh://git.luke-else.co.uk:222/luke-else/luke-else.co.uk into development
All checks were successful
Build and Push Development Docker Image / build-and-push (push) Successful in 1m25s
Details

Browse Source
This commit is contained in:
Luke Else
2025-04-06 23:00:53 +01:00
parent 33ddd2add0 ce38e88885
commit 931e4d2abe
3 changed files with 58 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/routes/repos/+page.svelte
View File

@@ -2,8 +2,9 @@
import { onMount } from "svelte";
import { Toast, ToastType } from "$lib/toast";
import { repos, loadRepos, addToast } from "$lib/stores";
import { timeSince } from "$lib/api/git";
import { timeSince, checkImage, IMAGE_URL_SUFFIX } from "$lib/api/git";
import Card from "$lib/components/Cards/Card.svelte";
import SlidingCard from "$lib/components/Cards/SlidingCard.svelte";
import Loading from "$lib/components/Loading.svelte";
onMount(loadRepos);
@@ -17,20 +18,44 @@
<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>
{#await checkImage(repo)}
<Loading />
{:then hasImage}
{#if hasImage}
<SlidingCard>
<div slot="header">
<h2>{repo.name}</h2>
{repo.language}
</div>
<div slot="content">
<p class="not-required">{@html repo.description}</p>
</div>
<div slot="sliding-content">
<img width="100%" src="{repo.html_url}{IMAGE_URL_SUFFIX}" alt="{repo.name}" />
</div>
<div slot="footer">
<!-- svelte-ignore a11y-invalid-attribute -->
<a href="{repo.html_url}">{repo.name}</a>
{timeSince(repo.updated_at)}
</div>
</SlidingCard>
{:else}
<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>
{/if}
{/await}
{/each}
</div>
{:else}