Move PictureLayout to grid

[frederickobrien]

Continuing on my grid rampage of #1542, #16119, and #16133 this absorbs PictureLayout into the new grid system for content pages. This one's a smidge more involved due to the avatar pics that sometimes render (though cracking that here paves the way for CommentLayout to move over too).

Screenshots

Before	After

[github-actions]

Deploy build 29566 of dotcom:rendering-all to CODE

All deployment options

• Deploy build 29566 of dotcom:rendering-all to CODE
• Deploy parts of build 29566 to CODE by previewing it first
• What's on CODE right now?

---

From guardian/actions-riff-raff.

[github-actions]

Hello 👋! When you're ready to run Chromatic, please apply the run_chromatic label to this PR.

You will need to reapply the label each time you want to run Chromatic.

Click here to see the Chromatic project.

[github-actions]

Deploy build 2374 of dotcom:ab-testing to CODE

All deployment options

• Deploy build 2374 of dotcom:ab-testing to CODE
• Deploy parts of build 2374 to CODE by previewing it first
• What's on CODE right now?

---

From guardian/actions-riff-raff.

[JamieB-gu]

Overall approach looks good. Comments mostly about application of CSS and the grid rules.

[JamieB-gu]

I think you're asking this element to span both columns here, then on the element inside it you're setting a max-width to ensure it's essentially the same width as the centre column? Would it be easier to just set grid.column.centre here (which I think is the default) and remove that max-width, or am I missing something about the design?

[frederickobrien]

It's my attempt to handle the existing appearance where the grid section as a whole spans all the way to the end of the right column, but the headline itself doesn't. E.g.

[JamieB-gu]

I've made some comments about how you probably don't need to repeat certain rules at later breakpoints because earlier ones still apply. But you're doing this a lot here so I'm wondering if there's a reason that I'm missing? If so, please ignore most of those comments!

[akash1810]

Please rebase this branch against main before deploying to CODE. #16321 made some changes to CI and infrastructure. Deploying this branch without these changes present will either:

• Fail when using Riff-Raff's default update strategy
• OR delete the new infrastructure if using Riff-Raff's "dangerous" mode

Please rebase this branch against main before deploying to CODE.