qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2025-12-29 08:01:36 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

⚡️ Add new icons + update sidebar.

Browse Source
This commit is contained in:
pheralb
2023-12-12 00:59:12 +00:00
parent 81dc918ab7
commit b7b1a6de58
5 changed files with 106 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/+layout.svelte
+13 -56
View File
@@ -13,11 +13,8 @@
// Icons:
import Heart from 'phosphor-svelte/lib/Heart';
import ArrowUpRight from 'phosphor-svelte/lib/ArrowUpRight';
import ArrowLeft from 'phosphor-svelte/lib/ArrowLeft';
import Star from 'phosphor-svelte/lib/Star';
import GithubLogo from 'phosphor-svelte/lib/GithubLogo';
import Box from 'phosphor-svelte/lib/Cube';
import { ArrowUpRight } from 'lucide-svelte';
// Toaster:
import { Toaster } from 'svelte-sonner';
@@ -25,32 +22,24 @@
// Components for all pages:
import Transition from '@/components/transition.svelte';
import Container from '@/components/container.svelte';
import Theme from '@/components/theme.svelte';
// Layout:
import Navbar from '@/components/navbar.svelte';
import { cn } from '@/utils/cn';
</script>
<Navbar />
<main>
<aside
class="z-50 w-full overflow-y-auto overflow-x-hidden border-b border-neutral-300 dark:border-neutral-800 md:fixed md:left-0 md:h-full md:w-60 md:border-none md:pb-10"
class={cn(
'z-50 w-full overflow-y-auto overflow-x-hidden',
'dark:border-neutral-800 md:fixed md:left-0 md:h-full md:w-56 md:pb-10',
'bg-neutral-100 dark:bg-neutral-900',
'backdrop-blur-md opacity-95',
'border-r border-neutral-200 dark:border-neutral-800'
)}
>
<div class="px-6 py-6">
<div class="mb-3 border-b border-neutral-300 pb-3 dark:border-neutral-700/40">
<div class="flex items-center justify-between">
<a href="/">
<div
class="flex items-center space-x-2 duration-150 hover:text-neutral-500 dark:hover:text-neutral-300"
>
<h3 class="text-xl font-medium">svgl</h3>
<p class="text-neutral-500">v3.2.2</p>
</div>
</a>
<Theme />
</div>
<p class="mt-2 font-medium text-neutral-400">✨ Optimized SVGs for web</p>
</div>
<div
class="flex items-center space-x-1 overflow-y-auto border-b border-neutral-300 pb-3 dark:border-neutral-700/40 md:mb-3 md:flex-col md:space-x-0 md:space-y-1 md:overflow-y-visible"
>
@@ -77,53 +66,21 @@
>
{/each}
</div>
<div
class="mt-3 flex flex-row items-center space-x-2 border-b border-neutral-300 pb-3 dark:border-neutral-700/40 md:mt-0 md:flex-col md:space-x-0 md:space-y-1"
>
<a
href="https://github.com/pheralb/svgl#-getting-started"
target="_blank"
class="flex w-full items-center space-x-2 rounded-md p-2 duration-100 hover:bg-neutral-200 dark:hover:bg-neutral-700/40"
>
<div><Box size={18} /></div>
<span>Submit logo</span>
<div><ArrowUpRight size={12} /></div>
</a>
<a
href="https://github.com/pheralb/svgl"
target="_blank"
class="flex w-full items-center space-x-2 rounded-md p-2 duration-100 hover:bg-neutral-200 dark:hover:bg-neutral-700/40"
>
<div class="flex items-center space-x-2">
<div><GithubLogo size={18} /></div>
<span class="flex items-center justify-center">Repository</span>
{#if data.stars}
<div class="flex items-center space-x-1 text-neutral-600 dark:text-neutral-400">
<div>
<Star size={14} weight="duotone" class="text-yellow-700 dark:text-yellow-500" />
</div>
<span>{data.stars}</span>
</div>
{/if}
<div><ArrowUpRight size={12} /></div>
</div>
</a>
</div>
<a
href="https://twitter.com/pheralb_"
target="_blank"
class="mt-5 flex items-center space-x-2 duration-100 hover:text-dark dark:text-neutral-400 dark:hover:text-white"
class="mt-5 md:flex hidden items-center space-x-2 duration-100 hover:text-dark dark:text-neutral-400 dark:hover:text-white"
>
<Heart color="#991b1b" size={18} weight={'duotone'} />
<div class="flex items-center space-x-1">
<p class="text-muted text-sm">Created by pheralb</p>
<ArrowUpRight size={12} />
<ArrowUpRight size={14} />
</div>
</a>
</div>
</aside>
<div class="py-2 md:ml-60 md:py-6">
{#if data.pathname !== '/'}
<div class="py-2 md:ml-56 md:py-2">
{#if data.pathname !== '/' && data.pathname !== 'directory'}
<Container>
<a href="/">
<div