mirror of https://github.com/VERT-sh/VERT.git
Add fallback messages, formatting
Adds fallback messages to github contributors and top donors format files
This commit is contained in:
parent
f8d4d546a8
commit
2a460c4275
|
@ -2,7 +2,7 @@
|
|||
import Panel from "$lib/components/visual/Panel.svelte";
|
||||
import { HeartHandshakeIcon } from "lucide-svelte";
|
||||
|
||||
let { mainContribs, ghContribs } = $props();
|
||||
let { mainContribs, ghContribs } = $props();
|
||||
</script>
|
||||
|
||||
{#snippet contributor(name: string, role: string, avatar: string)}
|
||||
|
@ -21,51 +21,68 @@
|
|||
{/snippet}
|
||||
|
||||
<Panel class="flex flex-col gap-8 p-6">
|
||||
<h2 class="text-2xl font-bold">
|
||||
<HeartHandshakeIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-blue-300 p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Credits
|
||||
</h2>
|
||||
<h2 class="text-2xl font-bold">
|
||||
<HeartHandshakeIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-blue-300 p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Credits
|
||||
</h2>
|
||||
|
||||
<!-- Main Contributors -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each mainContribs as contrib}
|
||||
{@const { name, role, avatar } = contrib}
|
||||
{@render contributor(name, role, avatar)}
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Main Contributors -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each mainContribs as contrib}
|
||||
{@const { name, role, avatar } = contrib}
|
||||
{@render contributor(name, role, avatar)}
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- GitHub Contributors -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-base font-bold">GitHub Contributors</h2>
|
||||
<p class="text-sm text-muted font-normal">
|
||||
Big thanks to all these people for helping out!
|
||||
<a
|
||||
class="text-blue-500 font-normal hover:underline"
|
||||
href="https://github.com/not-nullptr/VERT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Want to help too?
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each ghContribs as contrib}
|
||||
{@const { name, avatar } = contrib}
|
||||
<img
|
||||
src={avatar}
|
||||
alt={name}
|
||||
title={name}
|
||||
class="w-10 h-10 rounded-full"
|
||||
/>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
<!-- GitHub Contributors -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-base font-bold">GitHub Contributors</h2>
|
||||
{#if ghContribs && ghContribs.length > 0}
|
||||
<p class="text-base text-muted font-normal">
|
||||
Big thanks to all these people for helping out!
|
||||
<a
|
||||
class="text-blue-500 font-normal hover:underline"
|
||||
href="https://github.com/not-nullptr/VERT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Want to help too?
|
||||
</a>
|
||||
</p>
|
||||
{:else}
|
||||
<p class="text-base text-muted font-normal italic">
|
||||
Seems like no one has contributed yet...
|
||||
<a
|
||||
class="text-blue-500 font-normal hover:underline"
|
||||
href="https://github.com/not-nullptr/VERT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
be the first to contribute!
|
||||
</a>
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{#if ghContribs && ghContribs.length > 0}
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each ghContribs as contrib}
|
||||
{@const { name, avatar } = contrib}
|
||||
<img
|
||||
src={avatar}
|
||||
alt={name}
|
||||
title={name}
|
||||
class="w-10 h-10 rounded-full"
|
||||
/>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</Panel>
|
||||
|
|
|
@ -1,8 +1,13 @@
|
|||
<script lang="ts">
|
||||
import Panel from "$lib/components/visual/Panel.svelte";
|
||||
import { CalendarHeartIcon, HandCoinsIcon, HeartIcon, WalletIcon } from "lucide-svelte";
|
||||
import {
|
||||
CalendarHeartIcon,
|
||||
HandCoinsIcon,
|
||||
HeartIcon,
|
||||
WalletIcon,
|
||||
} from "lucide-svelte";
|
||||
|
||||
let { donors } = $props();
|
||||
let { donors } = $props();
|
||||
</script>
|
||||
|
||||
{#snippet donor(name: string, amount: number | string, avatar: string)}
|
||||
|
@ -18,96 +23,95 @@
|
|||
{/snippet}
|
||||
|
||||
<Panel class="flex flex-col gap-8 p-6">
|
||||
<div class="flex flex-col gap-3">
|
||||
<h2 class="text-2xl font-bold">
|
||||
<HeartIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-rose-300 p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Donate to VERT
|
||||
</h2>
|
||||
<p class="text-base font-normal">
|
||||
With your support, we can keep maintaining and improving
|
||||
VERT.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-col gap-3">
|
||||
<h2 class="text-2xl font-bold">
|
||||
<HeartIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-rose-300 p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Donate to VERT
|
||||
</h2>
|
||||
<p class="text-base font-normal">
|
||||
With your support, we can keep maintaining and improving VERT.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-3 w-full">
|
||||
<div class="flex gap-2 w-full">
|
||||
<button
|
||||
class="flex-1 p-4 rounded-lg bg-rose-300 text-black flex items-center justify-center"
|
||||
>
|
||||
<HandCoinsIcon
|
||||
size="24"
|
||||
class="inline-block mr-2"
|
||||
/>
|
||||
One-time
|
||||
</button>
|
||||
<div class="flex flex-col gap-3 w-full">
|
||||
<div class="flex gap-2 w-full">
|
||||
<button
|
||||
class="flex-1 p-4 rounded-lg bg-rose-300 text-black flex items-center justify-center"
|
||||
>
|
||||
<HandCoinsIcon size="24" class="inline-block mr-2" />
|
||||
One-time
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="flex-1 p-4 rounded-lg bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<CalendarHeartIcon
|
||||
size="24"
|
||||
class="inline-block mr-2"
|
||||
/>
|
||||
Monthly
|
||||
</button>
|
||||
</div>
|
||||
<div class="flex gap-3 w-full">
|
||||
<button
|
||||
class="bg-rose-300 text-black p-4 rounded-lg flex-1"
|
||||
>$1 USD</button
|
||||
>
|
||||
<button
|
||||
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
|
||||
>$5 USD</button
|
||||
>
|
||||
<button
|
||||
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
|
||||
>$10 USD</button
|
||||
>
|
||||
<div class="relative flex items-center flex-[2]">
|
||||
<span class="absolute left-3 text-gray-500">$</span>
|
||||
<input
|
||||
type="number"
|
||||
class="pl-8 pr-2 rounded-lg border border-gray-300 dynadark:border-gray-500 w-full h-full bg-button text-black dynadark:text-white"
|
||||
placeholder="Custom"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="flex-1 p-4 rounded-lg bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<CalendarHeartIcon size="24" class="inline-block mr-2" />
|
||||
Monthly
|
||||
</button>
|
||||
</div>
|
||||
<div class="flex gap-3 w-full">
|
||||
<button class="bg-rose-300 text-black p-4 rounded-lg flex-1"
|
||||
>$1 USD</button
|
||||
>
|
||||
<button
|
||||
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
|
||||
>$5 USD</button
|
||||
>
|
||||
<button
|
||||
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
|
||||
>$10 USD</button
|
||||
>
|
||||
<div class="relative flex items-center flex-[2]">
|
||||
<span class="absolute left-3 text-gray-500">$</span>
|
||||
<input
|
||||
type="number"
|
||||
class="pl-8 pr-2 rounded-lg border border-gray-300 dynadark:border-gray-500 w-full h-full bg-button text-black dynadark:text-white"
|
||||
placeholder="Custom"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row justify-center w-full">
|
||||
<p class="text-muted text-sm flex-[4] flex items-center">
|
||||
Payments and subscription management <br /> are handled through
|
||||
Liberapay
|
||||
</p>
|
||||
<div class="flex flex-row justify-center w-full">
|
||||
<p class="text-muted text-sm flex-[4] flex items-center">
|
||||
Payments and subscription management <br /> are handled through Liberapay
|
||||
</p>
|
||||
|
||||
<button
|
||||
class="flex-1 p-3 rounded-3xl bg-rose-300 text-black flex items-center justify-center"
|
||||
>
|
||||
<WalletIcon size="24" class="inline-block mr-2" />
|
||||
Pay Now
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
class="flex-1 p-3 rounded-3xl bg-rose-300 text-black flex items-center justify-center"
|
||||
>
|
||||
<WalletIcon size="24" class="inline-block mr-2" />
|
||||
Pay Now
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- top donors -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-base font-bold">Our top donors</h2>
|
||||
<p class="text-base text-muted font-normal">
|
||||
People like these fuel the things we love to do.
|
||||
Thank you so much!
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-base font-bold">Our top donors</h2>
|
||||
{#if donors && donors.length > 0}
|
||||
<p class="text-base text-muted font-normal">
|
||||
People like these fuel the things we love to do. Thank you
|
||||
so much!
|
||||
</p>
|
||||
{:else}
|
||||
<p class="text-base text-muted font-normal italic">
|
||||
Seems like no one has donated yet... so if you do, you will
|
||||
pop up here!
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each donors as dono}
|
||||
{@const { name, amount, avatar } = dono}
|
||||
{@render donor(name, amount, avatar)}
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
{#if donors && donors.length > 0}
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
{#each donors as dono}
|
||||
{@const { name, amount, avatar } = dono}
|
||||
{@render donor(name, amount, avatar)}
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</Panel>
|
||||
|
|
|
@ -4,35 +4,32 @@
|
|||
</script>
|
||||
|
||||
<Panel class="flex flex-col gap-4 p-6">
|
||||
<h2 class="text-2xl font-bold">
|
||||
<LinkIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-violet-400 bg- p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Resources
|
||||
</h2>
|
||||
<div class="flex gap-3">
|
||||
<a
|
||||
href="https://discord.gg/kqevGxYPak"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<MessageCircleMoreIcon
|
||||
size="24"
|
||||
class="inline-block mr-2"
|
||||
/>
|
||||
Discord server
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/not-nullptr/VERT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<GithubIcon size="24" class="inline-block mr-2" />
|
||||
Source code
|
||||
</a>
|
||||
</div>
|
||||
</Panel>
|
||||
<h2 class="text-2xl font-bold">
|
||||
<LinkIcon
|
||||
size="40"
|
||||
class="inline-block -mt-1 mr-2 bg-violet-400 bg- p-1.5 rounded-full"
|
||||
color="black"
|
||||
/>
|
||||
Resources
|
||||
</h2>
|
||||
<div class="flex gap-3">
|
||||
<a
|
||||
href="https://discord.gg/kqevGxYPak"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<MessageCircleMoreIcon size="24" class="inline-block mr-2" />
|
||||
Discord server
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/not-nullptr/VERT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
|
||||
>
|
||||
<GithubIcon size="24" class="inline-block mr-2" />
|
||||
Source code
|
||||
</a>
|
||||
</div>
|
||||
</Panel>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
export { default as Credits } from './Credits.svelte';
|
||||
export { default as Donate } from './Donate.svelte';
|
||||
export { default as Resources } from './Resources.svelte';
|
||||
export { default as Why } from './Why.svelte';
|
||||
export { default as Credits } from "./Credits.svelte";
|
||||
export { default as Donate } from "./Donate.svelte";
|
||||
export { default as Resources } from "./Resources.svelte";
|
||||
export { default as Why } from "./Why.svelte";
|
||||
|
|
|
@ -189,15 +189,15 @@
|
|||
<div class="flex-grow">
|
||||
{@render children()}
|
||||
</div>
|
||||
<div
|
||||
class="w-full h-14 border-t border-separator relative"
|
||||
>
|
||||
<div class="w-full h-14 border-t border-separator relative">
|
||||
<Footer
|
||||
class="w-full h-full"
|
||||
items={{
|
||||
"Privacy policy": "#",
|
||||
"Source code": "https://github.com/not-nullptr/VERT",
|
||||
"Discord server": "https://discord.gg/kqevGxYPak",
|
||||
"Source code":
|
||||
"https://github.com/not-nullptr/VERT",
|
||||
"Discord server":
|
||||
"https://discord.gg/kqevGxYPak",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue