Improve modal style

1 files changed, 16 insertions, 8 deletions

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
+      )
     )
   )
 }