Apply Datawrapper spacing only for some roles

guardian · Oct 1, 2024 · 0e55a5b · 0e55a5b
1 parent 2e132fe
commit 0e55a5b
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/dotcom-rendering/src/components/Figure.tsx b/dotcom-rendering/src/components/Figure.tsx
@@ -17,8 +17,8 @@ type Props = {
 const roleCss = (isDatawrapperGraphic: boolean) => {
 	return {
 		inline: css`
-			margin-top: ${space[3]}px;
-			margin-bottom: ${space[3]}px;
+			margin-top: ${space[isDatawrapperGraphic ? 8 : 3]}px;
+			margin-bottom: ${space[isDatawrapperGraphic ? 8 : 3]}px;
 		`,
 
 		supporting: css`
@@ -72,8 +72,8 @@ const roleCss = (isDatawrapperGraphic: boolean) => {
 		`,
 
 		showcase: css`
-			margin-top: ${space[3]}px;
-			margin-bottom: ${space[3]}px;
+			margin-top: ${space[isDatawrapperGraphic ? 8 : 3]}px;
+			margin-bottom: ${space[isDatawrapperGraphic ? 8 : 3]}px;
 			position: relative;
 			${from.leftCol} {
 				margin-left: -160px;

diff --git a/dotcom-rendering/src/components/InteractiveBlockComponent.importable.tsx b/dotcom-rendering/src/components/InteractiveBlockComponent.importable.tsx
@@ -119,8 +119,6 @@ const wrapperStyle = ({
 		? `
 	border-top: 1px solid #dcdcdc;
 	padding-top: 8px;
-    margin-top: 32px;
-    margin-bottom: 32px;
 	`
 		: ''}
 `;