This is a parody of leetcode.com for designers. It's being developed live on Twitch.tv/zedashaw to demonstrate how to make a parody of a website.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
pixelperfectionist/rendered/Header.svelte

40 lines
1.3 KiB

<script>
import Icon from '$/client/components/Icon.svelte';
import Darkmode from '$/client/components/Darkmode.svelte';
import { Hydrate } from '@jamcart/7ty/components';
import { register_enabled } from "$/client/config.js";
export let fixed = false;
</script>
<style>
img.logo {
width: 120px;
}
</style>
<header class:fixed>
<nav>
<a href="/"><img class="logo" src="/logo.svg" alt="LJSTHW" aria-label="LJSTHW" ></a>
<ul>
{#if register_enabled}
<li>
<a id="register-button" href="/client/#/register/">
<span class="mobile">
<Icon name="dollar-sign" tooltip="Register." />
</span>
<span class="mobile-hide">
<button type="button">Register</button>
</span>
</a>
</li>
{/if}
<li><a href="/client/#/login/"><Icon name="log-in" tooltip="Log in."/></a></li>
<li><a href="/blog/"><Icon name="book" tooltip="Blog posts." /></a></li>
<li><a href="/client/#/live/"><Icon name="video" tooltip="Livestreams." tip_position="bottom-left" /></a></li>
<li><a href="/feed.rss"><Icon name="rss" tooltip="RSS Feed." tip_position="bottom-left" /></a></li>
<li><Hydrate component={ Darkmode } /></li>
</ul>
</nav>
</header>