Skip to content

[SR] - [MWPW-192883] - Rich Content Hero Jump Variant#5932

Open
DKos95 wants to merge 5 commits into
site-redesign-foundationfrom
rich-content-hero
Open

[SR] - [MWPW-192883] - Rich Content Hero Jump Variant#5932
DKos95 wants to merge 5 commits into
site-redesign-foundationfrom
rich-content-hero

Conversation

…oor animation

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@aem-code-sync
Copy link
Copy Markdown
Contributor

aem-code-sync Bot commented May 13, 2026

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-sync branch
Commits

@aem-code-sync aem-code-sync Bot temporarily deployed to rich-content-hero May 13, 2026 15:25 Inactive
@DKos95 DKos95 changed the title [MWPW-192883] - Rich Content Hero [SR] - [MWPW-192883] - Rich Content Hero May 13, 2026
@DKos95 DKos95 changed the title [SR] - [MWPW-192883] - Rich Content Hero [SR] - [MWPW-192883] - Rich Content Hero Jump Variant May 13, 2026

.title-2,
.eyebrow {
max-width: 656px;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Is this meant to be fixed or does it map to a specific number of columns?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Not sure, what do you think?

Viewport Content width Max-width Approx columns
768px+ 768 − 64 = 704px 530px 530/704 ≈ 9/12
1024px+ 1024 − 80 = 944px 656px 656/944 ≈ 8.3/12
1440px+ 1440 − 80 = 1360px 656px 656/1360 ≈ 5.8/12

Comment on lines +190 to +194
background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 39%, rgba(0, 0, 0, 0) 74%, rgba(0, 0, 0, 0.8) 100%);
}

.section:not(.has-background):has(.rich-content.jump-link.hero) {
background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 39%, rgba(0, 0, 0, 0) 74%, rgba(0, 0, 0, 0.8) 100%), var(--s2a-color-background-default);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Having specific colors in code might not be a good strategy for the long term. Can authoring be leveraged in any way here?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

We can but this is just to override the wave 1 linear background being applied also via code, if we changed it here it would make sense to change it for the wave 1 code and make it authorable, not sure if we should invest time into that currently, but I do agree we should do it at one point.

Comment thread libs/mep/ace1205/rich-content/rich-content.css Outdated
Comment thread libs/mep/ace1205/rich-content/rich-content.css Outdated
@aem-code-sync aem-code-sync Bot temporarily deployed to rich-content-hero May 20, 2026 15:42 Inactive
@aem-code-sync aem-code-sync Bot temporarily deployed to rich-content-hero May 20, 2026 15:42 Inactive
Comment thread libs/c2/styles/styles.css
animation-composition: replace, add;
}

@keyframes dg-top-door {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

dg = double garage door?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Correct


picture,
img {
width: 24px;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

here we should be able to use tokens

&::after {
content: '';
display: block;
width: 12px;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

tokens ?

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.

5 participants