css: make graph, plot <svg>s and block math <svg> a block element.

It was inline, which caused weird padding on the bottom.

diff --git a/css/m-components.css b/css/m-components.css
index 39bb4bb9a2eb5fe71a2cb4e2891a68c57ef99b4c..720a8ade4cc0077aa7bdbd7d1bb8dea4088e0b72 100644 (file)
--- a/css/m-components.css
+++ b/css/m-components.css
@@ -976,7 +976,11 @@ pre.m-code.m-inverted > span.hll {
 div.m-math {
   overflow-x: auto;
   overflow-y: hidden; /* Chrome 62 displays a vertical scrollbar otherwise */
-  text-align: center;
+}
+div.m-math svg {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }
 div.m-button a svg.m-math { fill: var(--button-background-color); }
 div.m-button.m-flat a svg.m-math { fill: var(--color); }
@@ -986,9 +990,13 @@ div.m-button.m-default a:active svg.m-math {
 }
 
 /* Plots, graphs */
-div.m-plot, div.m-graph { text-align: center; }
 div.m-graph { font-size: var(--font-size); }
-div.m-plot svg, div.m-graph svg { max-width: 100%; }
+div.m-plot svg, div.m-graph svg {
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
 div.m-plot .m-background { fill: var(--plot-background-color); }
 /* Font sizes are hardcoded in m.plots, change there first! */
 div.m-plot svg .m-label { font-size: 11px; }

diff --git a/css/m-dark+doxygen.compiled.css b/css/m-dark+doxygen.compiled.css
index b94faedc9bed9ee2a70555c74fa40de6a47a8b48..0d525a67625f05fc66fa186d0fd4a93d5df0b971 100644 (file)
--- a/css/m-dark+doxygen.compiled.css
+++ b/css/m-dark+doxygen.compiled.css
@@ -1279,7 +1279,11 @@ pre.m-code.m-inverted > span.hll {
 div.m-math {
   overflow-x: auto;
   overflow-y: hidden;
-  text-align: center;
+}
+div.m-math svg {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }
 div.m-button a svg.m-math { fill: #22272e; }
 div.m-button.m-flat a svg.m-math { fill: #dcdcdc; }
@@ -1287,9 +1291,13 @@ div.m-button.m-flat a:hover svg.m-math, div.m-button.m-default a:focus svg.m-mat
 div.m-button.m-default a:active svg.m-math {
   fill: #a5c9ea;
 }
-div.m-plot, div.m-graph { text-align: center; }
 div.m-graph { font-size: 16px; }
-div.m-plot svg, div.m-graph svg { max-width: 100%; }
+div.m-plot svg, div.m-graph svg {
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
 div.m-plot .m-background { fill: #34424d; }
 div.m-plot svg .m-label { font-size: 11px; }
 div.m-plot svg .m-title { font-size: 13px; }

diff --git a/css/m-dark.compiled.css b/css/m-dark.compiled.css
index c23f3aa69a8c862e72e224efc779c865779cc39e..56e3680e48f57fa9e954c7e0d72ba570cf9452b5 100644 (file)
--- a/css/m-dark.compiled.css
+++ b/css/m-dark.compiled.css
@@ -1279,7 +1279,11 @@ pre.m-code.m-inverted > span.hll {
 div.m-math {
   overflow-x: auto;
   overflow-y: hidden;
-  text-align: center;
+}
+div.m-math svg {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }
 div.m-button a svg.m-math { fill: #22272e; }
 div.m-button.m-flat a svg.m-math { fill: #dcdcdc; }
@@ -1287,9 +1291,13 @@ div.m-button.m-flat a:hover svg.m-math, div.m-button.m-default a:focus svg.m-mat
 div.m-button.m-default a:active svg.m-math {
   fill: #a5c9ea;
 }
-div.m-plot, div.m-graph { text-align: center; }
 div.m-graph { font-size: 16px; }
-div.m-plot svg, div.m-graph svg { max-width: 100%; }
+div.m-plot svg, div.m-graph svg {
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
 div.m-plot .m-background { fill: #34424d; }
 div.m-plot svg .m-label { font-size: 11px; }
 div.m-plot svg .m-title { font-size: 13px; }

diff --git a/css/m-light+doxygen.compiled.css b/css/m-light+doxygen.compiled.css
index addc9ce903abcca5623c902124153b72643629cf..ee65c20b9816981356fc9350d447b0dc1735fb48 100644 (file)
--- a/css/m-light+doxygen.compiled.css
+++ b/css/m-light+doxygen.compiled.css
@@ -1279,7 +1279,11 @@ pre.m-code.m-inverted > span.hll {
 div.m-math {
   overflow-x: auto;
   overflow-y: hidden;
-  text-align: center;
+}
+div.m-math svg {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }
 div.m-button a svg.m-math { fill: #ffffff; }
 div.m-button.m-flat a svg.m-math { fill: #000000; }
@@ -1287,9 +1291,13 @@ div.m-button.m-flat a:hover svg.m-math, div.m-button.m-default a:focus svg.m-mat
 div.m-button.m-default a:active svg.m-math {
   fill: #cb4b16;
 }
-div.m-plot, div.m-graph { text-align: center; }
 div.m-graph { font-size: 14px; }
-div.m-plot svg, div.m-graph svg { max-width: 100%; }
+div.m-plot svg, div.m-graph svg {
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
 div.m-plot .m-background { fill: #fbf0ec; }
 div.m-plot svg .m-label { font-size: 11px; }
 div.m-plot svg .m-title { font-size: 13px; }

diff --git a/css/m-light.compiled.css b/css/m-light.compiled.css
index a30bd2a31ba049c2cc31100176def62ec4c4da7f..ec58b592b3e2e1a8805f90863dd29fd59e440b68 100644 (file)
--- a/css/m-light.compiled.css
+++ b/css/m-light.compiled.css
@@ -1279,7 +1279,11 @@ pre.m-code.m-inverted > span.hll {
 div.m-math {
   overflow-x: auto;
   overflow-y: hidden;
-  text-align: center;
+}
+div.m-math svg {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }
 div.m-button a svg.m-math { fill: #ffffff; }
 div.m-button.m-flat a svg.m-math { fill: #000000; }
@@ -1287,9 +1291,13 @@ div.m-button.m-flat a:hover svg.m-math, div.m-button.m-default a:focus svg.m-mat
 div.m-button.m-default a:active svg.m-math {
   fill: #cb4b16;
 }
-div.m-plot, div.m-graph { text-align: center; }
 div.m-graph { font-size: 14px; }
-div.m-plot svg, div.m-graph svg { max-width: 100%; }
+div.m-plot svg, div.m-graph svg {
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
 div.m-plot .m-background { fill: #fbf0ec; }
 div.m-plot svg .m-label { font-size: 11px; }
 div.m-plot svg .m-title { font-size: 13px; }