Add breadcrumbs to the documentation (#9242)

<img width="815" alt="Screenshot 2024-11-19 at 2 10 10 PM"
src="https://github.com/user-attachments/assets/49e645d2-1648-40b4-8bb4-ba5d6545a353">
<img width="815" alt="Screenshot 2024-11-19 at 2 10 25 PM"
src="https://github.com/user-attachments/assets/854d7bee-dc16-4429-ae11-789f50d1c6a4">

docs/stylesheets/extra.css

@@ -201,3 +201,12 @@ h3.cli-reference {
 .toclink:hover {
   color: var(--md-accent-fg-color) !important;
 }
+
+
+/* Omit the first breadcrumb item, which is the "Introduction" */
+.md-path__list > .md-path__item:first-of-type {
+  display: none;
+}
+.md-path__list > .md-path__item:nth-of-type(2):before {
+  display: none;
+}

mkdocs.template.yml

@@ -4,6 +4,7 @@ theme:
   logo: assets/logo-letter.svg
   favicon: assets/favicon.ico
   features:
+    - navigation.path
     - navigation.instant
     - navigation.instant.prefetch
     - navigation.instant.progress