Refactor app in to its own slice

slices/main/templates/shared/_blue_sky.html.slim

@@ -0,0 +1,2 @@
+- w_class = defined?(width) ? width : "w-6"
+<svg class="fill-blue-100 hover:fill-blue-400 #{w_class}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M433 179.11c0-97.2-63.71-125.7-63.71-125.7-62.52-28.7-228.56-28.4-290.48 0 0 0-63.72 28.5-63.72 125.7 0 115.7-6.6 259.4 105.63 289.1 40.51 10.7 75.32 13 103.33 11.4 50.81-2.8 79.32-18.1 79.32-18.1l-1.7-36.9s-36.31 11.4-77.12 10.1c-40.41-1.4-83-4.4-89.63-54a102.54 102.54 0 0 1-.9-13.9c85.63 20.9 158.65 9.1 178.75 6.7 56.12-6.7 105-41.3 111.23-72.9 9.8-49.8 9-121.5 9-121.5zm-75.12 125.2h-46.63v-114.2c0-49.7-64-51.6-64 6.9v62.5h-46.33V197c0-58.5-64-56.6-64-6.9v114.2H90.19c0-122.1-5.2-147.9 18.41-175 25.9-28.9 79.82-30.8 103.83 6.1l11.6 19.5 11.6-19.5c24.11-37.1 78.12-34.8 103.83-6.1 23.71 27.3 18.4 53 18.4 175z"/></svg>

slices/main/templates/shared/_bookmark.html.slim

@@ -0,0 +1,20 @@
+div class="mb-4"
+  div class="mb-4"
+    h3 class="text-xl text-blue-600 dark:text-slate-200 mb-2"
+      a class="u-url hover:text-blue-900 hover:dark:text-slate-600" href="/bookmark/#{bookmark.slug}"
+        = "#{bookmark.name} "
+
+    small class="text-gray-400 hover:text-gray-600"
+      a href=bookmark.url
+        = bookmark.url
+        == render("link_arrow")
+  p class="e-content leading-relaxed md:text-lg text-gray-800 dark:text-gray-200"
+    = bookmark.content
+
+  == bookmark.youtube_embed
+
+  p class="text-sm text-blue-400 mb-4"
+    a href="/bookmark/#{bookmark.slug}"
+      time class="dt-published" datetime=bookmark.machine_published_at
+        = bookmark.display_published_at
+  hr

slices/main/templates/shared/_compact_post.html.slim

@@ -0,0 +1,28 @@
+div class="mb-5 h-entry relative"
+  - if !first
+    div class="-top-4 -left-1 absolute rounded-full border-2 bg-orange-100 border-orange-200 p-1 w-1 h-2 inline-block dark:border-amber-400 dark:bg-amber-400"
+  - if first
+    div class="inline-block mb-2 dark:text-indigo-400"
+      span class="mr-2"
+        = "🛬"
+      = trip.start_date
+
+  div class="ml-[5] #{ last ? '' : 'mb-[20]'} pl-6 border-solid border-l-2 border-orange-200 dark:border-amber-400"
+    h3 class="text-xl font-semibold text-blue-600 dark:text-indigo-300"
+      a class="border-b-2 border-transparent hover:border-blue-600 hover:border-b-2" href="/post/#{post.slug}"
+        = post.name
+    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"
+      == post.excerpt
+      div class="grid gap-4 grid-flow-row grid-cols-4 grid-rows-1"
+        -post.photos.each do |photo|
+          img class="w-44 h-44 object-cover rounded" src=photo["value"]
+
+    p class="text-sm text-blue-400 dark:text-indigo-50"
+      a class="u-url" href="#{post.permalink}"
+        time class="dt-published" datetime=post.machine_published_at
+          = post.display_published_at
+  - if last
+    div class="inline-block mb-6 dark:text-indigo-400"
+      span class="mr-2"
+        = "🛫"
+      = trip.end_date

slices/main/templates/shared/_instagram.html.slim

@@ -0,0 +1 @@
+<svg class="fill-purple-100 hover:fill-purple-400 w-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/></svg>

slices/main/templates/shared/_link_arrow.html.slim

@@ -0,0 +1,4 @@
+svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="inline w-2 h2 md:w-3 md:h-3 mt-0.5 ml-1.5"
+  g
+    rect height="12.4434" opacity="0" width="12.4238" x="0" y="0"
+    path d="M14.4238 10.8008L14.4141 0.976562C14.4141 0.419922 14.0527 0.0292969 13.4668 0.0292969L3.64258 0.0292969C3.0957 0.0292969 2.72461 0.449219 2.72461 0.917969C2.72461 1.38672 3.14453 1.78711 3.60352 1.78711L7.00195 1.78711L11.7676 1.63086L9.95117 3.22266L0.273438 12.9199C0.0976562 13.0957 0 13.3203 0 13.5352C0 14.0039 0.419922 14.4434 0.908203 14.4434C1.13281 14.4434 1.34766 14.3652 1.52344 14.1797L11.2207 4.49219L12.832 2.66602L12.6562 7.22656L12.6562 10.8398C12.6562 11.2988 13.0566 11.7285 13.5352 11.7285C14.0039 11.7285 14.4238 11.3281 14.4238 10.8008Z"

slices/main/templates/shared/_mastodon.html.slim

@@ -0,0 +1,2 @@
+- w_class = defined?(width) ? width : "w-6"
+<svg class="fill-blue-100 hover:fill-blue-400 #{w_class}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M433 179.11c0-97.2-63.71-125.7-63.71-125.7-62.52-28.7-228.56-28.4-290.48 0 0 0-63.72 28.5-63.72 125.7 0 115.7-6.6 259.4 105.63 289.1 40.51 10.7 75.32 13 103.33 11.4 50.81-2.8 79.32-18.1 79.32-18.1l-1.7-36.9s-36.31 11.4-77.12 10.1c-40.41-1.4-83-4.4-89.63-54a102.54 102.54 0 0 1-.9-13.9c85.63 20.9 158.65 9.1 178.75 6.7 56.12-6.7 105-41.3 111.23-72.9 9.8-49.8 9-121.5 9-121.5zm-75.12 125.2h-46.63v-114.2c0-49.7-64-51.6-64 6.9v62.5h-46.33V197c0-58.5-64-56.6-64-6.9v114.2H90.19c0-122.1-5.2-147.9 18.41-175 25.9-28.9 79.82-30.8 103.83 6.1l11.6 19.5 11.6-19.5c24.11-37.1 78.12-34.8 103.83-6.1 23.71 27.3 18.4 53 18.4 175z"/></svg>

slices/main/templates/shared/_photo_post.html.slim

@@ -0,0 +1,9 @@
+- if extended
+  - post.photos.each_with_index do |photo, idx|
+    div class="rounded max-w-xs"
+      a href="#{post.permalink}#photo-#{idx}"
+        img class="rounded object-cover transition-transform ease-out hover:scale-105 h-48 w-48" src="#{photo["value"]}" alt="#{photo["alt"]}"
+- else
+  div class="rounded max-w-xs"
+    a href="#{post.permalink}"
+      img class="rounded object-cover transition-transform ease-out hover:scale-105 h-48 w-48" src="#{post.photos[0]["value"]}" alt="#{post.photos[0]["alt"]}"

slices/main/templates/shared/_pinboard.html.slim

@@ -0,0 +1,3 @@
+- w_class = defined?(width) ? width : "w-6"
+<svg class="fill-blue-100 hover:fill-blue-400 #{w_class} -rotate-45" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M32 32C32 14.3 46.3 0 64 0H320c17.7 0 32 14.3 32 32s-14.3 32-32 32H290.5l11.4 148.2c36.7 19.9 65.7 53.2 79.5 94.7l1 3c3.3 9.8 1.6 20.5-4.4 28.8s-15.7 13.3-26 13.3H32c-10.3 0-19.9-4.9-26-13.3s-7.7-19.1-4.4-28.8l1-3c13.8-41.5 42.8-74.8 79.5-94.7L93.5 64H64C46.3 64 32 49.7 32 32zM160 384h64v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V384z"/></svg>
+

slices/main/templates/shared/_post.html.slim

@@ -0,0 +1,15 @@
+div class="mb-8 h-entry"
+  h3 class="text-xl text-blue-500 dark:text-indigo-300 mb-2"
+    a class="u-url hover:text-blue-900" href="/post/#{post.slug}"
+      = post.display_title
+  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"
+    == post.excerpt
+    div class="grid gap-4 grid-flow-row grid-cols-#{post.photos.count} grid-rows-1"
+      -post.photos.each do |photo|
+        img class="w-44 h-44 object-cover rounded" src=photo["value"]
+  / == render "shared/tags", tags: post.tags
+
+  p class="text-sm text-blue-400 dark:text-indigo-400"
+    a class="u-url" href="#{post.permalink}"
+      time class="dt-published" datetime=post.machine_published_at
+        = post.display_published_at

