FIX: respect the align and width parameter of table directives (#968)

* fix: respect the width instructions

* fix: respect the align parameter

* default to center

Author: 12rambau

src/pydata_sphinx_theme/assets/styles/content/_tables.scss

@@ -10,6 +10,18 @@ table {
   overflow: auto;
 
   @include scrollbar-style();
+
+  // default to table-center
+  margin-left: auto;
+  margin-right: auto;
+
+  &.table-right {
+    margin-right: 0;
+  }
+
+  &.table-left {
+    margin-left: 0;
+  }
 }
 
 // customize table caption from bootstrap

src/pydata_sphinx_theme/bootstrap_html_translator.py

@@ -1,7 +1,6 @@
 """A custom Sphinx HTML Translator for Bootstrap layout
 """
 from packaging.version import Version
-from docutils import nodes
 
 import sphinx
 from sphinx.writers.html5 import HTML5Translator
@@ -29,9 +28,13 @@ def starttag(self, *args, **kwargs):
         return super().starttag(*args, **kwargs)
 
     def visit_table(self, node):
-        # type: (nodes.Element) -> None
-        # copy of sphinx source to *not* add 'docutils' and 'align-default' classes
-        # but add 'table' class
+        """
+        copy of sphinx source to *not* add 'docutils' and 'align-default' classes
+        but add 'table' class
+        """
+
+        # init the attributes
+        atts = {}
 
         # generate_targets_for_table is deprecated in 4.0
         if Version(sphinx.__version__) < Version("4.0"):
@@ -42,14 +45,20 @@ def visit_table(self, node):
         else:
             self._table_row_indices.append(0)
 
+        # get the classes
         classes = [cls.strip(" \t\n") for cls in self.settings.table_style.split(",")]
 
         # we're looking at the 'real_table', which is wrapped by an autosummary
         if isinstance(node.parent, autosummary_table):
             classes += ["autosummary"]
 
-        # classes.insert(0, "docutils")  # compat
-        # if 'align' in node:
-        #     classes.append('align-%s' % node['align'])
-        tag = self.starttag(node, "table", CLASS=" ".join(classes))
+        # add the width if set in a style attribute
+        if "width" in node:
+            atts["style"] = f'width: {node["width"]}'
+
+        # add specific class if align is set
+        if "align" in node:
+            classes.append(f'table-{node["align"]}')
+
+        tag = self.starttag(node, "table", CLASS=" ".join(classes), **atts)
         self.body.append(tag)