CONTACT FORMS THAT WORK

<!-- Add this where you want the form -->
<div id="od-contact-YOUR-WIDGET-ID"></div>

<!-- Add script before closing body -->
<script src="https://onedollar.dev/contact/YOUR-WIDGET-ID/widget.js"></script>

// Configure in your dashboard:
// 
// Form Fields:
// - Name (required/optional)
// - Email (always required)
// - Phone (optional)
// - Company (optional)
// - Message (required)
// - Custom fields
// 
// Messages:
// - Form title
// - Submit button text
// - Success message
// - Error messages
// 
// Styling:
// - Brand color
// - Border style
// - Field layout

<!-- Responsive wrapper -->
<div class="contact-wrapper">
  <div id="od-contact-YOUR-WIDGET-ID"></div>
</div>

<style>
.contact-wrapper {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
}

@media (max-width: 640px) {
  .contact-wrapper {
    padding: 10px;
  }
}
</style>

// Set in dashboard - examples:

// Phone validation
{
  "type": "tel",
  "pattern": "[0-9]{3}-[0-9]{3}-[0-9]{4}",
  "placeholder": "123-456-7890"
}

// Message length
{
  "type": "textarea",
  "minlength": 10,
  "maxlength": 500,
  "required": true
}

// Custom field
{
  "label": "Budget",
  "type": "select",
  "options": ["<$1k", "$1-5k", "$5k+"],
  "required": false
}

// Get all contact entries (requires API key)
GET https://onedollar.dev/api/v1/widgets/YOUR-WIDGET-KEY/entries
Authorization: Bearer YOUR-API-KEY

// Get single contact entry (requires API key)
GET https://onedollar.dev/api/v1/widgets/YOUR-WIDGET-KEY/entries/:id
Authorization: Bearer YOUR-API-KEY

// Submit contact form (public, no auth required)
POST https://onedollar.dev/api/v1/widgets/YOUR-WIDGET-KEY/submit
Content-Type: application/json
{
  "name": "John Doe",
  "email": "john@example.com",
  "message": "I need help with..."
}