Header.svelte
<script lang="ts">
import {paperTitle} from './utils';
const aClass = 'text-white visited:text-white';
</script>
<div class="bg-sky-600 p-8 flex flex-row justify-between items-center">
<div class="flex flex-col">
<h1 class="text-2xl font-bold">
<a class={aClass} href={'/#/'}> {paperTitle.split(':')[1]} </a>
</h1>
<div class="flex">
<a class="font-bold {aClass}" href={'/#/'}> Supplementary Material </a>
<span class="text-white mx-2">⋅</span>
<a class={aClass} href={'/#/browse'}>Browse</a>
<span class="text-white mx-2">⋅</span>
<a class={aClass} href={'/#/table'}>Table</a>
<span class="text-white mx-2">⋅</span>
<a class={aClass} href={'/#/search'}>Search</a>
<span class="text-white mx-2">⋅</span>
<a class={aClass} href={'/#/summaries'}> Summary Charts </a>
</div>
</div>
</div>