From e6df73a4533c77fc309296838d4707d8f29db137 Mon Sep 17 00:00:00 2001
From: Anna Beddow <anna.beddow@gmail.com>
Date: Tue, 26 May 2026 16:49:25 +0100
Subject: [PATCH] Don't check for flexible container in avatar as it cannot be
 a scrollable-small image size in a flexible container.

---
 dotcom-rendering/src/components/Card/Card.tsx |  1 -
 .../Card/components/AvatarContainer.tsx       | 28 ++++++++-----------
 2 files changed, 11 insertions(+), 18 deletions(-)

diff --git a/dotcom-rendering/src/components/Card/Card.tsx b/dotcom-rendering/src/components/Card/Card.tsx
index deb42e7a2d4..93dd266e13d 100644
--- a/dotcom-rendering/src/components/Card/Card.tsx
+++ b/dotcom-rendering/src/components/Card/Card.tsx
@@ -924,7 +924,6 @@ export const Card = ({
 								imageSize={mediaSize}
 								imagePositionOnDesktop={mediaPositionOnDesktop}
 								imagePositionOnMobile={mediaPositionOnMobile}
-								isFlexibleContainer={isFlexibleContainer}
 							>
 								<Avatar
 									src={media.avatarUrl}
diff --git a/dotcom-rendering/src/components/Card/components/AvatarContainer.tsx b/dotcom-rendering/src/components/Card/components/AvatarContainer.tsx
index 5500232bc26..6c8cd45fc19 100644
--- a/dotcom-rendering/src/components/Card/components/AvatarContainer.tsx
+++ b/dotcom-rendering/src/components/Card/components/AvatarContainer.tsx
@@ -7,7 +7,6 @@ type Props = {
 	imageSize: MediaSizeType;
 	imagePositionOnDesktop: MediaPositionType;
 	imagePositionOnMobile: MediaPositionType;
-	isFlexibleContainer: boolean;
 };
 
 const sideMarginStyles = css`
@@ -16,7 +15,6 @@ const sideMarginStyles = css`
 
 const sizingStyles = (
 	imageSize: MediaSizeType,
-	isFlexibleContainer: boolean,
 	isVerticalOnDesktop: boolean,
 	isVerticalOnMobile: boolean,
 ) => {
@@ -34,19 +32,10 @@ const sizingStyles = (
 	switch (imageSize) {
 		case 'small':
 		case 'scrollable-small':
-			return isFlexibleContainer
-				? css`
-						width: 90px;
-						height: 90px;
-						${until.tablet} {
-							height: 80px;
-							width: 80px;
-						}
-				  `
-				: css`
-						width: 80px;
-						height: 80px;
-				  `;
+			return css`
+				width: 80px;
+				height: 80px;
+			`;
 		case 'large':
 		case 'xlarge':
 			return css`
@@ -71,6 +60,13 @@ const sizingStyles = (
 				}
 			`;
 		case 'medium':
+		case 'carousel':
+		case 'scrollable-medium':
+		case 'podcast':
+		case 'highlights-card':
+		case 'feature':
+		case 'feature-large':
+		case 'feature-immersive':
 		default:
 			return css`
 				width: 90px;
@@ -88,7 +84,6 @@ export const AvatarContainer = ({
 	imageSize,
 	imagePositionOnDesktop,
 	imagePositionOnMobile,
-	isFlexibleContainer,
 }: Props) => {
 	const isVerticalOnDesktop =
 		imagePositionOnDesktop === 'top' || imagePositionOnDesktop === 'bottom';
@@ -101,7 +96,6 @@ export const AvatarContainer = ({
 				sideMarginStyles,
 				sizingStyles(
 					imageSize,
-					isFlexibleContainer,
 					isVerticalOnDesktop,
 					isVerticalOnMobile,
 				),