1 files changed, 21 insertions, 22 deletions
diff --git a/docs/layouts/partials/icons.html b/docs/layouts/partials/icons.html
index 438d00433..b64693d22 100644
--- a/docs/layouts/partials/icons.html
+++ b/docs/layouts/partials/icons.html
@@ -1,30 +1,29 @@
 <div class="my-5">
-  <div class="d-flex mb-4">
-    <h2 id="icons" class="mb-0">Icons</h2>
+  <div class="d-flex align-items-center mb-4">
+    <h2 id="icons" class="mb-0 h1">Icons</h2>
     <form class="subnav-search d-flex flex-nowrap ms-auto">
       <label for="search" class="visually-hidden">Search for icons</label>
       <input class="form-control search mb-0" id="search" type="search" placeholder="Start typing to filter..." autocomplete="off">
     </form>
   </div>
-  <ul class="row row-cols-3 row-cols-sm-4 row-cols-lg-6 row-cols-xl-8 list-unstyled list">
-    {{ range (where .Site.RegularPages "Type" "icons") -}}
-      {{- $filename := .File.TranslationBaseName -}}
-      {{- with .Site.GetPage .File.Path }}
-      <li class="col mb-4"{{ with .Params.tags }} data-tags="{{ delimit . " " }}"{{ end }}{{ with .Params.categories }} data-categories="{{ delimit . " " | lower }}"{{ end }}>
-        <a class="d-block text-dark text-decoration-none" href="{{ .RelPermalink }}">
-          <div class="p-3 py-4 mb-2 bg-light text-center rounded">
-            {{ if $.IsHome -}}
-            <svg class="bi" width="1em" height="1em" fill="currentColor">
-              <use xlink:href="bootstrap-icons.svg#{{ $filename }}"/>
-            </svg>
-            {{- else -}}
-            <i class="bi bi-{{ $filename }}"></i>
-            {{- end }}
-          </div>
-          <div class="name text-muted text-decoration-none text-center pt-1">{{ $filename }}</div>
-        </a>
-      </li>
-      {{- end }}
-    {{- end }}
+  <ul class="list-unstyled list">
+    {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }}
+      {{ if eq "categories" $taxonomyname }}
+        {{ range $key, $value := $taxonomy }}
+          <li class="my-5" id="{{ $key }}">
+            <h3 class="d-flex align-items-center gap-3 pb-3 mb-4 border-bottom">
+              {{ $key | humanize }}
+              <small class="badge fs-6 text-muted bg-light rounded-pill">{{ .Count }}</small>
+            </h3>
+            <ul class="row row-cols-3 row-cols-sm-4 row-cols-lg-6 row-cols-xl-8 list-unstyled">
+              {{ range $value.Pages }}
+                {{ partial "icon" . }}
+              {{ end }}
+            </ul>
+          </li>
+        {{ end }}
+      {{ end }}
+    {{ end }}
   </ul>
 </div>
+