47 lines
942 B
TypeScript
47 lines
942 B
TypeScript
import { VNode } from 'https://esm.sh/v128/preact@10.19.6/src/index.js'
|
|
import { JSX } from 'preact'
|
|
|
|
interface Budget {
|
|
name: string
|
|
target: number
|
|
buffer?: number
|
|
}
|
|
|
|
interface IconButtonProps {
|
|
text: string
|
|
icon: string
|
|
}
|
|
|
|
function IconButton(
|
|
{ icon, text, ...props }:
|
|
& IconButtonProps
|
|
& JSX.HTMLAttributes<HTMLAnchorElement>,
|
|
) {
|
|
return (
|
|
<a
|
|
href='#'
|
|
class='p-2 flex flex-col flex-1 bg-bg justify-center items-center text-center'
|
|
{...props}
|
|
>
|
|
<i>{icon}</i>
|
|
<span>{text}</span>
|
|
</a>
|
|
)
|
|
}
|
|
|
|
export default function Home() {
|
|
return (
|
|
<div class='flex flex-col sm:flex-row min-h-full'>
|
|
<main class='p-2'>
|
|
This is the main content
|
|
</main>
|
|
|
|
<nav class='w-full mt-auto sm:ml-auto flex flex-1 bg-mantle gap-1 p-1'>
|
|
<IconButton text='Some Text' icon='Some Icon' />
|
|
<IconButton text='Some Text' icon='Some Icon' />
|
|
<IconButton text='Some Text' icon='Some Icon' />
|
|
</nav>
|
|
</div>
|
|
)
|
|
}
|