AWS Partner Page Uplift — Design Spec

Date: 2026-04-20 Status: Draft for review Owner: Arthur Marinis

Context

The AWS partner page at /partners/partner-pages/aws.html (source: partners/partner-pages/aws.html.haml) still uses the pre-modernisation site template: inline-styled <table> stats, .sidebar-accordion blocks, modal pop-outs for full quotes and architecture diagrams, and a 2/3 + 1/3 .grid-2-1-column layout driven by .container.partner-page. The rest of the site (devops, cloudmanagement, platform-engineering, infrastructure-lens, security, and the in-progress AI section) has moved to the service-modern template: a full-width banner hero with scrim, an intro .container.inner with CTA, a .svc-what-you-get card grid, and alternating full-width sections.

The AWS copy itself is still relevant; the structural treatment is what reads dated.

Goals

  1. Re-lay the AWS partner page onto the service-modern template so it matches devops, cloudmanagement, and the rest of the service/partner surface.
  2. Preserve every block of existing copy verbatim (Stefan Jansen quote, migration counts, list of firsts, Lambda/Docker columns, video embeds, case study links).
  3. Drop the accordion + modal interaction patterns in favour of inline sections.
  4. Keep the existing URL /partners/partner-pages/aws.html and source filename.
  5. Keep the partner summary card (partners/partner/amazonwebservices.html.haml) pointing to the same URL; no content change there.

Non-Goals

Page Structure

Sections run top to bottom as full-width blocks, alternating surface and alt backgrounds following the service-modern pattern.

# Block Source (current page) New treatment
1 Hero banner banner, banner_title, banner_sub frontmatter Unchanged. Renders via base layout + .banner.inner.
2 Intro + CTA Opening H2 "Deep AWS Knowledge = Customer Success" .container.inner with H2 + centred paragraph + "Talk to Us" primary CTA anchoring to #contact.
3 Stats row <table> with 300+ migrations, 96% retention, 1000+ envs .svc-what-you-get / .svc-wyg-grid of three .svc-wyg-card entries (bg-blue, bg-green, bg-blue), each with SVG icon + H4 + supporting sentence.
4 Narrative + Stefan Jansen quote Left-column "In 2006 we saw the revolution…" + extended quote modal .container.inner with H2 + two short paragraphs. Pull-quote rendered inline using a new .svc-pull-quote block (cite + attribution). Full quote collapses into a <details><summary>Read full quote</summary> reveal directly under the pull-quote; modal removed.
5 Partner firsts + certifications #partner-ticks list .container.inner.alt with H2 "Experienced AWS Specialist" + a grid of labelled year cards (one per first). Two sub-groups follow: APN Cloud Ambassadors and AWS Certified Professionals, rendered as .svc-deliverables / .svc-del-group to mirror the cloudmanagement deliverables block.
6 Risk / scalability narrative "Balancing Opportunity vs Risk" + "Partner with us" + "Continuous improvement" One .container.inner with H2 "Balancing opportunity vs risk. Scalability vs cost." followed by the three narrative paragraphs. Separated by <hr class="svc-divider"> where the copy currently breaks.
7 Cloud architecture changing #cloud-architecture-changing + Lambda + Docker two-column .container.inner.alt with H2 retained. Two-column grid becomes .svc-two-column with the existing Lambda and Docker logo images kept.
8 Customer stories + videos Sidebar accordions (Urbanise case study video, "See How We Utilise AWS" videos, architecture diagram modal) .container.inner with H2 "Our AWS success stories". .svc-video-grid of four tiles: Urbanise case study, Aaron Walker's AWS Summit CI/CD talk, serverless on AWS, Docker on AWS. Customer logos (carsales, iconic, dubber) in a .svc-logo-row under the grid with "More Customer Stories" link. The architecture diagram is a fifth tile in the same grid styled as an image preview that opens /images/webp/partners/aws-design_.webp in a new tab (no modal).
9 Contact partial("contact_forms/inbuilt_contact_form.html.haml") Unchanged. Anchor target #contact for the hero CTA.

Content Preservation Rules

SCSS Plan

A page-scoped partial scss/site/_partners-aws.scss holds new blocks that don't already exist in _service-modern.scss:

All existing _service-modern.scss classes (.banner.inner, .container.inner, .svc-what-you-get, .svc-wyg-grid, .svc-wyg-card, .svc-deliverables, .svc-del-group) are reused as-is. No typography overrides.

The partial imports into scss/styles.scss after _service-modern so the cascade order is deterministic. File is ASCII-only (no em-dash/smart quotes) per the Sass 3.4.22 constraint.

HAML Plan

partners/partner-pages/aws.html.haml is rewritten top-to-bottom:

Component Mapping Cheat-Sheet

Old markup New markup
.grid-2-1-column + .two-of-three-column-layout / .one-of-three-column-layout #content.page + sequential .container.inner sections (full width, alternating)
%h2.section-title with %span.de-em .container.inner > h2 (no de-em pattern — service-modern heading style)
<table> stats .svc-wyg-grid of three .svc-wyg-card
#partner-ticks ul .svc-year-grid of .svc-year-card entries
.sidebar-accordion.active + .accordion-title + .accordion-content Inline .container.inner with H2 + content
.modal + %a[rel=modal:open] Direct link or inline <details> (for long quote)
.video-link wrapping YouTube mqdefault.jpg Same .video-link anchor, re-styled by .svc-video-grid
.partners-page-logos ul .svc-logo-row

Dependencies and Risks

Success Criteria

  1. /partners/partner-pages/aws.html renders with the same visual language as /cloudmanagement/ and /devops/: banner, CTA, card grid, alternating sections, no sidebar.
  2. Every block of copy present on the current page is present on the new page, either verbatim or with only heading-level adjustments.
  3. No <table>, no .sidebar-accordion, no #fullquote/#aws-architecture/#modalone-three modals in the output HTML.
  4. No inline style= attributes on the HAML (other than any that inbuilt_contact_form.html.haml brings in).
  5. SCSS builds without warnings on Sass 3.4.22. No non-ASCII characters in new SCSS.
  6. Links to all five videos and the architecture diagram still resolve.
  7. Page is responsive at 390px, 768px, and 1280px — banner scrim engages on mobile (inherited from _service-modern.scss).

Out of Scope / Follow-Ups