docs: make asciinema template based

docs/examples/check/index.md

@@ -1,10 +1,10 @@
+---
+asciinema: true
+---
+
 # Check
 
-<div id="demo"></div>
-<script src="/javascripts/asciinema-player.min.js"></script>
-<script async>
-  AsciinemaPlayer.create('./demo.cast', document.getElementById('demo'),{loop:true});
-</script>
+<div id="demo-cast"></div>
 
 ```make title="check.mk"
 --8<-- "docs/examples/check/check.mk"

docs/examples/embedded/index.md

@@ -1,10 +1,10 @@
+---
+asciinema: true
+---
+
 # Embedded
 
-<div id="demo"></div>
-<script src="/javascripts/asciinema-player.min.js"></script>
-<script async>
-  AsciinemaPlayer.create('./demo.cast', document.getElementById('demo'),{loop: true});
-</script>
+<div id="demo-cast"></div>
 
 ```make title="embedded.mk"
 --8<-- "docs/examples/embedded/embedded.mk"

docs/overrides/main.html

@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+
+{% block scripts %}
+
+  {{ super() }}
+
+  {% if page.meta %}
+  {% if page.meta.asciinema %}
+  <script async>
+  AsciinemaPlayer.create('./demo.cast', document.getElementById('demo-cast'),{loop: true});
+  </script>
+  {% endif %}
+  {% endif %}
+
+
+{% endblock %}

mkdocs.yml

@@ -1,9 +1,11 @@
 site_name: task.mk
 site_url: https://gh.dayl.in/task.mk
 repo_url: https://github.com/daylinmorgan/task.mk
+edit_uri: edit/main/docs/
 repo_name: daylinmorgan/task.mk
 theme:
   name: material
+  custom_dir: docs/overrides
   features:
     - navigation.indexes
   palette:
@@ -11,8 +13,8 @@ theme:
 extra_css:
   - stylesheets/extra.css
   - stylesheets/asciinema-player.css
-# extra_javascript:
-  # - javascripts/asciinema-player.min.js
+extra_javascript:
+  - javascripts/asciinema-player.min.js
 plugins:
   - search
   - git-revision-date-localized: