Switch data representation to definition list

Thank the author of the blog post [1] that helped me writing the CSS

[1]: https://www.the-art-of-web.com/css/format-dl/

7 files changed, 103 insertions, 56 deletions

diff --git a/content/book-reviews/relevant-search.md b/content/book-reviews/relevant-search.md
index e5be78f..23b7374 100644
--- a/content/book-reviews/relevant-search.md
+++ b/content/book-reviews/relevant-search.md
@@ -3,28 +3,16 @@ categories: ["book review"]
 title: "[Book review] Relevant Search"
 date: 2021-05-06T16:35:08+07:00
 tags: [book, review, search, programming, algorithm]
+book: "Relevant Search: With applications for Solr and Elasticsearch"
+authors:
+  - Doug Turnbull
+  - John Berryman
+isbn: 9781617292774
+genres: [programming]
+lang: en
+layout: books
 ---
 
-So I decided to review books as I write. As people say, you would understand
-things better when you share it with each other.
-
-Each review will contain:
-
-- metadata: book name, author(s), ISBN, genres, language (please tell if there
-    are some more helpful information)
-- summary: wrap up the content of the book; it should not no more than 5
-    subsections of 150 words each
-- comments: my thoughts on the book -- what I like and don't like about it
-
-# Metadata
-
-| Book | Relevant Search: With applications for Solr and Elasticsearch |
-|---------|------------------------------|
-| Authors | Doug Turnbull, John Berryman |
-| ISBN    | 9781617292774                |
-| Genres  | Programming                  |
-| Language| English                      |
-
 # Summary
 ## The search relevance problem
 
diff --git a/content/book-reviews/xkcd-what-if.md b/content/book-reviews/xkcd-what-if.md
index f656f3e..40f4f9b 100644
--- a/content/book-reviews/xkcd-what-if.md
+++ b/content/book-reviews/xkcd-what-if.md
@@ -4,17 +4,16 @@ title: "[Book review] XKCD: What If?"
 date: 2021-05-07T16:35:08+07:00
 tags: [book, review, science, hypothetical, xkcd, whatif]
 draft: true
+book: "XKCD: What If?"
+authors: ["Randall Munroe"]
+isbn: 9780544456860
+genres:
+  - science
+  - humor
+lang: en
+layout: books
 ---
 
-# Metadata
-
-| Book | XKCD: What If? |
-|---------|------------------------------|
-| Author  | Randall Munroe               |
-| ISBN    |                              |
-| Genres  |                              |
-| Language| English                      |
-
 # Summary
 # Comments
 
diff --git a/content/works.md b/content/works.md
index fc16d24..84fdeaf 100644
--- a/content/works.md
+++ b/content/works.md
@@ -91,6 +91,7 @@ unfortunately not done yet.
 
 ## Super short PR
 
+- [Nine-line PR][alt-client] for a software listing
 - [Three-line PR][site-envs] for envs.net website
 - [One-character PR][publiccode] for Public Code standard
 
@@ -122,5 +123,6 @@ Works:
 [ipa]: https://github.com/florisboard/florisboard/pull/560
 [publiccode]: https://github.com/publiccodenet/standard/pull/439#issuecomment-774983961
 [site-envs]: https://git.envs.net/envs/site/pulls/3
+[alt-client]: https://github.com/mendel5/alternative-front-ends/pull/18
 
 [palace-demo]: https://video.ploud.fr/videos/embed/e68c43ca-f4bd-4af6-840f-1405e6163735
diff --git a/layouts/_default/books.html b/layouts/_default/books.html
new file mode 100644
index 0000000..c4b7589
--- /dev/null
+++ b/layouts/_default/books.html
@@ -0,0 +1,46 @@
+{{ define "main" }}
+{{ if .Menus }}
+<nav class="post-navigation">
+  {{ range .Menus }}
+  <a href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
+  {{ end }}
+</nav>
+{{ end }}
+
+<article class="post h-entry">
+  <header class="post-header">
+    <h1 class="p-name post-title{{ if .Params.favorite }} favorite{{end}}{{ if .Params.draft }} draft{{end}}">{{ trim .Title  " " }}</h1>
+  </header>
+  <div class="content e-content">
+    <h1>Book info</h1>
+    <dl class="book-data">
+      <dt>Book</dt>
+      <dd>{{ .Params.book }}</dd>
+      <dt>Authors</dt>
+      {{ range $author := .Params.authors }}
+        <dd>{{ $author }}</dd>
+      {{ end }}
+      <dt>ISBN</dt>
+      <dd>{{ .Params.isbn }}</dd>
+      <dt>Genres</dt>
+      {{ range $genre := .Params.genres }}
+        <dd>{{ $genre }}</dd>
+      {{ end }}
+      <dt>Language</dt>
+      <dd>{{ .Language.LanguageName }}</dd>
+    </dl>
+    {{ .Content }}
+    <hr>
+    {{ i18n "BookShare" }}
+  </div>
+  {{ partial "postInfo.html" . }}
+</article>
+
+{{ if and (.Site.Params.paginationSinglePost) (ne .Type "page") }}
+  {{ partial "paginationPost.html" . }}
+{{ end }}
+
+
+{{ partial "custom-webring.html" }}
+
+{{ end }}
diff --git a/layouts/_default/comic.html b/layouts/_default/comic.html
index 1b3e33e..2758deb 100644
--- a/layouts/_default/comic.html
+++ b/layouts/_default/comic.html
@@ -1,34 +1,34 @@
 {{ define "main" }}
 {{ if .Menus }}
 <nav class="post-navigation">
-	{{ range .Menus }}
-	<a href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
-	{{ end }}
+  {{ range .Menus }}
+  <a href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
+  {{ end }}
 </nav>
 {{ end }}
 
 <article class="post h-entry">
-	<header class="post-header">
-		<center>
-			<h1 class="p-name post-title{{ if .Params.draft }} draft{{end}}">{{ trim .Title  " " }}</h1>
-		{{ if in .Params.categories "comics" }}
-		</center>
-		{{ end}}
-	</header>
-	<div class="content e-content">
-		<center>
-		{{ partial "comicNav.html" . }}
-		<img title="{{ .Params.TitleText }}" alt="{{ .Params.Alt}}"
-			src={{ .Params.ComicLink}}>
-		{{ partial "comicNav.html" . }}
-		{{ .Content }}
-		<center>
-	</div>
-	{{ partial "postInfo.html" . }}
+  <header class="post-header">
+    <center>
+      <h1 class="p-name post-title{{ if .Params.draft }} draft{{end}}">{{ trim .Title  " " }}</h1>
+    {{ if in .Params.categories "comics" }}
+    </center>
+    {{ end}}
+  </header>
+  <div class="content e-content">
+    <center>
+    {{ partial "comicNav.html" . }}
+    <img title="{{ .Params.TitleText }}" alt="{{ .Params.Alt}}"
+      src={{ .Params.ComicLink}}>
+    {{ partial "comicNav.html" . }}
+    {{ .Content }}
+    <center>
+  </div>
+  {{ partial "postInfo.html" . }}
 </article>
 
 {{ if and (.Site.Params.paginationSinglePost) (ne .Type "page") }}
-	{{ partial "paginationPost.html" . }}
+  {{ partial "paginationPost.html" . }}
 {{ end }}
 
 
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index c2ef2cf..7ba428d 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -12,13 +12,7 @@
 		<h1 class="p-name post-title{{ if .Params.favorite }} favorite{{end}}{{ if .Params.draft }} draft{{end}}">{{ trim .Title  " " }}</h1>
 	</header>
 	<div class="content e-content">
-		<!-- normal content -->
 		{{ .Content }}
-		<!-- book reviews -->
-		{{ if in .Params.categories "book review" }}
-		<hr>
-		{{ i18n "BookShare" }}
-		{{ end }}
 	</div>
 	{{ partial "postInfo.html" . }}
 </article>
diff --git a/static/css/custom.css b/static/css/custom.css
index 4dcae15..8c00949 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -78,3 +78,21 @@ div.content h3::before {
   content: '### ';
   color: gray;
 }
+
+/* Book data format */
+
+dl.book-data {
+  border: 3px double #ccc;
+  padding: 0.5em;
+}
+dl.book-data dt {
+  float: left;
+  clear: left;
+  width: 100px;
+  text-align: right;
+  font-weight: bold;
+}
+dl.book-data dd {
+  margin: 0 0 0 110px;
+  padding: 0 0 0.5em 0;
+}