RegistrationModal

The RegistrationModal component renders the event registration dialog used by the Triennial Gathering 2026 pages. It is built on the shared Modal component and contains three Stripe purchase links.

Overview

Type: Content component
Category: Event registration
Complexity: Simple
File: src/components/RegistrationModal.astro
Base component: Modal

Features

Consistent modal shell - Reuses the shared Modal UI and behavior
Three registration tiers - Members, non-members, and speakers
External checkout - Stripe links open in a new tab

Props

This component has no props. All copy and URLs are defined directly in the component.

Usage

Import the component where you need the modal:

---
import RegistrationModal from '@/components/RegistrationModal.astro';
---

Render the modal once per page (usually near the end of the layout):
```
<RegistrationModal />
```

Trigger it with a button wired to the shared modal API:

<button data-modal-trigger="registration-modal">Register now</button>

Updating registration links

Update the href values inside RegistrationModal.astro when Stripe links change:

<a href="https://buy.stripe.com/...">Registered Members</a>
<a href="https://buy.stripe.com/...">Non-Members</a>
<a href="https://buy.stripe.com/...">Speakers</a>

Modal - Base modal shell
EventHeaderSection - Includes the trigger wiring

Source code

View the complete implementation:

https://github.com/poncardasm/finan-website/blob/main/src/components/RegistrationModal.astro