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.
44 lines
1.1 KiB
44 lines
1.1 KiB
<script>
|
|
export let segment;
|
|
import { goto } from '@sapper/app';
|
|
import Icon from './Icon.svelte';
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import "sass/_variables";
|
|
|
|
#logo {
|
|
font-size: 24px;
|
|
text-shadow: 2px 2px $gray-color-dark;
|
|
}
|
|
|
|
.btn {
|
|
background-color: $red !important;
|
|
margin-left: 4px;
|
|
border: 1px solid $black;
|
|
height: 40px;
|
|
}
|
|
|
|
.navbar {
|
|
background-color: $gray-color;
|
|
min-height: 50px;
|
|
}
|
|
</style>
|
|
|
|
<header class="navbar">
|
|
<section class="navbar-section">
|
|
<a class="navbar-brand mr-2" href="/">
|
|
<div id="logo">BUTTONS</div>
|
|
</a>
|
|
</section>
|
|
|
|
<section class="navbar-section">
|
|
<a data-testid='nav-home-icon' rel="prefetch" class:btn-link="{ segment != undefined }" class="btn" href="/" alt="Home" aria-label="Home">
|
|
<Icon name="home" size="32" tooltip="Home" tooltip_bottom={true} light={true}/>
|
|
</a>
|
|
<a data-testid='nav-manual-icon' class:btn-link="{ segment != 'manual' }" class="btn" href="manual" alt="Read the manual" aria-label="Read the manual">
|
|
<Icon name="book-open" size="32" tooltip="Manual" tooltip_bottom={true} light={true} />
|
|
</a>
|
|
</section>
|
|
</header>
|
|
|
|
|