blob: bbe2e05e135974cb3d5604148a58a45741235e8f (
plain) (
blame)
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
|
<script>
// we will want to dynamically use the users avatar on this screen if they have uploaded one
import { goto } from '$app/navigation';
import { Icon } from '$comp';
</script>
<header class="bg-gradient-to-r from-primary to-gradient h-[20vh] w-full relative">
<nav class="flex justify-end items-center space-x-4 p-5">
<button class="bg-white p-2 rounded-full w-12 h-12" on:click={() => goto('/receive')}
><Icon icon="numpad" style="mx-auto" /></button
>
<button class="bg-white p-2 rounded-full w-12 h-12"
><Icon icon="clock" style="mx-auto" /></button
>
<button class="bg-white p-2 rounded-full w-12 h-12"
><Icon icon="profile" style="mx-auto" /></button
>
<button class="bg-white p-2 rounded-full w-12 h-12"
><Icon icon="menu" style="mx-auto" /></button
>
</nav>
<div
class="absolute top-[calc(20vh-48px)] left-[calc(50vw-48px)] rounded-full border-4 border-white p-4 bg-gradient-to-r from-primary to-gradient w-24 h-24"
>
<Icon icon="logo-symbol-white" style="mx-auto" />
</div>
</header>
|