Rewrite page in Svelte 5 #49
3 changed files with 42 additions and 3 deletions
|
@ -0,0 +1,24 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
let {service} = $props();
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col border-t-4 rounded-xl bg-black/55 border-maintenance p-4 gap-y-2 w-[30rem] h-48">
|
||||
<div class="flex flex-row justify-between pb-4">
|
||||
<div class="flex flex-row">
|
||||
<h1>ICO</h1>
|
||||
<a href={service.href} class="text-accent font-bold hover:text-primary">{service.name}</a>
|
||||
</div>
|
||||
|
||||
<h1 class="border-b-2 rounded-md text-sm text-center w-16 text-maintenance border-maintenance">Loading</h1>
|
||||
</div>
|
||||
<p class="text-sm text-center text-accent text-wrap">{service.desc}</p>
|
||||
<p class="text-sm text-center text-destructive">{service.warn}</p>
|
||||
<div class="flex flex-row justify-around mt-auto">
|
||||
<a class="text-sm border-x-2 rounded-md px-2 text-accent hover:border-primary hover:text-primary" href={service.href}>Open</a>
|
||||
{#if service.extLink}
|
||||
<a class="text-sm border-x-2 rounded-md px-2 text-accent hover:border-primary hover:text-primary" href={service.extLink}>Official Site</a>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
|
@ -1,8 +1,8 @@
|
|||
<script lang="ts">
|
||||
import {page} from "$app/stores";
|
||||
import { Button } from "$lib/components/ui/button"
|
||||
import {page} from "$app/stores";
|
||||
import { Button } from "$lib/components/ui/button";
|
||||
|
||||
const button = "border-t-2 bg-black/50 hover:bg-black/70 hover:border-primary w-28";
|
||||
const button = "border-t-2 bg-black/55 hover:bg-black/70 hover:border-primary w-28";
|
||||
|
||||
</script>
|
||||
|
||||
|
|
|
@ -0,0 +1,15 @@
|
|||
<script lang="ts">
|
||||
import pages from '$lib/components/pages.json';
|
||||
import Card from "$lib/components/Card.svelte";
|
||||
|
||||
const services = pages.services;
|
||||
</script>
|
||||
|
||||
<title>Services</title>
|
||||
<meta name="description" content="Overview of Services running on neshweb.net">
|
||||
|
||||
<div class="flex flex-row flex-wrap justify-center gap-10 p-8 overflow-auto h-full">
|
||||
{#each services as service}
|
||||
<Card {service} />
|
||||
{/each}
|
||||
</div>
|
Loading…
Reference in a new issue