Simplify css
This commit is contained in:
parent
7632941962
commit
c71684b7d9
2 changed files with 16 additions and 20 deletions
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue