Skip to content

Redesign cards block: large, no-image, sliding, and itinerary variants#19

Merged
lamontacrook merged 2 commits into
mainfrom
cards-block-redesign
Jul 17, 2026
Merged

Redesign cards block: large, no-image, sliding, and itinerary variants#19
lamontacrook merged 2 commits into
mainfrom
cards-block-redesign

Conversation

@lamontacrook

Copy link
Copy Markdown
Contributor

Summary

  • .cards.large: white promo cards with a wordmark image, left-aligned copy, and an orange pill CTA (Featured Cruise Offers)
  • .cards (no modifier): dark navy promo panels with a serif heading, centered copy, and a white pill CTA (Give $50/Get in the know style content)
  • .cards.sliding: horizontally-scrolling carousel of image-overlay teaser cards with prev/next arrow controls, matching the hollandamerica.com "Onboard Experience" pattern
  • .cards.itinerary (new): white route-map result cards with a title, "Ship: X" meta, and an orange CTA, matching the hollandamerica.com "Find a Cruise" result card pattern
  • Shared card image aspect-ratio now defaults to portrait (389:533); images whose alt text ends in "route map" keep their native landscape ratio instead of being cropped
  • Removed the global 1200px max-width cap on section content so blocks can render full-bleed

Test plan

🤖 Generated with Claude Code

- .cards.large: white promo cards with wordmark image, left-aligned copy, orange pill CTA
- .cards (no images): dark navy promo panels with serif heading, centered copy, white pill CTA
- .cards.sliding: horizontally scrolling image-overlay teaser carousel with prev/next arrows
- .cards.itinerary: white route-map result cards with title, ship meta and orange CTA
- Shared image aspect-ratio defaults to portrait (389:533), with route-map diagrams
  (alt text ending in "route map") kept at their native landscape ratio
- Full-bleed section width (removed global 1200px max-width cap)

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@aem-code-sync

aem-code-sync Bot commented Jul 16, 2026

Copy link
Copy Markdown

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

  • Re-run all PSI checks
  • Re-run failed PSI checks
  • Re-sync branch
Commits

@aem-code-sync

aem-code-sync Bot commented Jul 16, 2026

Copy link
Copy Markdown
Page Scores Audits Google
📱 /docs/library/blocks/cards PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
🖥️ /docs/library/blocks/cards PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
📱 /en/us PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
🖥️ /en/us PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@lamontacrook
lamontacrook merged commit 826531e into main Jul 17, 2026
1 of 2 checks passed
@lamontacrook
lamontacrook deleted the cards-block-redesign branch July 17, 2026 16:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant