fix left borders

Author: marjisound

dotcom-rendering/src/components/MoreGalleries.tsx

@@ -46,8 +46,6 @@ const containerStyles = css`
 	margin-left: 0px;
 	margin-right: 0px;
 
-	border-bottom: 1px solid ${palette('--onward-content-border')};
-
 	${from.leftCol} {
 		margin-left: 10px;
 		margin-right: 100px;
@@ -78,6 +76,7 @@ const standardCardsListStyles = css`
 	display: flex;
 	flex-direction: row;
 	gap: 20px;
+	position: relative;
 
 	${from.tablet} {
 		padding-top: ${space[2]}px;
@@ -87,6 +86,16 @@ const standardCardsListStyles = css`
 		flex-direction: column;
 		width: 100%;
 	}
+
+	&::before {
+		content: '';
+		position: absolute;
+		left: -11px;
+		top: 0;
+		bottom: 0;
+		width: 1px;
+		background-color: ${palette('--onward-content-border')};
+	}
 `;
 
 const headerStyles = css`
@@ -239,9 +248,23 @@ const MoreGalleriesSplashCard = ({
 	return (
 		<div
 			css={css`
+				position: relative;
 				margin-bottom: ${space[6]}px;
 				background-color: ${palette('--onward-card-background')};
 				padding: ${space[2]}px;
+				&::before {
+					content: '';
+					position: absolute;
+					left: -11px;
+					top: 0;
+					bottom: 0;
+					width: 1px;
+					background-color: ${palette('--onward-content-border')};
+
+					${until.tablet} {
+						left: -12px;
+					}
+				}
 			`}
 		>
 			{Card({ ...defaultProps, ...cardProps })}