Skip to content

Commit 1ccba94

Browse files
JamieB-guJamieB-gu
authored
Remove data-print-layout from Section (#14240)
If the `data-print-layout` attribute is applied to an element and set to `'hide'`, the `print.css` stylesheet is used to target some styles that hide the element. However, this only works if the attribute is applied to an element in the DOM. If the attribute is instead applied as a prop to a component, and that component does not expect that prop and apply it in turn to an actual DOM element, then it's simply ignored. The `Section` component does not take this prop, therefore these usages of `data-print-layout` have no effect.
1 parent b27bedc commit 1ccba94

14 files changed

+2
-58
lines changed

‎dotcom-rendering/src/components/FrontsAdSlots.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,6 @@ export const MerchandisingSlot = ({
6464
renderAds && (
6565
<Section
6666
fullWidth={true}
67-
data-print-layout="hide"
6867
padSides={false}
6968
showTopBorder={false}
7069
showSideBorders={false}

‎dotcom-rendering/src/layouts/AllEditorialNewslettersPageLayout.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,6 @@ export const AllEditorialNewslettersPageLayout = ({
7171

7272
<Section
7373
fullWidth={true}
74-
data-print-layout="hide"
7574
padSides={false}
7675
backgroundColour={sourcePalette.brand[400]}
7776
borderColour={sourcePalette.brand[600]}

‎dotcom-rendering/src/layouts/AudioLayout.tsx

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -209,7 +209,6 @@ export const AudioLayout = (props: WebProps) => {
209209
<main data-layout="AudioLayout">
210210
<Section
211211
fullWidth={true}
212-
data-print-layout="hide"
213212
showTopBorder={false}
214213
backgroundColour={themePalette('--article-background')}
215214
borderColour={themePalette('--article-border')}
@@ -457,7 +456,6 @@ export const AudioLayout = (props: WebProps) => {
457456
{renderAds && !isLabs && (
458457
<Section
459458
fullWidth={true}
460-
data-print-layout="hide"
461459
padSides={false}
462460
showTopBorder={false}
463461
showSideBorders={false}
@@ -524,7 +522,6 @@ export const AudioLayout = (props: WebProps) => {
524522
<Section
525523
fullWidth={true}
526524
sectionId="comments"
527-
data-print-layout="hide"
528525
element="section"
529526
backgroundColour={themePalette(
530527
'--discussion-section-background',
@@ -556,7 +553,6 @@ export const AudioLayout = (props: WebProps) => {
556553
padContent={false}
557554
verticalMargins={false}
558555
element="aside"
559-
data-print-layout="hide"
560556
data-link-name="most-popular"
561557
data-component="most-popular"
562558
backgroundColour={themePalette(
@@ -582,7 +578,6 @@ export const AudioLayout = (props: WebProps) => {
582578
{renderAds && !isLabs && (
583579
<Section
584580
fullWidth={true}
585-
data-print-layout="hide"
586581
padSides={false}
587582
showTopBorder={false}
588583
showSideBorders={false}
@@ -599,12 +594,7 @@ export const AudioLayout = (props: WebProps) => {
599594

600595
<>
601596
{props.NAV.subNavSections && (
602-
<Section
603-
fullWidth={true}
604-
data-print-layout="hide"
605-
padSides={false}
606-
element="aside"
607-
>
597+
<Section fullWidth={true} padSides={false} element="aside">
608598
<Island
609599
priority="enhancement"
610600
defer={{ until: 'visible' }}
@@ -619,7 +609,6 @@ export const AudioLayout = (props: WebProps) => {
619609
)}
620610
<Section
621611
fullWidth={true}
622-
data-print-layout="hide"
623612
padSides={false}
624613
backgroundColour={sourcePalette.brand[400]}
625614
borderColour={sourcePalette.brand[600]}

‎dotcom-rendering/src/layouts/CommentLayout.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -795,7 +795,6 @@ export const CommentLayout = (props: WebProps | AppsProps) => {
795795
padContent={false}
796796
verticalMargins={false}
797797
element="aside"
798-
data-print-layout="hide"
799798
data-link-name="most-popular"
800799
data-component="most-popular"
801800
backgroundColour={themePalette(
@@ -901,7 +900,6 @@ export const CommentLayout = (props: WebProps | AppsProps) => {
901900
{isApps && (
902901
<Section
903902
fullWidth={true}
904-
data-print-layout="hide"
905903
backgroundColour={themePalette('--apps-footer-background')}
906904
borderColour={themePalette('--article-border')}
907905
padSides={false}

‎dotcom-rendering/src/layouts/FrontLayout.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -790,7 +790,6 @@ export const FrontLayout = ({ front, NAV }: Props) => {
790790
<Section
791791
fullWidth={true}
792792
showTopBorder={hasPageSkin}
793-
data-print-layout="hide"
794793
padSides={false}
795794
element="aside"
796795
backgroundColour={schemePalette(
@@ -810,7 +809,6 @@ export const FrontLayout = ({ front, NAV }: Props) => {
810809

811810
<Section
812811
fullWidth={true}
813-
data-print-layout="hide"
814812
padSides={false}
815813
backgroundColour={brandBackground.primary}
816814
borderColour={brandBorder.primary}

‎dotcom-rendering/src/layouts/ImmersiveLayout.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -872,7 +872,6 @@ export const ImmersiveLayout = (props: WebProps | AppProps) => {
872872
padContent={false}
873873
verticalMargins={false}
874874
element="aside"
875-
data-print-layout="hide"
876875
data-link-name="most-popular"
877876
data-component="most-popular"
878877
backgroundColour={themePalette(
@@ -980,7 +979,6 @@ export const ImmersiveLayout = (props: WebProps | AppProps) => {
980979
{isApps && (
981980
<Section
982981
fullWidth={true}
983-
data-print-layout="hide"
984982
backgroundColour={themePalette('--apps-footer-background')}
985983
borderColour={themePalette('--article-border')}
986984
padSides={false}

‎dotcom-rendering/src/layouts/InteractiveLayout.tsx

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -323,7 +323,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
323323
)}
324324
<Section
325325
fullWidth={true}
326-
data-print-layout="hide"
327326
showTopBorder={false}
328327
backgroundColour={themePalette('--article-background')}
329328
borderColour={themePalette('--article-border')}
@@ -624,7 +623,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
624623
{isWeb && renderAds && (
625624
<Section
626625
fullWidth={true}
627-
data-print-layout="hide"
628626
padSides={false}
629627
showTopBorder={false}
630628
showSideBorders={false}
@@ -693,7 +691,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
693691
<Section
694692
fullWidth={true}
695693
sectionId="comments"
696-
data-print-layout="hide"
697694
element="section"
698695
backgroundColour={themePalette(
699696
'--discussion-section-background',
@@ -725,7 +722,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
725722
padContent={false}
726723
verticalMargins={false}
727724
element="aside"
728-
data-print-layout="hide"
729725
data-link-name="most-popular"
730726
data-component="most-popular"
731727
backgroundColour={themePalette(
@@ -752,7 +748,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
752748
{isWeb && renderAds && (
753749
<Section
754750
fullWidth={true}
755-
data-print-layout="hide"
756751
padSides={false}
757752
showTopBorder={false}
758753
showSideBorders={false}
@@ -768,12 +763,7 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
768763
</main>
769764

770765
{isWeb && props.NAV.subNavSections && (
771-
<Section
772-
fullWidth={true}
773-
data-print-layout="hide"
774-
padSides={false}
775-
element="aside"
776-
>
766+
<Section fullWidth={true} padSides={false} element="aside">
777767
<Island priority="enhancement" defer={{ until: 'visible' }}>
778768
<SubNav
779769
subNavSections={props.NAV.subNavSections}
@@ -788,7 +778,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
788778
<>
789779
<Section
790780
fullWidth={true}
791-
data-print-layout="hide"
792781
padSides={false}
793782
backgroundColour={sourcePalette.brand[400]}
794783
borderColour={sourcePalette.brand[600]}
@@ -840,7 +829,6 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
840829
{isApps && (
841830
<Section
842831
fullWidth={true}
843-
data-print-layout="hide"
844832
backgroundColour={themePalette('--apps-footer-background')}
845833
borderColour={themePalette('--article-border')}
846834
padSides={false}

‎dotcom-rendering/src/layouts/LiveLayout.tsx

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -342,7 +342,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
342342
<Hide from="tablet">
343343
<Section
344344
fullWidth={true}
345-
data-print-layout="hide"
346345
padSides={false}
347346
showTopBorder={false}
348347
showSideBorders={false}
@@ -941,7 +940,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
941940
{isWeb && renderAds && (
942941
<Section
943942
fullWidth={true}
944-
data-print-layout="hide"
945943
padSides={false}
946944
showTopBorder={true}
947945
showSideBorders={false}
@@ -1016,7 +1014,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
10161014
fullWidth={true}
10171015
showTopBorder={false}
10181016
sectionId="comments"
1019-
data-print-layout="hide"
10201017
element="section"
10211018
backgroundColour={themePalette(
10221019
'--discussion-section-background',
@@ -1051,7 +1048,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
10511048
padContent={false}
10521049
verticalMargins={false}
10531050
element="aside"
1054-
data-print-layout="hide"
10551051
data-link-name="most-popular"
10561052
data-component="most-popular"
10571053
leftColSize="wide"
@@ -1081,7 +1077,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
10811077
{isWeb && renderAds && (
10821078
<Section
10831079
fullWidth={true}
1084-
data-print-layout="hide"
10851080
padSides={false}
10861081
showTopBorder={false}
10871082
showSideBorders={false}
@@ -1102,7 +1097,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
11021097
{props.NAV.subNavSections && (
11031098
<Section
11041099
fullWidth={true}
1105-
data-print-layout="hide"
11061100
padSides={false}
11071101
element="aside"
11081102
>
@@ -1121,7 +1115,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
11211115

11221116
<Section
11231117
fullWidth={true}
1124-
data-print-layout="hide"
11251118
padSides={false}
11261119
backgroundColour={sourcePalette.brand[400]}
11271120
borderColour={sourcePalette.brand[600]}
@@ -1174,7 +1167,6 @@ export const LiveLayout = (props: WebProps | AppsProps) => {
11741167
{isApps && (
11751168
<Section
11761169
fullWidth={true}
1177-
data-print-layout="hide"
11781170
backgroundColour={themePalette('--apps-footer-background')}
11791171
borderColour={themePalette('--article-border')}
11801172
padSides={false}

‎dotcom-rendering/src/layouts/NewsletterSignupLayout.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -467,7 +467,6 @@ export const NewsletterSignupLayout = ({
467467

468468
<Section
469469
fullWidth={true}
470-
data-print-layout="hide"
471470
padSides={false}
472471
showTopBorder={false}
473472
backgroundColour={sourcePalette.brand[400]}

‎dotcom-rendering/src/layouts/PictureLayout.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -658,7 +658,6 @@ export const PictureLayout = (props: WebProps | AppsProps) => {
658658
padContent={false}
659659
verticalMargins={false}
660660
element="aside"
661-
data-print-layout="hide"
662661
data-link-name="most-popular"
663662
data-component="most-popular"
664663
backgroundColour={themePalette(
@@ -765,7 +764,6 @@ export const PictureLayout = (props: WebProps | AppsProps) => {
765764
{isApps && (
766765
<Section
767766
fullWidth={true}
768-
data-print-layout="hide"
769767
backgroundColour={themePalette('--apps-footer-background')}
770768
borderColour={themePalette('--article-border')}
771769
padSides={false}

0 commit comments

Comments
 (0)