Spaces:
Running
Running
File size: 1,660 Bytes
31d3580 15d8696 95e3d2a 31d3580 95e3d2a 31d3580 8899818 95e3d2a 8899818 95e3d2a 31d3580 95e3d2a 31d3580 95e3d2a 31d3580 95e3d2a 31d3580 95e3d2a 31d3580 95e3d2a 31d3580 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | <script lang="ts">
import { Button } from '$lib/components/ui/button';
import * as Tooltip from '$lib/components/ui/tooltip';
import SunIcon from 'phosphor-svelte/lib/SunIcon';
import MoonIcon from 'phosphor-svelte/lib/MoonIcon';
import CaretLeftIcon from 'phosphor-svelte/lib/CaretLeftIcon';
import { mode, toggleMode } from 'mode-watcher';
import HfLogo from '$lib/components/hf-logo.svelte';
import { site } from '$lib/site';
</script>
<header class="border-b border-border/60">
<div class="mx-auto flex h-12 w-full max-w-[1600px] items-center gap-3 px-4">
<a
href="/"
class="inline-flex items-center gap-1.5 text-xs font-medium text-muted-foreground transition hover:text-foreground"
aria-label="Back to dataset home"
>
<CaretLeftIcon size={12} weight="bold" />
<span aria-hidden="true">🎯</span>
<span>{site.name}</span>
</a>
<div class="ml-auto flex items-center gap-1">
<Tooltip.Root>
<Tooltip.Trigger>
{#snippet child({ props })}
<Button
{...props}
href={site.datasetUrl}
target="_blank"
rel="noreferrer noopener"
variant="ghost"
size="icon-sm"
aria-label="Dataset on Hugging Face"
>
<HfLogo class="size-4" />
</Button>
{/snippet}
</Tooltip.Trigger>
<Tooltip.Content side="bottom">View on Hugging Face</Tooltip.Content>
</Tooltip.Root>
<Button variant="ghost" size="icon-sm" onclick={toggleMode} aria-label="Toggle theme">
{#if mode.current === 'dark'}
<SunIcon size={16} weight="duotone" />
{:else}
<MoonIcon size={16} weight="duotone" />
{/if}
</Button>
</div>
</div>
</header>
|