Content Detail Pop-ups

[ashleyshaw]

Content Detail Pop-ups

Parent Epic: Modal & Popup Enhancements

Certain content on Tours, Destinations, and Accommodations pages is better displayed in a modal instead of inline. Examples:

• Accommodation details linked from itinerary sections.
• Destination information popups.
• Maps, galleries, or additional text blocks.

The goal is to create a smooth user experience without navigating away from the current page.

Scope

• Enable modal triggers from text links, buttons, or images.
• Load content dynamically into modals using template parts or block content.
• Ensure all modals use the central modal system.
• Apply consistent styles per LSX Design System.
• Maintain accessibility:
  • Focus trap
  • ARIA labels
  • Screen reader compatibility

Acceptance Criteria

• Clicking “View More” or similar opens content in a modal.
• No duplicate modal logic – uses central modal overlay.
• Modals work on all single post types (Tours, Destinations, Accommodation).
• Fully accessible:
  • Keyboard operable
  • Proper ARIA attributes

References

• Related issue: Issue #362
• Human Made popup repo: https://github.com/humanmade/hm-block-modal
• Figma prototype: https://www.figma.com/community/file/1397897183253228355/lsx-tour-operator-design-system

[krugazul]

This work is complete, we can currently set the destinations, accommodation and tours to display their modal counterparts which are fully editable with all the TO blocks.