render-table improvement

Author: stefan-wenig

docs/_data/tables/index.yml

@@ -1,6 +1,6 @@
 getting-started:
   headers:
-    step: Intitial steps
+    step: Initial steps
     documentation: Documentation
     advanced-topics: Advanced topics
   body:

docs/_includes/render-table.html

@@ -49,7 +49,9 @@
                         {%- for cell in include.table.headers -%}
                             {%- assign columnId = cell[0] -%}
                             {%- unless columnId == "_attributes" or table-omit-columns contains columnId or row[columnId] == "$skip" -%}
-                                <td markdown="1" {% for attribute in row._attributes[columnId] %} {{ attribute[0] }}="{{ attribute[1] }}" {% endfor %} >
+                                <td markdown="1" data-label="{{
+                                    include.table.headers[columnId]
+                                }}" {% for attribute in row._attributes[columnId] %} {{ attribute[0] }}="{{ attribute[1] }}" {% endfor %} >
 {{ row[columnId] }}
 </td>
                             {%- endunless -%}

docs/assets/index.js

@@ -101,7 +101,7 @@ document.addEventListener('DOMContentLoaded', function() {
     for (var r = 0; r<rows.length; r++) {
       var cells = rows[r].querySelectorAll('td');
       for (var c = 0; c<headers.length; c++) {
-        if (c < cells.length) {
+        if (c < cells.length && !cells[c].dataset.label) { // yaml tables generated by render-table.html already have data-labels. don't override, they know better, e.g. in case of rowspans)
           cells[c].dataset.label = headers[c].innerText;
         }
       }