feat: #3613864 Feed the Home page sections from views instead of hand-placed cards

Issue: https://www.drupal.org/project/horizonaid/issues/3613864

The Home page placed its country cards and its update cards as Canvas component trees, so the site template shipped a homepage that does not change when the site's content does, and five of its links pointed at the removed /program-page stand-in.

The Where We Work section was unstyled on top of that: the slider's CSS targets its direct > .card-country children and the view rendered card-overlay, so the cards collapsed to 11x7px.

What this changes

  • content/canvas_page/01-home.yml — the country-slider and impressed-card-slider component trees become block.views_block.countries-latest and block.views_block.blog-latest; the events section becomes a single 100 column; five /program-page links now point at the real /programs/<slug> aliases.
  • config/views.view.countries.yml — the latest display renders through components_views_style on vartheme_bs5:country-slider with rows_slot: cards, and its rows use the card view mode.
  • config/canvas.content_template.node.country.card.yml — that card view mode renders card-country, so the slider's own CSS sizes it.
  • config/canvas.component.sdc.vartheme_bs5_horizonaid.card-country.yml — new. Canvas only generates a component's config once a recipe has finished applying, so the content template above had nothing to bind to until this was exported from a live install.
  • recipe.yml — the views.view.blog action gains the same treatment for the Latest Updates slider, followed by setViewsComponentStyleTheme.

Verified

As an anonymous visitor at 1440x900 with the cache busted:

  • three views containers on Home: view-id-countries, view-id-events, view-id-blog
  • country cards measure 300x420; minimum card width 300px across eleven cards
  • no broken images, no broken links, no stand-in paths in the markup
  • the recipe log reports Pointed 3 view components in views.view.countries at the vartheme_bs5_horizonaid theme.

Every value mapped through components_views_style was checked against its component's own contract first — heading_level must be an integer, cta_target must be one of default / _self / _blank, and container_type one of container / container-fluid / none.

AI-Generated: Yes

Checkpoints

  • File an issue about this project
  • Addition/Change/Update/Fix to this project
  • Testing to ensure no regression
  • Automated unit/functional testing coverage
  • Developer Documentation support on feature change/addition
  • User Guide Documentation support on feature change/addition
  • UX/UI designer responsibilities
  • Accessibility and Readability
  • Reviewed by a human
  • Code review by maintainers
  • Full testing and approval
  • Credit contributors
  • Review with the product owner
  • Update Release Notes
  • Release
Edited by Rajab Natshah

Merge request reports

Loading
Loading