Bookshelf

app/templates/books/index.html.slim

@@ -1,23 +1,41 @@
 - context.content_for(:title, "Books | ")
 
 div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
-  h1 Books
+  h1 📚 Bookshelf
 
   div class="mb-12 max-w-prose mx-auto"
     table class="prose dark:prose-invert table-auto"
       thead
         tr
-          td Title
-          td Author
-          td Status
-      - books.each do |book|
+          td
+          td class="p-2" Title
+          td class="p-2" Author(s)
+      - reading.each do |book|
         tr
           td
-            / a href="/books/#{book.slug}"
+            span class="rounded-md text-xs #{book.status_colour} p-1"
+              = book.book_status
+          td
             = book.name
           td
-            = book.book_author
+            = book.authors
+      - to_read.each do |book|
+        tr
           td
-            = book.book_status
+            span class="rounded-md text-xs #{book.status_colour} p-1"
+              = book.book_status
+          td
+            = book.name
+          td
+            = book.authors
+      - read.each do |book|
+        tr
+          td
+            span class="rounded-md text-xs #{book.status_colour} p-1"
+              = book.book_status
+          td
+            = book.name
+          td
+            = book.authors
 
 div class="max-w-screen-md mx-auto border-t-4 border-solid border-gray-400 dark:border-gray-600"

app/templates/more/index.html.slim

@@ -17,5 +17,6 @@ div class="mb-12 max-w-prose mx-auto text-gray-800 dark:text-gray-200"
     a class="block p-1 border border-blue-200 bg-blue-200 text-blue-900 hover:bg-blue-300 text-center rounded-lg" href="/movies" 🍿 Movies
     a class="block p-1 border border-blue-200 bg-blue-200 text-blue-900 hover:bg-blue-300 text-center rounded-lg" href="/trips" 🛫 Trips
     a class="block p-1 border border-blue-200 bg-blue-200 text-blue-900 hover:bg-blue-300 text-center rounded-lg" href="/podcasts" 🎙️ Podcasts
+    a class="block p-1 border border-blue-200 bg-blue-200 text-blue-900 hover:bg-blue-300 text-center rounded-lg" href="/bookshelf" 📚️ Bookshelf
     / a class="block p-1 border border-blue-200 bg-blue-300 text-blue-900 hover:bg-blue-200 text-center rounded-lg" href="/art" 🎨 Art things
 

app/templates/movies/index.html.slim

@@ -1,7 +1,7 @@
 - context.content_for(:title, "Movies | ")
 
 div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
-  h1 Movies
+  h1 🍿 Movies
 
   div class="mb-12 max-w-prose mx-auto"
     table class="prose dark:prose-invert table-auto"

app/templates/podcasts/index.html.slim

@@ -1,7 +1,7 @@
 - context.content_for(:title, "Podcasts | ")
 
 div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
-  h1 Podcasts
+  h1 🎙️ Podcasts
 
   div class="mb-12 max-w-prose mx-auto"
     table class="prose dark:prose-invert table-auto"

app/templates/trips/index.html.slim

@@ -1,7 +1,7 @@
 - context.content_for(:title, "Trips | ")
 
 div class="mb-4 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
-  h1 Trips
+  h1 🛫 Trips
 
   div class="mb-12 max-w-prose mx-auto"
     table class="prose dark:prose-invert table-auto"

app/templates/workouts/index.html.slim

@@ -1,7 +1,7 @@
 - context.content_for(:title, "Hikes | ")
 
 div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
-  h1 Hikes
+  h1 🥾 Hikes
 
 div class="prose dark:prose-invert max-w-prose mx-auto"
   - workouts_by_year.each do |year, workouts|