update usability on item rentals page

themes/gallo/layouts/_default/single.html

@@ -6,8 +6,8 @@
       <p class="text-lg">{{ .Params.subTitle }}</p>
       {{ partial "metadata.html" . }}
       <div class="mt-2 flex flex-col gap-4">{{ .Content }}</div>
-      {{ partial "buttons.html" . }}
-      {{ partial "rental-catalog.html" . }}
+      {{ partial "buttons.html" . }} {{ if .Params.catalog }} {{ partial
+      "rental-catalog.html" . }} {{ end }}
     </div>
 
     {{ partial "questions.html" . }} {{ partial "gallery.html" . }} {{ partial

themes/gallo/layouts/partials/rental-catalog.html

@@ -1,6 +1,13 @@
 <div
   class="mt-4 pb-2 flex flex-row gap-2 max-w-full overflow-x-auto whitespace-nowrap"
 >
+  <button
+    id="all"
+    class="flex gap-2 items-center px-4 border border-gray-200 rounded-lg focus:outline-none"
+    onclick="window.location.href = '/catalog'"
+  >
+    <span class="text-sm p-2 font-medium text-gray-900">All</span>
+  </button>
   {{ $uniqueCategories := slice }} {{ range .Params.catalog }} {{ if not (in
   $uniqueCategories .cat) }} {{ $uniqueCategories = $uniqueCategories | append
   .cat }}
@@ -34,12 +41,12 @@
     <div class="px-1 pt-4">
       <div class="flex flex-row gap-2 justify-between font-bold text-xl mb-2">
         {{ .item }} {{ if ne .cat "" }}
-        <div>
+        <a class="z-10" href="/catalog/#{{ .cat }}">
           <span
             class="bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-full"
             >{{ .cat }}</span
           >
-        </div>
+        </a>
         {{ end }}
       </div>
       <div class="text-gray-800 text-base">