Skip to content

Container level paid for by and logo #14580

Merged
deedeeh merged 8 commits intomainfrom
dina/container-level-paid-for-labs-redesign
Sep 30, 2025
Merged

Container level paid for by and logo #14580
deedeeh merged 8 commits intomainfrom
dina/container-level-paid-for-labs-redesign

Conversation

@deedeeh
Copy link
Contributor

@deedeeh deedeeh commented Sep 29, 2025

What does this change?

This PR is part of a sequence for Labs container redesign. This particular work uses the new component SponsoredContentLabel #14549 in the FrontSection to display the badge in the container level in the scenario of 1 brand for all stories.

The existing Guardian Labs story already reflects the new change in Storybook so I didn't need to create a new story.

Note: I updated the Labs container header styles to align the bottom of the header with the bottom of the badge and it works perfectly in the scenario of 1 brand for all stories. When I check it for multiple brands, which is still upcoming work, they don't align due to the different padding-bottom for the content which is 40px and the header which is 36px which is a small difference but still needs to be fixed. We want the padding-bottom to correspond to different scenarios and container types as some might have different padding-bottom compared to others.

Why?

Labs redesign.

Screenshots

Before After
before after
before2 after2
before3 after3

Snapshots from CODE for different containers with single badge

image image

@github-actions
Copy link

github-actions bot commented Sep 29, 2025

@github-actions
Copy link

github-actions bot commented Sep 29, 2025

@deedeeh deedeeh marked this pull request as ready for review September 29, 2025 17:03
@github-actions
Copy link

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.

@deedeeh deedeeh requested a review from a team September 29, 2025 17:04
@deedeeh deedeeh requested a review from cemms1 September 30, 2025 10:17
Copy link
Contributor

@cemms1 cemms1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks fantastic 👏

@deedeeh deedeeh added the run_chromatic Runs chromatic when label is applied label Sep 30, 2025
@github-actions github-actions bot removed the run_chromatic Runs chromatic when label is applied label Sep 30, 2025
@deedeeh deedeeh merged commit ac90d1e into main Sep 30, 2025
31 checks passed
@deedeeh deedeeh deleted the dina/container-level-paid-for-labs-redesign branch September 30, 2025 14:19
@gu-prout
Copy link

gu-prout bot commented Sep 30, 2025

Seen on PROD (merged by @deedeeh 7 minutes and 50 seconds ago) Please check your changes!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants