Simplify css

This commit is contained in:
Neshura 2024-01-04 00:51:27 +01:00
parent 7632941962
commit c71684b7d9
Signed by: Neshura
GPG key ID: B6983AAA6B9A7A6C
2 changed files with 16 additions and 20 deletions

View file

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

View file

@ -2,7 +2,7 @@
import { page } from '$app/stores';
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>
<ul
@ -12,9 +12,8 @@
<Button
variant="ghost"
href="/"
class="{button} + {$page.url.pathname === '/'
? 'border-primary text-primary'
: 'text-accent'}"
class="{button} + {!($page.url.pathname === '/')
|| 'border-secondary text-secondary'}"
>
Home
</Button>
@ -23,9 +22,8 @@
<Button
variant="ghost"
href="/servers"
class="{button} + {$page.url.pathname.startsWith('/servers')
? 'border-primary text-primary'
: 'text-accent'}"
class="{button} + {!$page.url.pathname.startsWith('/servers')
|| 'border-secondary text-secondary'}"
>
Servers
</Button>
@ -34,9 +32,8 @@
<Button
variant="ghost"
href="/services"
class="{button} + {$page.url.pathname.startsWith('/services')
? 'border-primary text-primary'
: 'text-accent'}"
class="{button} + {!$page.url.pathname.startsWith('/services')
|| 'border-secondary text-secondary'}"
>
Services
</Button>
@ -45,9 +42,8 @@
<Button
variant="ghost"
href="/about"
class="{button} + {$page.url.pathname.startsWith('/about')
? 'border-primary text-primary'
: 'text-accent'}"
class="{button} + {!$page.url.pathname.startsWith('/about')
|| 'border-secondary text-secondary'}"
>
About
</Button>