Add disclaimer to both Web and App gallery articles

Also fix paddings for gallery image and caption

Author: marjisound

dotcom-rendering/src/components/GalleryCaption.tsx

@@ -21,6 +21,7 @@ const styles = css`
 	color: ${palette('--caption-text')};
 	${textSans12}
 	padding-bottom: ${space[6]}px;
+	padding-top: ${space[5]}px;
 
 	${between.tablet.and.desktop} {
 		padding-left: ${space[5]}px;
@@ -89,14 +90,20 @@ export const GalleryCaption = ({
 					{credit}
 				</small>
 			)}
-			<Island priority="feature" defer={{ until: 'visible' }}>
-				<ShareButton
-					format={format}
-					pageId={pageId}
-					webTitle={webTitle}
-					context="ImageCaption"
-				/>
-			</Island>
+			<div
+				css={css`
+					padding-top: ${space[2]}px;
+				`}
+			>
+				<Island priority="feature" defer={{ until: 'visible' }}>
+					<ShareButton
+						format={format}
+						pageId={pageId}
+						webTitle={webTitle}
+						context="ImageCaption"
+					/>
+				</Island>
+			</div>
 		</figcaption>
 	);
 };

dotcom-rendering/src/layouts/GalleryLayout.tsx

@@ -144,8 +144,8 @@ export const GalleryLayout = (props: WebProps | AppProps) => {
 						format={format}
 						isMainMedia={true}
 					/>
-					{isWeb ? (
-						<div css={webMetaAndDisclaimerContainer}>
+					<div css={webMetaAndDisclaimerContainer}>
+						{isWeb ? (
 							<ArticleMeta
 								branding={
 									frontendData.commercialProperties[
@@ -169,36 +169,36 @@ export const GalleryLayout = (props: WebProps | AppProps) => {
 								}
 								shortUrlId={frontendData.config.shortUrlId}
 							/>
-							{!!frontendData.affiliateLinksDisclaimer && (
-								<GalleryAffiliateDisclaimer />
-							)}
-						</div>
-					) : null}
+						) : null}
 
-					{isApps ? (
-						<ArticleMetaApps
-							branding={
-								frontendData.commercialProperties[
-									frontendData.editionId
-								].branding
-							}
-							format={format}
-							pageId={frontendData.pageId}
-							byline={frontendData.byline}
-							tags={frontendData.tags}
-							primaryDateline={
-								frontendData.webPublicationDateDisplay
-							}
-							secondaryDateline={
-								frontendData.webPublicationSecondaryDateDisplay
-							}
-							isCommentable={frontendData.isCommentable}
-							discussionApiUrl={
-								frontendData.config.discussionApiUrl
-							}
-							shortUrlId={frontendData.config.shortUrlId}
-						/>
-					) : null}
+						{isApps ? (
+							<ArticleMetaApps
+								branding={
+									frontendData.commercialProperties[
+										frontendData.editionId
+									].branding
+								}
+								format={format}
+								pageId={frontendData.pageId}
+								byline={frontendData.byline}
+								tags={frontendData.tags}
+								primaryDateline={
+									frontendData.webPublicationDateDisplay
+								}
+								secondaryDateline={
+									frontendData.webPublicationSecondaryDateDisplay
+								}
+								isCommentable={frontendData.isCommentable}
+								discussionApiUrl={
+									frontendData.config.discussionApiUrl
+								}
+								shortUrlId={frontendData.config.shortUrlId}
+							/>
+						) : null}
+						{!!frontendData.affiliateLinksDisclaimer && (
+							<GalleryAffiliateDisclaimer />
+						)}
+					</div>
 				</header>
 				{gallery.images.map((element, idx) => (
 					<GalleryImage