Skip to content

Commit e569a46

Browse files
authored
Merge pull request #14922 from guardian/doml/remove-rounded-corners
Remove rounded corners from Onwards Content
2 parents 33f2093 + 90441f7 commit e569a46

File tree

3 files changed

+2
-38
lines changed

3 files changed

+2
-38
lines changed

dotcom-rendering/src/components/Card/Card.tsx

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -844,7 +844,6 @@ export const Card = ({
844844
format={format}
845845
showTopBarDesktop={showTopBarDesktop}
846846
showTopBarMobile={showTopBarMobile}
847-
isOnwardContent={isOnwardContent}
848847
containerPalette={containerPalette}
849848
>
850849
<CardLink
@@ -1081,10 +1080,6 @@ export const Card = ({
10811080
imageSize={mediaSize}
10821081
alt={headlineText}
10831082
loading={imageLoading}
1084-
roundedCorners={
1085-
isOnwardContent &&
1086-
!isMoreGalleriesOnwardContent
1087-
}
10881083
aspectRatio={aspectRatio}
10891084
/>
10901085
</div>
@@ -1098,10 +1093,6 @@ export const Card = ({
10981093
imageSize={mediaSize}
10991094
alt={media.imageAltText}
11001095
loading={imageLoading}
1101-
roundedCorners={
1102-
isOnwardContent &&
1103-
!isMoreGalleriesOnwardContent
1104-
}
11051096
aspectRatio={aspectRatio}
11061097
/>
11071098
{isVideoMainMedia && mainMedia.duration > 0 && (
@@ -1143,10 +1134,6 @@ export const Card = ({
11431134
imageSize="small"
11441135
alt={media.imageAltText}
11451136
loading={imageLoading}
1146-
roundedCorners={
1147-
isOnwardContent &&
1148-
!isMoreGalleriesOnwardContent
1149-
}
11501137
aspectRatio="1:1"
11511138
/>
11521139
</div>

dotcom-rendering/src/components/Card/components/CardWrapper.tsx

Lines changed: 1 addition & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { css } from '@emotion/react';
22
import { from, space, until } from '@guardian/source/foundations';
3-
import { ArticleDesign, type ArticleFormat } from '../../../lib/articleFormat';
3+
import type { ArticleFormat } from '../../../lib/articleFormat';
44
import { palette } from '../../../palette';
55
import type { DCRContainerPalette } from '../../../types/front';
66
import { ContainerOverrides } from '../../ContainerOverrides';
@@ -11,7 +11,6 @@ type Props = {
1111
format: ArticleFormat;
1212
showTopBarDesktop: boolean;
1313
showTopBarMobile: boolean;
14-
isOnwardContent: boolean;
1514
containerPalette?: DCRContainerPalette;
1615
};
1716

@@ -93,21 +92,11 @@ const desktopTopBarStyles = css`
9392
}
9493
`;
9594

96-
const onwardContentStyles = css`
97-
border-radius: ${space[2]}px;
98-
overflow: hidden;
99-
100-
:hover .media-overlay {
101-
border-radius: ${space[2]}px;
102-
}
103-
`;
104-
10595
export const CardWrapper = ({
10696
children,
10797
format,
10898
showTopBarDesktop,
10999
showTopBarMobile,
110-
isOnwardContent,
111100
containerPalette,
112101
}: Props) => {
113102
return (
@@ -119,9 +108,6 @@ export const CardWrapper = ({
119108
hoverStyles,
120109
showTopBarDesktop && desktopTopBarStyles,
121110
showTopBarMobile && mobileTopBarStyles,
122-
isOnwardContent &&
123-
format.design !== ArticleDesign.Gallery &&
124-
onwardContentStyles,
125111
]}
126112
>
127113
{children}

dotcom-rendering/src/components/CardPicture.tsx

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { css } from '@emotion/react';
2-
import { breakpoints, space, until } from '@guardian/source/foundations';
2+
import { breakpoints, until } from '@guardian/source/foundations';
33
import type { ImgHTMLAttributes } from 'react';
44
import React from 'react';
55
import type { AspectRatio } from '../types/front';
@@ -14,7 +14,6 @@ export type Props = {
1414
mainImage: string;
1515
loading: Loading;
1616
alt?: string;
17-
roundedCorners?: boolean;
1817
isCircular?: boolean;
1918
aspectRatio?: AspectRatio;
2019
mobileAspectRatio?: AspectRatio;
@@ -200,12 +199,6 @@ const decideAspectRatioStyles = (aspectRatio?: AspectRatio) => {
200199
`;
201200
};
202201

203-
const borderRadius = css`
204-
& > * {
205-
border-radius: ${space[2]}px;
206-
}
207-
`;
208-
209202
const circularStyles = css`
210203
border-radius: 100%;
211204
object-fit: cover;
@@ -227,7 +220,6 @@ export const CardPicture = ({
227220
alt,
228221
imageSize,
229222
loading,
230-
roundedCorners,
231223
isCircular,
232224
aspectRatio = '5:3',
233225
mobileAspectRatio,
@@ -251,7 +243,6 @@ export const CardPicture = ({
251243
decideAspectRatioStyles(aspectRatio),
252244
mobileAspectRatio &&
253245
decideMobileAspectRatioStyles(mobileAspectRatio),
254-
roundedCorners && borderRadius,
255246
isCircular && circularStyles,
256247
]}
257248
>

0 commit comments

Comments
 (0)