Enhance contact CTA prominence and copy clarity

This commit is contained in:
nmemmert
2026-04-12 13:22:19 -04:00
parent 738cc2a412
commit dcfce9dc24
2 changed files with 73 additions and 5 deletions
+53 -5
View File
@@ -1,5 +1,5 @@
import { useState, useEffect } from 'react'
import { Routes, Route, useNavigate } from 'react-router-dom'
import { Link, Routes, Route, useNavigate } from 'react-router-dom'
import AdminPage from './AdminPage'
import './App.css'
@@ -73,8 +73,8 @@ export const DEFAULTS: SiteContent = {
studyGuideDescription:
'Go deeper in your study with the official Verse by Verse companion guide — now available on Amazon.',
studyGuideUrl: 'https://a.co/d/01sG2tOJ',
shareHeading: "Know someone who'd love this?",
shareP: 'Scan the QR code or share the link to introduce a friend to Verse by Verse with Nate.',
shareHeading: 'Help one more person hear the Word this week.',
shareP: 'Scan the QR code or text the show link to a friend who needs encouragement today.',
customLinks: [],
customBlocks: [],
}
@@ -455,9 +455,10 @@ function LandingPage({ content }: { content: SiteContent }) {
<h2 className="section-heading">
<span className="ornament"></span> Contact Nate <span className="ornament"></span>
</h2>
<p>
Have a question, testimony, or topic request? Send a message and we will get back to you.
<p className="contact-highlight">
Ask a Bible question, share a testimony, or request a topic for a future episode.
</p>
<p>We usually respond within 48 hours.</p>
</div>
<ContactForm />
</div>
@@ -501,6 +502,7 @@ function LandingPage({ content }: { content: SiteContent }) {
Contact:{' '}
<a href="mailto:hello@versebyversewithnate.us">hello@versebyversewithnate.us</a>
</p>
<p className="footer-response">We usually reply within 48 hours.</p>
<nav className="footer-links" aria-label="Footer links">
<a href={SPOTIFY_SHOW_URL} target="_blank" rel="noreferrer">Spotify</a>
<span aria-hidden="true">·</span>
@@ -518,6 +520,11 @@ function LandingPage({ content }: { content: SiteContent }) {
<a key={l.id} href={l.url} target="_blank" rel="noreferrer">{l.label}</a>,
])}
</nav>
<nav className="footer-links footer-links--legal" aria-label="Legal links">
<Link to="/privacy">Privacy Policy</Link>
<span aria-hidden="true">·</span>
<Link to="/terms">Terms</Link>
</nav>
<p className="footer-copy">© 2026 Nate Emmert · Made with faith.</p>
<p className="footer-privacy">
Privacy: with consent, analytics may store masked IP-based location data (country/state/county/city) and returning visitor activity.
@@ -565,6 +572,21 @@ function ThankYouPage() {
)
}
function LegalPage({ title, body }: { title: string; body: string[] }) {
return (
<main className="thanks-page" aria-label={title}>
<div className="thanks-card">
<p className="eyebrow">Verse by Verse with Nate</p>
<h1>{title}</h1>
{body.map((line, idx) => (
<p key={`${title}-${idx}`}>{line}</p>
))}
<Link to="/" className="btn-primary">Back to Site</Link>
</div>
</main>
)
}
export default function App() {
const [content, setContent] = useState<SiteContent>(DEFAULTS)
@@ -584,6 +606,32 @@ export default function App() {
<Route path="/" element={<LandingPage content={content} />} />
<Route path="/thanks" element={<ThankYouPage />} />
<Route path="/admin" element={<AdminPage content={content} onSave={setContent} />} />
<Route
path="/privacy"
element={(
<LegalPage
title="Privacy Policy"
body={[
'We respect your privacy and collect limited data to operate and improve this site.',
'If you consent to analytics cookies, we may store masked IP-based location signals and returning visitor activity.',
'Contact form details are used only to respond to your message and ministry communication requests.',
]}
/>
)}
/>
<Route
path="/terms"
element={(
<LegalPage
title="Terms"
body={[
'Content on this site is for informational and ministry purposes.',
'External links are provided for convenience and are subject to third-party policies.',
'By using this site, you agree to lawful use and respectful communication.',
]}
/>
)}
/>
</Routes>
)
}