55 lines
1.5 KiB
TypeScript
55 lines
1.5 KiB
TypeScript
// import { JSX } from 'preact'
|
|
// import { IS_BROWSER } from '$fresh/runtime.ts'
|
|
|
|
import { Bars3Outline } from 'preact-heroicons'
|
|
import { Clock } from '@homeman/islands/Clock.tsx'
|
|
import { Dialog } from '@homeman/components/Dialog.tsx'
|
|
import { useSignal } from '@preact/signals'
|
|
import { IS_BROWSER } from '$fresh/runtime.ts'
|
|
|
|
let fireworks: HTMLAudioElement | undefined
|
|
if (IS_BROWSER) fireworks = new Audio('/fireworks.mp3')
|
|
|
|
export function Nav(/* props: {} */) {
|
|
const showMenu = useSignal(false)
|
|
return (
|
|
<>
|
|
<Dialog
|
|
headerTitle='Main Menu'
|
|
show={showMenu.value}
|
|
onClose={() => {
|
|
showMenu.value = false
|
|
}}
|
|
>
|
|
<section class='flex flex-col text-center p-2 gap-2'>
|
|
<a class='p-4 rounded bg-gray-500/20' href='/'>Dashboard</a>
|
|
<a class='p-4 rounded bg-gray-500/20' href='/routine'>
|
|
Daily Routine
|
|
</a>
|
|
<a class='p-4 rounded bg-gray-500/20' href='/admin'>Edit Users</a>
|
|
<button
|
|
class='p-4 bg-gray-500/20 hover:bg-stone-500/20'
|
|
onClick={() => IS_BROWSER && fireworks?.play()}
|
|
>
|
|
Play Sound
|
|
</button>
|
|
</section>
|
|
</Dialog>
|
|
<nav class='bg-stone-200 dark:bg-stone-800 flex justify-items-start items-center'>
|
|
<button
|
|
class='p-4 hover:bg-stone-500/20'
|
|
onClick={() => {
|
|
showMenu.value = true
|
|
}}
|
|
>
|
|
<Bars3Outline class='h-6 w-6' />
|
|
</button>
|
|
<a class='p-4 hover:bg-stone-500/20' href='/'>
|
|
Flanagan Family
|
|
</a>
|
|
<Clock class='ml-auto pr-4 text-2xl' />
|
|
</nav>
|
|
</>
|
|
)
|
|
}
|