Move glossary from HTML to markdown, add first-letter separators for TOC (#37644)

source/_docs/glossary.html

@@ -1,31 +0,0 @@
----
-title: "Glossary"
-description: "Home Assistant's Glossary."
----
-
-{% assign entries = site.data.glossary | sort: 'term' %}
-
-The glossary covers terms which are used around Home Assistant.
-
-<div class="config-vars basic">
-
-{% for entry in entries %}
-
-<div class="config-vars-item">
-  <div class="config-vars-label">
-    <a name="{{ entry.term | slugify }}" class="title-link" href="#{{ entry.term | slugify }}"></a>
-    <span class="config-vars-label-name">{{ entry.term }}</span>
-  </div>
-  <div class="config-vars-description-and-children">
-    <span class="config-vars-description">
-      {{ entry.definition | markdownify | newline_to_br }}
-      {%- if entry.link -%}
-      <a href="{{ entry.link }}">Read more about: {{ entry.term }}</a>
-      {%- endif -%}
-    </span>
-  </div>
-</div>
-
-{% endfor %}
-
-</div>

source/_docs/glossary.markdown

@@ -0,0 +1,33 @@
+---
+title: "Glossary"
+description: "Home Assistant's Glossary."
+---
+
+The glossary covers terms which are used around Home Assistant.
+
+{% assign entries = site.data.glossary | sort: 'term' %}
+{% assign current_letter = '' %}
+
+{% for entry in entries %}
+
+{% assign first_letter = entry.term | slice: 0 %}
+{% if first_letter != current_letter %}
+{% assign current_letter = first_letter | upcase %}
+
+## {{ current_letter }}
+
+---
+
+{% endif %}
+
+### {{ entry.term }}
+
+{{ entry.definition | markdownify }}
+
+{%- if entry.link -%}
+
+{{ "[Read more about " | append: "_" | append: entry.term | append: "_](" | append: entry.link | append: ")" | markdownify }}
+
+{%- endif -%}
+
+{% endfor %}