Ilia Mashkov
45 lines
1.6 KiB
Svelte
45 lines
1.6 KiB
Svelte
<!--
|
|
Widget: Footer
|
|
Application footer with project information and portfolio link.
|
|
Visible only on desktop screens.
|
|
-->
|
|
<script lang="ts">
|
|
import { cn } from '$shared/lib';
|
|
import type { ResponsiveManager } from '$shared/lib/helpers';
|
|
import { getContext } from 'svelte';
|
|
import FooterLink from '../FooterLink/FooterLink.svelte';
|
|
|
|
const responsive = getContext<ResponsiveManager>('responsive');
|
|
const isVertical = $derived(responsive?.isDesktop || responsive?.isDesktopLarge);
|
|
const currentYear = new Date().getFullYear();
|
|
</script>
|
|
|
|
<footer
|
|
class={cn(
|
|
'fixed z-10 flex flex-row items-end gap-1 pointer-events-none',
|
|
isVertical ? 'bottom-2.5 right-2.5 [writing-mode:vertical-rl] rotate-180' : 'bottom-4 left-4',
|
|
)}
|
|
>
|
|
<!-- Project Name (Horizontal) -->
|
|
{#if isVertical}
|
|
<div class="pointer-events-auto items-center gap-2 bg-surface/80 dark:bg-dark-bg/80 backdrop-blur-sm px-3 py-1 border border-subtle">
|
|
<div class="w-1.5 h-1.5 bg-brand"></div>
|
|
<span class="text-2xs font-mono uppercase tracking-wider-mono text-neutral-500 dark:text-neutral-400">
|
|
GlyphDiff © 2025 — {currentYear}
|
|
</span>
|
|
</div>
|
|
{/if}
|
|
|
|
<!-- Portfolio Link (Vertical) -->
|
|
<div class="pointer-events-auto">
|
|
<FooterLink
|
|
text="allmy.work"
|
|
href="https://allmy.work/"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class={cn('border border-subtle', isVertical ? 'text-2xs' : 'text-4xs')}
|
|
iconClass={isVertical ? 'rotate-90' : ''}
|
|
/>
|
|
</div>
|
|
</footer>
|