From 2873c152af44fb7b669610a5c2e315e06ac071da Mon Sep 17 00:00:00 2001
From: =?utf8?q?Vladim=C3=ADr=20Vondru=C5=A1?= <mosra@centrum.cz>
Date: Sat, 13 Oct 2018 18:41:57 +0200
Subject: [PATCH] css: make graph, plot <svg>s and block math <svg> a block
 element.

It was inline, which caused weird padding on the bottom.
---
 css/m-components.css             | 14 +++++++++++---
 css/m-dark+doxygen.compiled.css  | 14 +++++++++++---
 css/m-dark.compiled.css          | 14 +++++++++++---
 css/m-light+doxygen.compiled.css | 14 +++++++++++---
 css/m-light.compiled.css         | 14 +++++++++++---
 5 files changed, 55 insertions(+), 15 deletions(-)

diff --git a/css/m-components.css b/css/m-components.css
index 39bb4bb9..720a8ade 100644
--- 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 b94faedc..0d525a67 100644
--- 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 c23f3aa6..56e3680e 100644
--- 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 addc9ce9..ee65c20b 100644
--- 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 a30bd2a3..ec58b592 100644
--- 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; }
-- 
2.30.2