website: annotate/decorate deprecated items

Author: cpu

website/static/style.css

@@ -162,6 +162,27 @@ h3:hover .anchor,
   border-radius: 0.5em;
 }
 
+.deprecation-box {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.75rem 1rem;
+  margin: 1rem 0;
+  background: #8b5a2b;
+  border-left: 5px solid #f59e0b;
+  border-right: 1px solid #f59e0b;
+  border-top: 1px solid #f59e0b;
+  border-bottom: 1px solid #f59e0b;
+  border-radius: 0.5em;
+}
+
+.toc-deprecated {
+  color: #f59e0b;
+  font-size: 0.8em;
+  font-weight: normal;
+  margin-left: 0.5em;
+}
+
 a:has(code) {
   text-decoration: none;
 }

website/templates/_api_section.html

@@ -18,6 +18,12 @@
         </div>
         {% endif %}
 
+        {% if item.deprecation %}
+        <div class="deprecation-box">
+            <span><strong>⚠️ Deprecated:</strong> {{ item.deprecation }}</span>
+        </div>
+        {% endif %}
+
         {{ item.comment | markdown | safe }}
 
         {% if section_id == "enums" %}

website/templates/macros.html

@@ -16,7 +16,14 @@ <h3>
 <div class="toc">
     <ul>
         {% for item in items %}
-        <li><a href="#{{ item.anchor }}">{{ item.name }}</a></li>
+        <li>
+            <a href="#{{ item.anchor }}">
+                {{ item.name }}
+            </a>
+            {% if item.deprecation %}
+            <span class="toc-deprecated">⚠️ deprecated</span>
+            {% endif %}
+        </li>
         {% endfor %}
     </ul>
 </div>