Neshweb-Sites/main-site
Neshweb-Sites/main-site
1
0
Fork 0
Code Issues 2 Pull requests Releases 9 Packages Activity Actions

Rewrite page in Svelte 5 #49

Merged
Neshura merged 94 commits from rewrite/svelte into main 2024-01-06 14:12:09 +00:00
Conversation 0 Commits 94 Files changed 109 +16 -20
2 changed files with 16 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit c71684b7d9 - Show all commits

14
src/lib/components/ServiceCard.svelte
View file

@ -89,7 +89,7 @@
{:else}{/if} {:else}{/if}
<a <a
href={service.href} href={service.href}
class="font-bold text-accent {hover.title ? 'text-primary' : 'text-secondary'}" class="font-bold {!hover.title || 'text-secondary'}"
>{service.name}</a >{service.name}</a
> >
{#if hover.title} {#if hover.title}
@ -98,7 +98,7 @@
class="grid items-center" class="grid items-center"
> >
<OpenInNewWindow <OpenInNewWindow
color={hover.title ? 'hsl(var(--primary))' : 'hsl(var(--secondary)'} color={hover.title ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
class="self-center" class="self-center"
/> />
</div> </div>
@ -138,11 +138,11 @@
: 'Loading'} : 'Loading'}
</h1> </h1>
</div> </div>
<p class="text-wrap text-center text-sm text-accent">{service.desc}</p> <p class="text-wrap text-center text-sm">{service.desc}</p>
<p class="text-center text-sm font-bold text-destructive">{service.warn}</p> <p class="text-center text-sm font-bold text-destructive">{service.warn}</p>
<div class="grid {service.extLink ? 'grid-cols-2' : 'grid-cols-1'} mt-auto justify-items-center"> <div class="grid {service.extLink ? 'grid-cols-2' : 'grid-cols-1'} mt-auto justify-items-center">
<a <a
class="flex flex-row rounded-md border-x-2 px-2 text-sm text-accent hover:border-primary hover:text-primary" class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
href={service.href} href={service.href}
on:mouseover={() => (hover.link = true)} on:mouseover={() => (hover.link = true)}
on:mouseleave={() => (hover.link = false)} on:mouseleave={() => (hover.link = false)}
@ -154,7 +154,7 @@
class="grid items-center pl-1 pr-0" class="grid items-center pl-1 pr-0"
> >
<OpenInNewWindow <OpenInNewWindow
color={hover.link ? 'hsl(var(--primary))' : 'hsl(var(--secondary)'} color={hover.link ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
class="self-center" class="self-center"
/> />
</div> </div>
@ -162,7 +162,7 @@
</a> </a>
{#if service.extLink} {#if service.extLink}
<a <a
class="flex flex-row rounded-md border-x-2 px-2 text-sm text-accent hover:border-primary hover:text-primary" class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
href={service.extLink} href={service.extLink}
on:mouseover={() => (hover.ext = true)} on:mouseover={() => (hover.ext = true)}
on:mouseleave={() => (hover.ext = false)} on:mouseleave={() => (hover.ext = false)}
@ -174,7 +174,7 @@
class="grid items-center pl-1 pr-0" class="grid items-center pl-1 pr-0"
> >
<OpenInNewWindow <OpenInNewWindow
color={hover.ext ? 'hsl(var(--primary))' : 'hsl(var(--secondary)'} color={hover.ext ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
class="self-center" class="self-center"
/> />
</div> </div>

22
src/routes/Header.svelte
View file

@ -2,7 +2,7 @@
import { page } from '$app/stores'; import { page } from '$app/stores';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
const button = 'border-t-2 bg-black/55 hover:bg-black/70 hover:border-primary w-28'; const button = 'border-t-2 bg-black/55 hover:bg-black/70 hover:border-secondary w-28';
</script> </script>
<ul <ul
@ -12,9 +12,8 @@
<Button <Button
variant="ghost" variant="ghost"
href="/" href="/"
class="{button} + {$page.url.pathname === '/' class="{button} + {!($page.url.pathname === '/')
? 'border-primary text-primary' || 'border-secondary text-secondary'}"
: 'text-accent'}"
> >
Home Home
</Button> </Button>
@ -23,9 +22,8 @@
<Button <Button
variant="ghost" variant="ghost"
href="/servers" href="/servers"
class="{button} + {$page.url.pathname.startsWith('/servers') class="{button} + {!$page.url.pathname.startsWith('/servers')
? 'border-primary text-primary' || 'border-secondary text-secondary'}"
: 'text-accent'}"
> >
Servers Servers
</Button> </Button>
@ -34,9 +32,8 @@
<Button <Button
variant="ghost" variant="ghost"
href="/services" href="/services"
class="{button} + {$page.url.pathname.startsWith('/services') class="{button} + {!$page.url.pathname.startsWith('/services')
? 'border-primary text-primary' || 'border-secondary text-secondary'}"
: 'text-accent'}"
> >
Services Services
</Button> </Button>
@ -45,9 +42,8 @@
<Button <Button
variant="ghost" variant="ghost"
href="/about" href="/about"
class="{button} + {$page.url.pathname.startsWith('/about') class="{button} + {!$page.url.pathname.startsWith('/about')
? 'border-primary text-primary' || 'border-secondary text-secondary'}"
: 'text-accent'}"
> >
About About
</Button> </Button>