qyg2297248353/svgl
qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2024-11-10 14:46:54 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ Design improvements.

Browse Source
This commit is contained in:
pheralb 2023-12-17 00:20:11 +00:00
parent 85ddb3fdb8
commit faeb193531
4 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/navbar.svelte
View File

@ -1,4 +1,6 @@
<script>
<script lang="ts">
export let currentPath: string;
import { cn } from '@/utils/cn';
import Logo from './logo.svelte';
import { ArrowUpRight, CloudyIcon, GithubIcon, TwitterIcon } from 'lucide-svelte';
@ -37,6 +39,8 @@
external: true
}
];
console.log(currentPath);
</script>
<nav
@ -53,7 +57,7 @@
<div class="flex items-center space-x-2 hover:opacity-80 transition-opacity">
<svelte:component this={Logo} />
<span class="text-[19px] font-medium tracking-wide hidden md:block">svgl</span>
<p class="text-neutral-500 hidden md:block">v4.0.0</p>
<p class="text-neutral-500 hidden md:block font-mono">v4</p>
</div>
</a>
</div>
@ -63,7 +67,11 @@
<a
href={link.url}
target={link.external ? '_blank' : ''}
class="flex items-center hover:opacity-80 transition-opacity text-[15px] pl-3 group"
class={cn(
'flex items-center hover:opacity-80 transition-opacity text-[15px] pl-3 group',
currentPath === link.url &&
'underline underline-offset-8 decoration-dotted decoration-neutral-500'
)}
>
{#if !link.external}
<svelte:component this={link.icon} size={16} strokeWidth={1.5} class="mr-2" />

2
src/routes/+layout.svelte
View File

@ -26,7 +26,7 @@
import { cn } from '@/utils/cn';
</script>
<Navbar />
<Navbar currentPath={data.pathname} />
<main>
<aside
class={cn(

2
src/routes/+page.svelte
View File

@ -84,7 +84,7 @@
<div class="flex items-center justify-end mb-4">
<button
class={cn(
'flex items-center justify-center space-x-1 rounded-md px-3 py-1.5 text-sm font-medium',
'flex items-center justify-center space-x-1 rounded-md px-3 py-1.5 text-sm font-medium hover:opacity-80 transition-opacity',
filteredSvgs.length === 0 && 'hidden'
)}
on:click={() => sort()}

2
src/routes/api/+page.svelte
View File

@ -25,7 +25,7 @@
class="absolute inset-[-1000%] animate-[spin_4s_linear_infinite] bg-[conic-gradient(from_90deg_at_50%_50%,#f4f4f5_0%,#f4f4f5_50%,#737373_100%)] dark:bg-[conic-gradient(from_90deg_at_50%_50%,#121212_0%,#121212_50%,#737373_100%)]"
/>
<div
class="inline-flex h-full w-full cursor-pointer items-center justify-center rounded-full bg-neutral-100 dark:bg-neutral-900 px-3 py-1 text-sm font-medium dark:text-white backdrop-blur-3xl border border-neutral-100 dark:border-neutral-800"
class="inline-flex h-full w-full cursor-pointer items-center justify-center rounded-full bg-neutral-100 dark:bg-neutral-900 px-3 py-1 text-xs font-medium dark:text-white backdrop-blur-3xl border border-neutral-100 dark:border-neutral-800 font-mono"
>
beta
</div>