Merge pull request apollographql#158 from apollographql/mermaid-bottom-margin

Stephen Barlow · web-flow · commit bceab4110d1a · 2020-10-28T14:57:12.000-07:00
Give Mermaid SVG blocks same bottom margin as other blocks.
diff --git a/packages/gatsby-theme-apollo-core/src/styles.less b/packages/gatsby-theme-apollo-core/src/styles.less
@@ -12,7 +12,7 @@ body {
 
 @default-margin: 1.45rem;
 
-h1, h2, h3, h4, h5, h6, p, ul, ol, img.screenshot {
+h1, h2, h3, h4, h5, h6, p, ul, ol, img, div.mermaid {
   margin: 0;
   margin-bottom: @default-margin;
 }
diff --git a/packages/gatsby-theme-apollo-docs/src/components/page-content.js b/packages/gatsby-theme-apollo-docs/src/components/page-content.js
@@ -73,8 +73,7 @@ const BodyContent = styled.div({
   },
   img: {
     display: 'block',
-    maxWidth: '100%',
-    margin: '0 auto'
+    maxWidth: '100%'
   },
   '.mermaid svg': {
     maxWidth: '100%'

Original file line number	Diff line number	Diff line change
`@@ -12,7 +12,7 @@ body {`
`12`	`12`
`13`	`13`	`@default-margin: 1.45rem;`
`14`	`14`
`15`		`-h1, h2, h3, h4, h5, h6, p, ul, ol, img.screenshot {`
	`15`	`+h1, h2, h3, h4, h5, h6, p, ul, ol, img, div.mermaid {`
`16`	`16`	`margin: 0;`
`17`	`17`	`margin-bottom: @default-margin;`
`18`	`18`	`}`