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/books.ts | 29 +++++++++++++++++------------
 1 file changed, 17 insertions(+), 12 deletions(-)

(limited to 'src/view/books.ts')

diff --git a/src/view/books.ts b/src/view/books.ts
index 6ea0c12..4229774 100644
--- a/src/view/books.ts
+++ b/src/view/books.ts
@@ -42,20 +42,25 @@ interface BookDetailModalParams {
 
 function bookDetailModal({ book, onClose }: BookDetailModalParams): Html {
   return Modal.view({
-    content: h('div',
+    header: h('div',
+      h('div', { className: 'g-BookDetail__Title' }, `${book.title}, ${book.date}`),
+      book.subtitle && h('div', { className: 'g-BookDetail__Subtitle' }, book.subtitle)
+    ),
+    body: h('div',
       { className: 'g-BookDetail' },
-      h('div',
-        h('div', { className: 'g-BookDetail__Title' }, `${book.title}, ${book.date}`),
-        book.subtitle && h('div', { className: 'g-BookDetail__Subtitle' }, book.subtitle),
-        book.authors.join(', '),
-        h('div',
-          { className: 'g-BookDetail__Genres' },
-          book.genres.length > 1 ? 'Genres : ' : 'Genre : ',
-          book.genres.join(', ')
-        )
-      ),
-      h('img', { src: book.cover })
+      h('img', { src: book.cover }),
+      h('dl',
+        metadata('Auteur', book.authors),
+        metadata('Genre', book.genres)
+      )
     ),
     onClose
   })
 }
+
+function metadata(term: string, descriptions: Array<string>): Html {
+  return h('div',
+    h('dt', term, descriptions.length > 1 && 's', ' :'),
+    h('dd', ' ', descriptions.join(', '))
+  )
+}
-- 
cgit v1.2.3