slices/main/templates/shared/_status.html.slim

@@ -0,0 +1,22 @@
+div class="mb-8 h-entry border border-gray-200 m-2 p-4 bg-gray-50 hover:bg-gray-100 dark:border-slate-800 dark:bg-slate-900 dark:hover:bg-slate-950 hover:dark:border-slate-900 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 prose-img:rounded"
+      == " 💬 #{post.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
+
+  div class="mb-8"
+    p class="text-sm text-blue-400 dark:text-indigo-400"
+      a class="u-url float-left mr-0" href="#{post.permalink}"
+        time class="dt-published" datetime=post.machine_published_at
+          = post.display_published_at
+        - if post.webmentions.count > 0
+          == " · #{post.webmentions.count} comment(s)"
+
+        - post.syndicated_to.each do |loc|
+          == " ·"
+          a rel="syndication" class="u-syndication inline-block ml-1 float-left" href=loc[:url]
+            - if loc[:location] != ""
+              == render "shared/#{loc[:location]}", width: "w-4"

slices/main/templates/shared/_swarm.html.slim

@@ -0,0 +1,2 @@
+- w_class = defined?(width) ? width : "w-4"
+<svg class="fill-pink-100 hover:fill-pink-400 #{w_class}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 368 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M323.1 3H49.9C12.4 3 0 31.3 0 49.1v433.8c0 20.3 12.1 27.7 18.2 30.1 6.2 2.5 22.8 4.6 32.9-7.1C180 356.5 182.2 354 182.2 354c3.1-3.4 3.4-3.1 6.8-3.1h83.4c35.1 0 40.6-25.2 44.3-39.7l48.6-243C373.8 25.8 363.1 3 323.1 3zm-16.3 73.8l-11.4 59.7c-1.2 6.5-9.5 13.2-16.9 13.2H172.1c-12 0-20.6 8.3-20.6 20.3v13c0 12 8.6 20.6 20.6 20.6h90.4c8.3 0 16.6 9.2 14.8 18.2-1.8 8.9-10.5 53.8-11.4 58.8-.9 4.9-6.8 13.5-16.9 13.5h-73.5c-13.5 0-17.2 1.8-26.5 12.6 0 0-8.9 11.4-89.5 108.3-.9.9-1.8.6-1.8-.3V75.9c0-7.7 6.8-16.6 16.6-16.6h219c8.2 0 15.6 7.7 13.5 17.5z"/></svg>

slices/main/templates/shared/_tags.html.slim

@@ -0,0 +1,8 @@
+- if tags.count > 0
+  p class="mb-2"
+    = "Tagged"
+  div class="mb-2 justify-end gap-x-1.5"
+    - tags.each do |post_tag|
+      span
+        a  class="p-category rounded mr-1 u-url text-pink-400 hover:text-pink-600 dark:text-pink-400 dark:hover:text-pink-100 text-gray-600" href="/tagged/#{post_tag.slug}"
+          = "##{post_tag.label}"

slices/main/templates/shared/_twitter.html.slim

@@ -0,0 +1,2 @@
+- w_class = defined?(width) ? width : "w-6"
+<svg xmlns="http://www.w3.org/2000/svg" class="fill-blue-200 hover:fill-blue-600 #{w_class}" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M459.4 151.7c.3 4.5 .3 9.1 .3 13.6 0 138.7-105.6 298.6-298.6 298.6-59.5 0-114.7-17.2-161.1-47.1 8.4 1 16.6 1.3 25.3 1.3 49.1 0 94.2-16.6 130.3-44.8-46.1-1-84.8-31.2-98.1-72.8 6.5 1 13 1.6 19.8 1.6 9.4 0 18.8-1.3 27.6-3.6-48.1-9.7-84.1-52-84.1-103v-1.3c14 7.8 30.2 12.7 47.4 13.3-28.3-18.8-46.8-51-46.8-87.4 0-19.5 5.2-37.4 14.3-53 51.7 63.7 129.3 105.3 216.4 109.8-1.6-7.8-2.6-15.9-2.6-24 0-57.8 46.8-104.9 104.9-104.9 30.2 0 57.5 12.7 76.7 33.1 23.7-4.5 46.5-13.3 66.6-25.3-7.8 24.4-24.4 44.8-46.1 57.8 21.1-2.3 41.6-8.1 60.4-16.2-14.3 20.8-32.2 39.3-52.6 54.3z"/></svg>