From d1dfea9f97e0dc0bee84475ae8d17c189c8cd54a Mon Sep 17 00:00:00 2001
From: Eryn Wells <eryn@erynwells.me>
Date: Sat, 16 Apr 2022 16:21:35 -0700
Subject: [PATCH] Chronological nethack logfile page

---
 content/nethack/index.md              |  1 +
 content/nethack/style.css             | 71 ++++++++++++++++++++++-----
 layouts/shortcodes/nethack_table.html | 67 +++++++++----------------
 3 files changed, 85 insertions(+), 54 deletions(-)

diff --git a/content/nethack/index.md b/content/nethack/index.md
index 8957fa6..3cf7238 100644
--- a/content/nethack/index.md
+++ b/content/nethack/index.md
@@ -3,6 +3,7 @@ title: "Nethack"
 description: In which I play way too much of a silly command line Rogue-like game.
 date: 2022-04-13T08:43:46-07:00
 draft: true
+type: simple
 ---
 
 Herein is a chronological accounting of my descents into the Dungeons of Doom.
diff --git a/content/nethack/style.css b/content/nethack/style.css
index 72ad8c9..e97ded0 100644
--- a/content/nethack/style.css
+++ b/content/nethack/style.css
@@ -1,32 +1,81 @@
 /* Eryn Wells <eryn@erynwells.me> */
 
