Merge pull request #14290 from guardian/doml/scrollable-highlights-bug-fix

Hide arrow when at end of Scrollable highlights container

Author: domlander

dotcom-rendering/src/components/ScrollableHighlights.importable.tsx

@@ -71,7 +71,7 @@ const itemStyles = css`
 	margin: ${space[3]}px 10px;
 	:first-child {
 		${from.tablet} {
-			margin-left: 0px;
+			margin-left: 0;
 		}
 
 		/**
@@ -87,6 +87,9 @@ const itemStyles = css`
 			margin-left: 240px; /** 240 === 3 columns and 3 column gaps  */
 		}
 	}
+	:last-child {
+		margin-right: 0;
+	}
 `;
 
 const verticalLineStyles = css`
@@ -172,6 +175,7 @@ const getOphanInfo = (frontId?: string) => {
 	const ophanComponentName = ophanComponentId('highlights');
 	const ophanComponentLink = `container-${0} | ${ophanComponentName}`;
 	const ophanFrontName = `Front | /${frontId}`;
+
 	return {
 		ophanComponentName,
 		ophanComponentLink,