OpenAuth_views/src/pages/User/Pages/Home.svelte

47 lines
1.0 KiB
Svelte

<script lang="typescript">
import { onMount } from "svelte";
import Box from "./Box.svelte";
import BoxItem from "./BoxItem.svelte";
import { getFeatured, getName } from "../api";
export let loading = false;
const featured = getFeatured();
let name = "LOADING...";
onMount(() => {
loading = true;
getName().then((n) => {
loading = false;
name = n;
});
});
</script>
<style>
a {
color: var(--on-surface);
}
</style>
<Box>
<h1>{name}</h1>
<p>
{name}
is a
<a href="/user">OAuth2.0</a>
Service powered by
<a href="/user">OpenAuth</a>. It's goal is to bundle multiple services
logins under one central address.
</p>
<p>Services currently featured by {name}:</p>
{#await featured then clients}
{#each clients as client}
<BoxItem name={client.name} value={client.website} highlight={false}>
<a slot="value" href={client.website}>{client.website}</a>
<p>{client.description}</p>
</BoxItem>
{/each}
{/await}
</Box>