Small design changes

app/templates/posts/show.html.slim

@@ -41,7 +41,7 @@ article class="h-entry"
 
       - if post.location
         img class="shadow-solid shadow-pink-100 dark:shadow-pink-200 rounded mb-4" src=post.large_map
-  div class="mb-12"      
+  div class="mb-12"
     - if trip
       div class="max-w-prose mx-auto text-gray-600 dark:text-gray-200 flex gap-4"
         a href="/trips/#{trip.id}" class="block grow bg-orange-100 hover:bg-orange-200 dark:bg-orange-600 hover:dark:bg-orange-900 rounded px-4 py-2 mb-2"
@@ -99,6 +99,8 @@ article class="h-entry"
           a class="hover:underline" href="/places" places
         - if post.posted_in == :statuses
           a class="hover:underline" href="/statuses" statuses
+        - if post.posted_in == :bookshelf
+          a class="hover:underline" href="/bookshelf" bookshelf
     span class="text-right flex-1 leading-6"
       == render "shared/tags", tags: post.tags
   div class="mb-2 max-w-prose mx-auto text-gray-600 dark:text-gray-200 flex"

app/templates/shared/_status.html.slim

@@ -0,0 +1,13 @@
+div class="mb-8 h-entry border border-gray-200 m-2 p-4 bg-gray-50 hover:bg-gray-100 rounded"
+  a class="border-b-2 border-transparent hover:border-blue-600 hover:border-b-2" href="/post/#{post.slug}"
+    div class="e-content prose-p:mb-0 prose-img:my-2 prose-a:text-blue-600 prose-a:no-underline hover:prose-a:underline p-name text-base prose prose-ul:list-none prose-ul:pl-0 prose-li:pl-0 text-gray-800 dark:text-gray-200 prose-a:dark:text-gray-100 mb-4"
+      = " 💬 #{post.raw_content}"
+      div class="grid gap-4 grid-flow-row grid-cols-4 grid-rows-1"
+        -post.photos.each do |photo|
+          img class="w-32 h-32 object-cover rounded" src=photo["value"]
+    == render "shared/tags", tags: post.tags
+
+    p class="text-sm text-blue-400"
+      a class="u-url" href="#{post.permalink}"
+        time class="dt-published" datetime=post.machine_published_at
+          = post.display_published_at

app/templates/statuses/index.html.slim

@@ -3,6 +3,6 @@ div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:
 
 div class="h-feed mb-12 max-w-prose mx-auto"
   - posts.each do |post|
-    == render "shared/post", post: post
+    == render "shared/status", post: post
 
 div class="max-w-screen-md mx-auto border-t-4 border-solid border-gray-400 dark:border-gray-600"