Skip to content

Commit

Permalink
Revert "Add play icon to feature card if can play inline"
Browse files Browse the repository at this point in the history
This reverts commit 4a12e03.
domlander committed Jan 30, 2025

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
1 parent edaa18f commit 73e1125
Showing 2 changed files with 2 additions and 38 deletions.
28 changes: 2 additions & 26 deletions dotcom-rendering/src/components/FeatureCard.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { css } from '@emotion/react';
import { space } from '@guardian/source/foundations';
import { Link } from '@guardian/source/react-components';
import { SvgMediaControlsPlay } from '../components/SvgMediaControlsPlay';
import { Link, SvgMediaControlsPlay } from '@guardian/source/react-components';
import { ArticleDesign, type ArticleFormat } from '../lib/articleFormat';
import { isWithinTwelveHours, secondsToDuration } from '../lib/formatTime';
import { getZIndex } from '../lib/getZIndex';
@@ -189,24 +188,6 @@ const trailTextWrapper = css`
margin-top: ${space[3]}px;
`;

const playIconWidth = 56;
const playIconStyles = css`
position: absolute;
/**
* Subject to change. We will wait to see how fronts editors use the
* headlines and standfirsts before we decide on a final position.
*/
top: 35%;
left: calc(50% - ${playIconWidth / 2}px);
width: ${playIconWidth}px;
height: ${playIconWidth}px;
background-color: ${palette('--feature-card-play-icon-background')};
opacity: 0.7;
border-radius: 50%;
border: 1px solid ${palette('--feature-card-play-icon-border')};
fill: ${palette('--feature-card-play-icon-fill')};
`;

const videoPillStyles = css`
position: absolute;
top: ${space[2]}px;
@@ -572,13 +553,8 @@ export const FeatureCard = ({
/>
</div>
</div>
{canPlayInline && isVideoMainMedia && (
<div css={playIconStyles}>
<SvgMediaControlsPlay />
</div>
)}
{/* On video article cards, the duration is displayed in the footer */}
{isVideoArticle &&
{!isVideoArticle &&
isVideoMainMedia &&
videoDuration !== undefined ? (
<div css={videoPillStyles}>
12 changes: 0 additions & 12 deletions dotcom-rendering/src/paletteDeclarations.ts
Original file line number Diff line number Diff line change
@@ -6462,18 +6462,6 @@ const paletteColours = {
light: featureCardKickerTextLight,
dark: () => sourcePalette.neutral[20],
},
'--feature-card-play-icon-background': {
light: () => sourcePalette.neutral[7],
dark: () => sourcePalette.neutral[7],
},
'--feature-card-play-icon-border': {
light: () => sourcePalette.neutral[60],
dark: () => sourcePalette.neutral[60],
},
'--feature-card-play-icon-fill': {
light: () => sourcePalette.neutral[100],
dark: () => sourcePalette.neutral[100],
},
'--feature-card-trail-text': {
light: () => sourcePalette.neutral[86],
dark: () => sourcePalette.neutral[20],

0 comments on commit 73e1125

Please sign in to comment.