[PATCH 1/3] doc: move CSS of overview matrices

[Thomas Monjalon]

The CSS to transform overview tables in matrices
with small cells and yellow cross on hover
was inlined before each table.

It can be replaced by a common definition in a new CSS class.

Two basic rules are moved to the top of the file before this new class.

Signed-off-by: Thomas Monjalon <thomas at monjalon.net>
---
 doc/guides/conf.py    | 73 +---------------------------------
 doc/guides/custom.css | 92 +++++++++++++++++++++++++++++++++++++------
 2 files changed, 80 insertions(+), 85 deletions(-)

diff --git a/doc/guides/conf.py b/doc/guides/conf.py
index 5f0a602741..18dd6f4663 100644
--- a/doc/guides/conf.py
+++ b/doc/guides/conf.py
@@ -253,7 +253,7 @@ def generate_overview_table(output_filename, table_id, section, table_name, titl
     outfile = open(output_filename, 'w')
     num_cols = len(header_names)
 
-    print_table_css(outfile, table_id)
+    print('.. rst-class:: matrix', file=outfile)
     print('.. _' + table_name + ':', file=outfile)
     print('.. table:: ' + table_name + '\n', file=outfile)
     print_table_header(outfile, num_cols, header_names, title)
@@ -311,77 +311,6 @@ def print_table_divider(outfile, num_cols):
     print_table_row(outfile, feature, line)
 
 
-def print_table_css(outfile, table_id):
-    template = """
-.. raw:: html
-
-   <style>
-      .wy-nav-content {
-         opacity: .99;
-      }
-      table#idx {
-         cursor: default;
-         overflow: hidden;
-      }
-      table#idx p {
-         margin: 0;
-         line-height: inherit;
-      }
-      table#idx th, table#idx td {
-         text-align: center;
-         border: solid 1px #ddd;
-      }
-      table#idx th {
-         padding: 0.5em 0;
-      }
-      table#idx th, table#idx th p {
-         font-size: 11px;
-         white-space: pre-wrap;
-         vertical-align: top;
-         min-width: 0.9em;
-      }
-      table#idx col:first-child {
-         width: 0;
-      }
-      table#idx th:first-child {
-         vertical-align: bottom;
-      }
-      table#idx td {
-         padding: 1px;
-      }
-      table#idx td, table#idx td p {
-         font-size: 11px;
-      }
-      table#idx td:first-child {
-         padding-left: 1em;
-         text-align: left;
-      }
-      table#idx tr:nth-child(2n-1) td {
-         background-color: rgba(210, 210, 210, 0.2);
-      }
-      table#idx th:not(:first-child):hover,
-      table#idx td:not(:first-child):hover {
-         position: relative;
-      }
-      table#idx th:not(:first-child):hover::after,
-      table#idx td:not(:first-child):hover::after {
-         content: '';
-         height: 6000px;
-         top: -3000px;
-         width: 100%;
-         left: 0;
-         position: absolute;
-         z-index: -1;
-         background-color: #ffb;
-      }
-      table#idx tr:hover td {
-         background-color: #ffb;
-      }
-   </style>
-"""
-    print(template.replace("idx", "id%d" % (table_id)), file=outfile)
-
-
 def setup(app):
     table_file = dirname(__file__) + '/nics/overview_table.txt'
     generate_overview_table(table_file, 1,
diff --git a/doc/guides/custom.css b/doc/guides/custom.css
index 9c19a28cc8..7ab175db35 100644
--- a/doc/guides/custom.css
+++ b/doc/guides/custom.css
@@ -4,19 +4,6 @@
 
 /* Override readthedocs theme */
 
-/* Set full width for all responsive tables of a page.
- * Usage: insert the following line in the doc.
- *        .. rst-class:: widepage
- */
- at media screen and (min-width: 1100px) {
-    .wy-nav-content-wrap:has(.widepage) {
-        background: #fcfcfc !important;
-    }
-    .wy-nav-content:has(.widepage) .wy-table-responsive {
-        overflow: visible !important;
-    }
-}
-
 /* Spacing before a list item must be bigger than spacing inside the item.
  * Complex list items start with a p.first element. */
 .section li > .first {
@@ -28,6 +15,85 @@ th.head {
 	background-color: #ccc;
 }
 
+/* Overview matrix with small cells and yellow cross.
+ * Usage: insert the following line in the doc.
+ *        .. rst-class:: matrix
+ */
+.wy-nav-content:has(.matrix) {
+	opacity: .99;
+}
+table.matrix {
+	cursor: default;
+	overflow: hidden;
+}
+table.matrix.docutils.align-default tr > :is(th, td) > p {
+	margin: 0;
+	line-height: inherit;
+}
+table.matrix.docutils.align-default tr > :is(th, td) {
+	text-align: center;
+	border: solid 1px #ddd;
+}
+table.matrix.docutils th {
+	padding: 0.5em 0;
+}
+table.matrix.docutils th,
+table.matrix.docutils.align-default tr > th > p {
+	font-size: 11px;
+	white-space: pre-wrap;
+	vertical-align: top;
+	min-width: 0.9em;
+}
+table.matrix col:first-child {
+	width: 0;
+}
+table.matrix.docutils.align-default th:first-child {
+	vertical-align: bottom;
+}
+table.matrix.docutils td {
+	padding: 1px;
+}
+table.matrix.docutils td,
+table.matrix.docutils.align-default tr > td > p {
+	font-size: 11px;
+}
+table.matrix.docutils.align-default td:first-child {
+	padding-left: 1em;
+	text-align: left;
+}
+table.matrix.docutils.align-default tr:nth-child(2n-1) td {
+	background-color: rgba(210, 210, 210, 0.2);
+}
+table.matrix :is(th, td):not(:first-child):hover {
+	position: relative;
+}
+table.matrix :is(th, td):not(:first-child):hover::after {
+	content: '';
+	height: 6000px;
+	top: -3000px;
+	width: 100%;
+	left: 0;
+	position: absolute;
+	z-index: -1;
+	background-color: #ffb;
+}
+table.matrix.docutils.align-default tr:hover td {
+	background-color: #ffb;
+}
+
+/* Set full width for all responsive tables of a page.
+ * Usage: insert the following line in the doc.
+ *        .. rst-class:: widepage
+ */
+ at media screen and (min-width: 1100px) {
+    .wy-nav-content-wrap:has(.widepage) {
+        background: #fcfcfc !important;
+    }
+    .wy-nav-content:has(.widepage) .wy-table-responsive {
+        overflow: visible !important;
+    }
+}
+
 /* Class numbering table rows in the first column.
  * Usage: insert the following line before the table without indent.
  *        .. rst-class:: numbered-table
-- 
2.55.0