Merge pull request #14703 from guardian/doml/remove-whole-picture-us

Remove Whole Picture logo

Author: domlander

dotcom-rendering/src/components/Masthead/Masthead.stories.tsx

@@ -50,30 +50,3 @@ export const WithPageSkin = {
 export const WithPageSkinAndContentSelfContstrain = {
 	args: { hasPageSkinContentSelfConstrain: true },
 };
-
-export const WithUsLogoAndWithoutSubnav = {
-	args: { wholePictureLogoSwitch: true, editionId: 'US' },
-};
-
-export const WithUsLogoAndSubnav = {
-	args: { ...WithUsLogoAndWithoutSubnav.args, showSubNav: true },
-};
-
-export const WithUsLogoAndSlimNav = {
-	args: {
-		...WithUsLogoAndWithoutSubnav.args,
-		showSlimNav: true,
-		displayRoundel: true,
-	},
-};
-
-export const WithUsLogoAndPageSkin = {
-	args: { ...WithUsLogoAndWithoutSubnav.args, hasPageSkin: true },
-};
-
-export const WithUsLogoAndPageSkinAndContentSelfContstrain = {
-	args: {
-		...WithUsLogoAndWithoutSubnav.args,
-		hasPageSkinContentSelfConstrain: true,
-	},
-};

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

@@ -22,7 +22,6 @@ type Props = {
 	hasPageSkin?: boolean;
 	hasPageSkinContentSelfConstrain?: boolean;
 	pageId?: string;
-	wholePictureLogoSwitch?: boolean;
 };
 
 /**
@@ -57,7 +56,6 @@ export const Masthead = ({
 	hasPageSkin = false,
 	hasPageSkinContentSelfConstrain = false,
 	pageId,
-	wholePictureLogoSwitch = false,
 }: Props) => (
 	<header data-component="header">
 		<Section
@@ -114,7 +112,6 @@ export const Masthead = ({
 				showSlimNav={showSlimNav}
 				hasPageSkin={hasPageSkin}
 				pageId={pageId}
-				wholePictureLogoSwitch={wholePictureLogoSwitch}
 			/>
 		</Island>
 	</header>

dotcom-rendering/src/components/Masthead/Titlepiece/Logo.tsx

@@ -1,20 +1,10 @@
 import { css } from '@emotion/react';
 import { visuallyHidden } from '@guardian/source/foundations';
-import { Hide, SvgGuardianLogo } from '@guardian/source/react-components';
+import { SvgGuardianLogo } from '@guardian/source/react-components';
 import { nestedOphanComponents } from '../../../lib/ophan-helpers';
 import { palette } from '../../../palette';
-import TheWholePictureGuardianLogoSmall from '../../../static/icons/the-guardian-whole-picture-logo-small.svg';
-import TheWholePictureGuardianLogo from '../../../static/icons/the-guardian-whole-picture-logo.svg';
 
-type Props = {
-	/**
-	 * We are running a campaign in the US called "The Whole Picture"
-	 * We will use a different logo for the US edition for the duration of this campaign.
-	 */
-	showWholePictureLogo: boolean;
-};
-
-export const Logo = ({ showWholePictureLogo }: Props) => (
+export const Logo = () => (
 	<a href="/" data-link-name={nestedOphanComponents('header', 'logo')}>
 		<span
 			css={css`
@@ -23,18 +13,6 @@ export const Logo = ({ showWholePictureLogo }: Props) => (
 		>
 			The Guardian - Back to home
 		</span>
-
-		{showWholePictureLogo ? (
-			<>
-				<Hide from="tablet">
-					<TheWholePictureGuardianLogoSmall />
-				</Hide>
-				<Hide until="tablet">
-					<TheWholePictureGuardianLogo />
-				</Hide>
-			</>
-		) : (
-			<SvgGuardianLogo textColor={palette('--masthead-nav-link-text')} />
-		)}
+		<SvgGuardianLogo textColor={palette('--masthead-nav-link-text')} />
 	</a>
 );

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

@@ -33,7 +33,6 @@ interface Props {
 	showSlimNav?: boolean;
 	hasPageSkin?: boolean;
 	pageId?: string;
-	wholePictureLogoSwitch?: boolean;
 }
 
 const gridContent = css`
@@ -101,22 +100,6 @@ const logoStylesFromLeftCol = css`
 	}
 `;
 
-const theWholePictureStyles = css`
-	margin-bottom: 2px;
-	${from.tablet} {
-		margin-top: 10px;
-		margin-bottom: 6px;
-	}
-
-	svg {
-		height: auto;
-		width: 173px;
-		${from.tablet} {
-			width: 246px;
-		}
-	}
-`;
-
 const slimNavLogoOverrides = css`
 	position: relative;
 	margin-top: ${space[2]}px;
@@ -337,13 +320,9 @@ export const Titlepiece = ({
 	showSlimNav,
 	hasPageSkin,
 	pageId = '',
-	wholePictureLogoSwitch,
 }: Props) => {
 	const { showBanner } = useEditionSwitcherBanner(pageId, editionId);
 
-	const showWholePictureLogo =
-		!!wholePictureLogoSwitch && !showSlimNav && editionId === 'US';
-
 	return (
 		<Grid
 			type="nav"
@@ -527,10 +506,9 @@ export const Titlepiece = ({
 					logoStyles,
 					!hasPageSkin && logoStylesFromLeftCol,
 					showSlimNav && slimNavLogoOverrides,
-					showWholePictureLogo && theWholePictureStyles,
 				]}
 			>
-				<Logo showWholePictureLogo={showWholePictureLogo} />
+				<Logo />
 			</div>
 
 			{/** Expanded menu checkbox */}

dotcom-rendering/src/layouts/AllEditorialNewslettersPageLayout.tsx

@@ -44,7 +44,6 @@ export const AllEditorialNewslettersPageLayout = ({
 					showSlimNav={false}
 					hasPageSkin={false}
 					hasPageSkinContentSelfConstrain={false}
-					wholePictureLogoSwitch={config.switches.wholePictureLogo}
 				/>
 			</div>
 

dotcom-rendering/src/layouts/AudioLayout.tsx

@@ -184,9 +184,6 @@ export const AudioLayout = (props: WebProps) => {
 					showSlimNav={false}
 					hasPageSkinContentSelfConstrain={true}
 					pageId={article.pageId}
-					wholePictureLogoSwitch={
-						article.config.switches.wholePictureLogo
-					}
 				/>
 			</div>
 

dotcom-rendering/src/layouts/CommentLayout.tsx

@@ -335,9 +335,6 @@ export const CommentLayout = (props: WebProps | AppsProps) => {
 						hasPageSkin={false}
 						hasPageSkinContentSelfConstrain={false}
 						pageId={article.pageId}
-						wholePictureLogoSwitch={
-							article.config.switches.wholePictureLogo
-						}
 					/>
 				</div>
 			)}

dotcom-rendering/src/layouts/CrosswordLayout.tsx

@@ -157,9 +157,6 @@ export const CrosswordLayout = (props: Props) => {
 					hasPageSkin={false}
 					hasPageSkinContentSelfConstrain={false}
 					pageId={article.pageId}
-					wholePictureLogoSwitch={
-						article.config.switches.wholePictureLogo
-					}
 				/>
 			</div>
 

dotcom-rendering/src/layouts/FrontLayout.tsx

@@ -234,9 +234,6 @@ export const FrontLayout = ({ front, NAV }: Props) => {
 					hasPageSkin={hasPageSkin}
 					hasPageSkinContentSelfConstrain={true}
 					pageId={pageId}
-					wholePictureLogoSwitch={
-						front.config.switches.wholePictureLogo
-					}
 				/>
 
 				{isPaidContent && (

dotcom-rendering/src/layouts/FullPageInteractiveLayout.tsx

@@ -181,9 +181,6 @@ const NavHeader = ({ article, NAV, renderAds }: HeaderProps) => {
 				hasPageSkin={false}
 				hasPageSkinContentSelfConstrain={false}
 				pageId={article.pageId}
-				wholePictureLogoSwitch={
-					article.config.switches.wholePictureLogo
-				}
 			/>
 		</section>
 	);