Fix Markdown lists rendering and enable extra extensions

Author: rclement

CHANGELOG.md

@@ -5,6 +5,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+### Fixed
+- Markdown lists rendering
+
+### Added
+- Enable extra extensions for Markdown rendering
+
+### Changed
+- Update dependencies
 
 ## [0.5.3] - 2023-06-05
 ### Fixed

datasette_dashboards/static/dashboards.css

@@ -75,6 +75,17 @@
   height: 100%;
 }
 
+.dashboard-card-chart ul {
+  list-style: initial;
+  list-style-position: inside;
+}
+
+.dashboard-card-chart ol {
+  list-style: initial;
+  list-style-position: inside;
+  list-style-type: decimal;
+}
+
 .chart-container {
   width: 100%;
   height: 70vh;

datasette_dashboards/templates/dashboard_chart.html

@@ -55,7 +55,12 @@ <h1>{{ dashboard.title }}</h1>
     <div class="dashboard-card">
       <div id="chart" class="chart-container">
         {% if chart.library == 'markdown' %}
-        {{ render_markdown(chart.display) }}
+        {{ render_markdown(
+              chart.display,
+              extensions=["extra"],
+              extra_tags=["table", "thead", "tr", "th", "td", "tbody"]
+            )
+        }}
         {% endif %}
       </div>
     </div>

datasette_dashboards/templates/dashboard_view.html

@@ -112,7 +112,12 @@ <h1>{{ dashboard.title }}</h1>
 
         <div id="chart-{{ chart_slug }}" class="dashboard-card-chart">
           {% if chart.library == 'markdown' %}
-          {{ render_markdown(chart.display) }}
+          {{ render_markdown(
+               chart.display,
+               extensions=["extra"],
+               extra_tags=["table", "thead", "tr", "th", "td", "tbody"]
+             )
+          }}
           {% endif %}
         </div>
       </div>