-.logfile li {
-    display: block;
-    margin-block-start: 2rem;
+:root {
+    --logentry-background-color: var(--tag-background-color);
+    --logentry-foreground-color: var(--tag-text-color);
 }
 
-.logfile dt {
-    margin-block-start: 2rem;
+ol.logfile {
+    margin-block-start: 0;
+    padding-inline-start: 0;
 }
 
-table.stats {
+.logentry {
+    background-color: var(--logentry-background-color);
+    color: var(--logentry-foreground-color);
+}
+
+.logentry {
+    align-items: first baseline;
+    border-radius: 6px;
+    display: grid;
+    grid-template-columns: 32px auto auto;
+    row-gap: 1rem;
+    margin-block-start: 2rem;
+    padding: 3rem;
+}
+
+.logentry .date {
+    grid-column-start: 2;
+    grid-row-start: 1;
+}
+
+.logentry h4.date {
+    margin: 0;
+    padding: 0;
+}
+
+.logentry .character-descriptor {
+    color: #aaa;
+    font-size: 1.5rem;
+    font-weight: 700;
+    grid-column-start: 3;
+    grid-row-start: 1;
+    text-align: right;
+    text-transform: uppercase;
+}
+
+.logentry p {
+    grid-column-start: 2;
+    grid-column-end: 4;
+    grid-row-start: 2;
+    margin: 0;
+}
+
+.logentry .stats {
+    grid-column-start: 2;
+    grid-column-end: 4;
+    grid-row-start: 3;
+}
+
+.logentry table.stats {
     border: 0;
     width: 100%;
     -webkit-border-horizontal-spacing: 0;
     -webkit-border-vertical-spacing: 0;
 }
 
-table.stats td {
+.logentry table.stats td {
     color: #aaa;
-    font-size: 1.75rem;
+    font-size: 1.5rem;
     font-weight: 700;
     padding: 0;
     text-transform: uppercase;
 }
 
-table.stats td.score,
-table.stats td.hp,
-table.stats td.level {
+.logentry table.stats td.score,
+.logentry table.stats td.hp,
+.logentry table.stats td.level {
     width: 16rem;
     text-align: right;
 }
\ No newline at end of file
diff --git a/layouts/shortcodes/nethack_table.html b/layouts/shortcodes/nethack_table.html
index 5378559..87fb2c6 100644
--- a/layouts/shortcodes/nethack_table.html
+++ b/layouts/shortcodes/nethack_table.html
@@ -1,43 +1,24 @@
-{{ $nethack_logfile := $.Site.Data.nethack }}
-
-<dl class="logfile">
-{{ range sort $nethack_logfile.nutmeg.records "end_date" "desc" }}
-{{ if ne .reason_for_death "quit" }}
-<!-- <table class="logfile logentry">
-  <tr>
-    <td colspan=5>{{ time.Format "January 2, 2006" .end_date }}</td>
-  </tr>
-  <tr>
-    <td></td>
-    <td class="name" colspan=4>{{ .name }}, a {{ .alignment | lower }} {{ .race | lower }} {{ .gender | lower }} {{ .role }},
-        died {{ if gt .number_of_deaths 1 }}for the last time{{ end }} in <span class="nobreak">{{ .dungeon_name }}</span>
-        on <span class="nobreak">{{ if gt .level 0 }}{{ .level_descriptive | lower }}{{ else }}{{ .level_descriptive }}{{ end }}</span>.
-        {{ if eq .reason_for_death "quit" }}She quit.{{ else }}She was {{ .reason_for_death }}.{{ end }}</td>
-  </tr>
-  <tr>
-    <td></td>
-    <td class="began">Began {{ time.Format "January 2, 2006" .start_date }}</td>
-    <td class="score">{{ .score }} points</td>
-    <td class="level">Level {{ .max_level }}</td>
-    <td class="hp">{{ if gt .hit_points 0 }}{{ .hit_points }} / {{ end }}{{ .max_hit_points }} hp</td>
-  </tr>
-</table> -->
-<dt class="start-date">{{ time.Format "January 2, 2006" .end_date }}</dt>
-<dd class="logentry">
-  {{ .name }}, a {{ .alignment | lower }} {{ .race | lower }} {{ .gender | lower }} {{ .role }},
-  died {{ if gt .number_of_deaths 1 }}for the last time{{ end }} in <span class="nobreak">{{ .dungeon_name }}</span>
-  on <span class="nobreak">{{ cond (gt .level 0) (.level_descriptive | lower) .level_descriptive }}</span>.
-  {{ cond (eq .reason_for_death "quit") "She quit." (printf "She was %s" .reason_for_death) }}.
-  <table class="stats">
-    <tr>
-      <td class="began">Began {{ time.Format "January 2, 2006" .start_date }}</td>
-      <td class="score">{{ .score }} points</td>
-      <td class="level">Level {{ .max_level }}</td>
-      <td class="hp">{{ cond (gt .hit_points 0) (printf "%s / %s" .hit_points .max_hit_points) .max_hit_points }} hp</td>
-    </tr>
-  </table>
-</dd>
-
-{{ end }}
-{{ end }}
-</dl>
\ No newline at end of file
+{{ $nethack_logfile := $.Site.Data.nethack.logfile.nutmeg }}
+<ol class="logfile">
+  {{ range sort $nethack_logfile "end_date" "desc" }}
+  {{ if ne .death.cause "quit" }}
+  <li class="logentry">
+    <div>{{ if .death.cause }}🪦{{ end }}</div>
+    <h4 class="date">{{ time.Format "January 2, 2006" .end_date }}</h4>
+    <div class="character-descriptor">{{ .character.abbreviated }}</div>
+    <p>{{ .character.name }}, a {{ .character.alignment.descriptive | lower }} {{ .character.race.descriptive | lower }} {{ .character.gender.descriptive | lower }} {{ .character.role.descriptive }},
+    died {{ if gt .death.count 1 }}for the last time{{ end }} in <span class="nobreak">{{ .dungeon.name }}</span>
+    on <span class="nobreak">{{ cond (gt .dungeon.level.n 0) (.dungeon.level.descriptive | lower) .dungeon.level.descriptive }}</span>.
+    She was {{ .death.cause }}.</p>
+    <table class="stats">
+      <tr>
+        <td class="began">Began {{ time.Format "January 2, 2006" .start_date }}</td>
+        <td class="score">{{ .score }} points</td>
+        <td class="level">Level {{ .character.max_level }}</td>
+        <td class="hp">{{ cond (gt .character.hp.n 0) (printf "%s / %s" .character.hp.n .character.hp.max) .character.hp.max }} hp</td>
+      </tr>
+    </table>
+  </li>
+  {{ end }}
+  {{ end }}
+</ol>
\ No newline at end of file