mozilla / bedrock

Making mozilla.org awesome, one pebble at a time
https://www.mozilla.org
Mozilla Public License 2.0
1.18k stars 919 forks source link

Refresh: Gallery updates #15481

Open stephaniehobson opened 1 week ago

stephaniehobson commented 1 week ago

We're calling the black section about AI on the homepage and the white news section on the about page a "gallery" component.

The homepage gallery needs to be updated with the most recent copy, images, and design.

Both instances of the component need to have the design for their their mobile display updated. For now please use the mobile version of the component shown on the about page. This swaps to a 3:2 ratio image and vertically stacks. (The mobile carousel for the AI section will be addressed in a separate issue).

alexgibson commented 1 week ago

@stephaniehobson do we have a link to the most recent design/copy/images for both of these components (on both desktop and mobile)? I'm a bit lost in all the multiple versions in Figma, which makes it not so clear to figure out what needs doing here. Thanks

stephaniehobson commented 1 week ago

AI Gallery (Homepage, desktop)). AI Gallery (Homepage, mobile).

News Gallery (About, desktop). News Gallery (About, mobile).

You'll see the carousel design in the mobile version of the AI Gallery but that's a stretch goal. You can take it on as part of this issue or not, up to you. My thinking was that we would have all gallery have the stacking behaviour on mobile and then use the carousel as an optional progressive enhancement. But, once you're into code do what makes the most sense.