Keep large margins for supporting on mobile

These margins were too small: the request from the visuals team is that they be 32px.
guardian · Oct 21, 2024 · 05bda76 · 05bda76
1 parent 135132f
commit 05bda76
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/dotcom-rendering/src/components/Figure.tsx b/dotcom-rendering/src/components/Figure.tsx
@@ -24,8 +24,8 @@ const roleCss = (isDatawrapperGraphic: boolean) => {
 
 		supporting: css`
 			clear: left;
-			margin-top: ${space[3]}px;
-			margin-bottom: ${isDatawrapperGraphic ? space[5] : space[3]}px;
+			margin-top: ${space[isDatawrapperGraphic ? 8 : 3]}px;
+			margin-bottom: ${space[isDatawrapperGraphic ? 8 : 3]}px;
 			${isDatawrapperGraphic
 				? `border-bottom: 1px solid ${themePalette(
 						'--branding-border',
@@ -41,6 +41,7 @@ const roleCss = (isDatawrapperGraphic: boolean) => {
 				margin-right: 20px;
 				line-height: 0;
 				margin-top: ${space[2]}px;
+				${isDatawrapperGraphic ? `margin-bottom: ${space[5]}px;` : ''}
 			}
 			${from.leftCol} {
 				margin-left: -160px;