RomanNum3ral
/
vert
mirror of https://github.com/VERT-sh/VERT.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Completed dark mode and about page changes

This commit is contained in:
Realmy 2024-11-13 20:06:08 +01:00
parent 6bb920592d
commit 3fa26505b1
4 changed files with 29 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/app.scss
View File

@ -36,18 +36,18 @@
--fg: hsl(0, 0%, 10%);
--fg-muted: hsl(0, 0%, 50%);
--fg-muted-alt: hsl(0, 0%, 75%);
--fg-highlight: hsl(303, 52%, 42%);
--fg-highlight: hsl(303, 61%, 47%);
--fg-failure: hsl(0, 67%, 49%);
}
@mixin dark {
--accent-bg: hsl(303, 73%, 35%);
--accent-fg: hsl(0, 0%, 90%);
--bg: hsl(0, 0%, 10%);
--accent-bg: hsl(304, 41%, 21%);
--accent-fg: hsl(303, 73%, 81%);
--bg: hsl(0, 0%, 8%);
--fg: hsl(0, 0%, 90%);
--fg-muted: hsl(0, 0%, 65%);
--fg-muted-alt: hsl(0, 0%, 50%);
--fg-highlight: hsl(303, 52%, 60%);
--fg-muted: hsl(0, 0%, 50%);
--fg-muted-alt: hsl(0, 0%, 25%);
--fg-highlight: hsl(303, 64%, 65%);
--fg-failure: hsl(0, 67%, 80%);
}

2
src/lib/components/functional/FancyMenu.svelte
View File

@ -38,7 +38,7 @@
{/if}
{#each links as { name, url } (url)}
<a
class="w-1/2 px-2 h-[calc(100%-16px)] mt-2 flex items-center justify-center rounded-xl relative font-display overflow-hidden"
class="w-1/2 px-2 h-[calc(100%-16px)] mt-2 flex items-center justify-center rounded-xl relative overflow-hidden font-medium"
href={url}
onclick={() => {
if (shouldGoBack) {

2
src/routes/+layout.svelte
View File

@ -88,7 +88,7 @@
<div class="flex justify-center mb-5 lg:hidden">
<a
href="/"
class="px-6 relative h-16 mr-3 justify-center items-center bg-accent-background fill-accent-foreground rounded-xl md:hidden flex"
class="px-4 relative h-14 mr-3 justify-center items-center bg-accent-background fill-accent-foreground rounded-xl md:hidden flex"
>
<div class="h-6 w-24 items-center flex justify-center">
<Logo />

30
src/routes/about/+page.svelte
View File

@ -63,18 +63,28 @@
class="font-display text-3xl mt-12 text-transition"
style="--delay: {5 * multiplier}ms"
>
👨‍💻 source code
🔗 resources
</h2>
<p class="mt-6 text-transition" style="--delay: {6 * multiplier}ms">
VERT is licensed under AGPL-3.0, and the source code can be found on <a
class="hover:underline font-medium text-foreground-highlight"
href="https://github.com/not-nullptr/VERT">GitHub</a
>.
</p>
<ul class="list-disc list-inside mt-6">
<li class="text-transition" style="--delay: {6 * multiplier}ms">
<a
href="https://github.com/notnullptr/VERT"
class="text-foreground-highlight hover:underline">Source code</a
> (hosted on GitHub, licensed under AGPL-3.0)
</li>
<li class="text-transition" style="--delay: {7 * multiplier}ms">
<a
href="https://discord.gg/8XXZ7TFFrK"
class="text-foreground-highlight hover:underline"
>Discord server</a
> (for chit-chat, suggestions, and support)
</li>
</ul>
<h2
class="font-display text-3xl mt-12 text-transition"
style="--delay: {7 * multiplier}ms"
style="--delay: {8 * multiplier}ms"
>
🎨 credits
</h2>
@ -83,7 +93,7 @@
<div class="hover:scale-105 w-56 transition-transform">
<div
class="border-2 credit-transition border-solid border-foreground-muted-alt rounded-2xl overflow-hidden"
style="--delay: {i * 50 + multiplier * 8}ms;"
style="--delay: {i * 50 + multiplier * 9}ms;"
>
<a class="w-48" href={credit.url} target="_blank">
<img src={credit.avatar} alt="{credit.name}'s avatar" />
@ -101,7 +111,7 @@
<p
class="text-foreground-muted text-base mt-10 text-transition"
style="--delay: {9 * multiplier}ms"
style="--delay: {10 * multiplier}ms"
>
(obviously inspired by <a
href="https://cobalt.tools"