From 327f59797558343e00abe761d92c55e4e32347bb Mon Sep 17 00:00:00 2001 From: Joris Date: Sat, 9 Sep 2023 23:07:03 +0200 Subject: Improve modal style --- src/view/components/modal.ts | 24 ++++++++++++++++-------- 1 file changed, 16 insertions(+), 8 deletions(-) (limited to 'src/view/components/modal.ts') diff --git a/src/view/components/modal.ts b/src/view/components/modal.ts index fe08272..95f907c 100644 --- a/src/view/components/modal.ts +++ b/src/view/components/modal.ts @@ -1,11 +1,12 @@ import { h, Html } from 'lib/rx' interface Params { - content: Html, + header: Html, + body: Html, onClose: () => void } -export function view({ content, onClose }: Params): Html { +export function view({ header, body, onClose }: Params): Html { return h('div', { className: 'g-Modal', onclick: () => onClose() @@ -14,13 +15,20 @@ export function view({ content, onClose }: Params): Html { { className: 'g-Modal__Content', onclick: (e: Event) => e.stopPropagation() }, - h('button', - { className: 'g-Modal__Close', - onclick: () => onClose() - }, - '✖' + h('div', + { className: 'g-Modal__Header' }, + header, + h('button', + { className: 'g-Modal__Close', + onclick: () => onClose() + }, + '✕' + ) ), - content + h('div', + { className: 'g-Modal__Body' }, + body + ) ) ) } -- cgit v1.2.3