Refactor app in to its own slice

slices/main/templates/trips/index.html.slim

@@ -0,0 +1,23 @@
+- 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
+
+  div class="mb-12 max-w-prose mx-auto"
+    table class="prose dark:prose-invert table-fixed"
+      - trip_years.each do |year, trips|
+        thead
+          tr colspan=2
+            td class="text-xl" = year
+        - trips.each do |trip|
+          tr
+            td
+              a class="block" href="/trips/#{trip.id}"
+                = trip.name
+              span class="text-right text-sm text-gray-400 dark:text-indigo-300 break-normal"
+                = "#{trip.start_date.strftime("%d %b")} — #{trip.end_date.strftime("%d %b")}"
+            td
+              = trip.subtitle
+
+
+div class="max-w-screen-md mx-auto border-t border-solid border-gray-200 dark:border-gray-600"

slices/main/templates/trips/show.html.slim

@@ -0,0 +1,22 @@
+- context.content_for(:title, "#{trip.name} | ")
+
+- if places.count > 0
+  script src='https://api.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.js'
+  link href='https://api.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.css' rel='stylesheet'
+
+div class="mb-4 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
+  h1 class="mb-0" #{trip.name}
+  / p class="mt-2" class="text-gray-600 dark:text-gray-200 text-sm" (#{trip.start_date} - #{trip.end_date})
+
+- if trip.summary
+  div class="mb-4 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200 bg-gray-100 dark:bg-gray-900 p-2 rounded prose-p:mb-0 prose-ul:mt-0"
+    == trip.summary
+
+div class="mb-4 max-w-prose mx-auto"
+  div class="rounded" id='map' style='width: 100%; height: 400px' data-markers="#{JSON.generate(places.map(&:value))}"
+
+div class="h-feed mb-12 max-w-prose mx-auto"
+  - posts.each do |post|
+    == render "shared/compact_post", post: post, trip: trip, first: post.id == posts.first.id, last: post.id == posts.last.id
+
+div class="max-w-screen-md mx-auto border-t border-solid border-gray-200 dark:border-gray-600"