Design System
Work in progress. I'm adding components as I go, following patterns from what's already documented. Nothing here is set in stone yet.
Contact
Contact form and CTA. The form itself is structural, but lives inside a themed section.
Contact
Organism
Full contact section combining description text and an interactive form (SolidJS).
Structure
<section id="contact">Main container with animation attribute<h2>Section title.contact-contentFlexbox container.contact-descriptionLeft column with intro text<ContactForm />SolidJS form componentContactForm
Organism
Interactive contact form powered by SolidJS and Modular Forms.
Preview
Demo mode — form submission is disabled.
Props
| Prop | Type | Description |
|---|---|---|
accessToken | string | Web3Forms API access key |
FloatingContact
Organism
Mobile-only sticky contact button that appears at the bottom of the screen. Auto-hides when the contact section is visible.
Behavior
| Condition | State | CSS |
|---|---|---|
| Desktop (>600px) | Hidden | display: none |
| Mobile, #contact not visible | Visible | Default styles |
| Mobile, #contact in viewport | Hidden | .current class added |