Track _site/ in repo for direct Caddy deployment
This commit is contained in:
387
_site/contact/index.html
Normal file
387
_site/contact/index.html
Normal file
@@ -0,0 +1,387 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Request a Quote | HER</title>
|
||||
|
||||
|
||||
<meta name="description" content="Request a quote from Diana — San Francisco's trusted handywoman. Tell her about your project and she'll get back to you within 1–2 business days.">
|
||||
|
||||
|
||||
<link rel="canonical" href="https://her-sf.com/contact/">
|
||||
|
||||
|
||||
<meta property="og:title" content="Request a Quote | HER">
|
||||
<meta property="og:description" content="Request a quote from Diana — San Francisco's trusted handywoman. Tell her about your project and she'll get back to you within 1–2 business days.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://her-sf.com/contact/">
|
||||
<meta property="og:image" content="https://her-sf.com/assets/diana_photo-min-1-scaled.webp">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:title" content="Request a Quote | HER">
|
||||
<meta name="twitter:description" content="Request a quote from Diana — San Francisco's trusted handywoman. Tell her about your project and she'll get back to you within 1–2 business days.">
|
||||
<meta name="twitter:image" content="https://her-sf.com/assets/diana_photo-min-1-scaled.webp">
|
||||
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@1,9..144,400&family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600&display=swap">
|
||||
|
||||
<link rel="stylesheet" href="../css/main.css">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "LocalBusiness",
|
||||
"@id": "https://her-sf.com/#business",
|
||||
"name": "Home Enhancement and Renovation — HER",
|
||||
"url": "https://her-sf.com",
|
||||
"telephone": "+16508339380",
|
||||
"email": "diana@spotlighthis.com",
|
||||
"image": "https://her-sf.com/assets/diana_photo-min-1-scaled.webp",
|
||||
"priceRange": "$$",
|
||||
"address": {
|
||||
"@type": "PostalAddress",
|
||||
"addressLocality": "San Francisco",
|
||||
"addressRegion": "CA",
|
||||
"addressCountry": "US"
|
||||
},
|
||||
"geo": {
|
||||
"@type": "GeoCoordinates",
|
||||
"latitude": 37.7749,
|
||||
"longitude": -122.4194
|
||||
},
|
||||
"areaServed": [
|
||||
"San Francisco", "Oakland", "Berkeley", "San Jose", "Palo Alto",
|
||||
"Marin County", "Tiburon", "Sausalito", "Daly City",
|
||||
"South San Francisco", "Burlingame", "San Mateo", "Redwood City",
|
||||
"Menlo Park", "Fremont", "Alameda"
|
||||
]
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="#main-content" class="skip-link">Skip to main content</a>
|
||||
|
||||
<header class="nav" role="banner">
|
||||
<div class="nav__inner container">
|
||||
|
||||
<a href="../index.html" class="nav__brand" aria-label="HER Home Enhancement & Restoration — Home">
|
||||
<span class="nav__brand-her">HER</span>
|
||||
<span class="nav__brand-tagline" aria-hidden="true">Home Enhancement<br><span class="nav__brand-amp">&</span> Restoration</span>
|
||||
</a>
|
||||
|
||||
<nav aria-label="Main navigation">
|
||||
<ul class="nav__links" role="list">
|
||||
<li><a href="../about/index.html">About</a></li>
|
||||
<li><a href="../services/index.html">Services</a></li>
|
||||
<li><a href="../testimonials/index.html">Testimonials</a></li>
|
||||
<li><a href="../contact/index.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="nav__actions">
|
||||
<a href="tel:+16508339380" class="nav__phone" aria-label="Call Diana at (650) 833-9380">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.4 2 2 0 0 1 3.6 1.22h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L7.91 8.78a16 16 0 0 0 6 6l.92-.92a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 21.5 16h.5a2 2 0 0 1 .02.92z"/>
|
||||
</svg>
|
||||
</a>
|
||||
|
||||
<a href="../contact/index.html" class="btn btn--primary" style="display:none" id="nav-cta">Request a Quote</a>
|
||||
|
||||
<button
|
||||
class="nav__toggle"
|
||||
aria-label="Open menu"
|
||||
aria-expanded="false"
|
||||
aria-controls="nav-overlay"
|
||||
>
|
||||
<span class="nav__bar"></span>
|
||||
<span class="nav__bar"></span>
|
||||
<span class="nav__bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="nav__overlay" id="nav-overlay" hidden>
|
||||
<button class="nav__overlay-close" aria-label="Close menu">✕</button>
|
||||
<nav aria-label="Mobile navigation">
|
||||
<ul role="list">
|
||||
<li><a href="../about/index.html">About</a></li>
|
||||
<li><a href="../services/index.html">Services</a></li>
|
||||
<li><a href="../testimonials/index.html">Testimonials</a></li>
|
||||
<li><a href="../contact/index.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<a href="../contact/index.html" class="btn btn--ghost-white btn--full">Request a Quote</a>
|
||||
<a href="tel:+16508339380" class="nav__overlay-phone">(650) 833-9380</a>
|
||||
</div>
|
||||
|
||||
</header>
|
||||
|
||||
|
||||
<main id="main-content">
|
||||
|
||||
|
||||
<section class="page-hero bg-graphite">
|
||||
<div class="page-hero__inner container">
|
||||
<p class="section-eyebrow">Get in touch</p>
|
||||
<h1 class="page-hero__title">Request a Quote.</h1>
|
||||
<p class="page-hero__lead">Tell Diana about your project. She responds within 1–2 business days.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="contact-page section">
|
||||
<div class="contact-page__grid container">
|
||||
|
||||
|
||||
<div>
|
||||
<form class="quote-form" id="quote-form" novalidate aria-label="Quote request form">
|
||||
|
||||
|
||||
<div class="visually-trap" aria-hidden="true">
|
||||
<label for="website">Leave this blank</label>
|
||||
<input type="text" id="website" name="website" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-error-banner" role="alert" aria-live="assertive" hidden>
|
||||
<p>Please correct the errors below before sending.</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-field">
|
||||
<label for="name">Your name <span aria-hidden="true">*</span></label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
required
|
||||
autocomplete="name"
|
||||
aria-required="true"
|
||||
aria-describedby="name-error"
|
||||
>
|
||||
<p class="form-field__error" id="name-error" aria-live="polite"></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-field">
|
||||
<label for="address">Project address <span aria-hidden="true">*</span></label>
|
||||
<input
|
||||
type="text"
|
||||
id="address"
|
||||
name="address"
|
||||
required
|
||||
autocomplete="off"
|
||||
aria-required="true"
|
||||
aria-describedby="address-hint address-error"
|
||||
>
|
||||
<p class="form-field__hint" id="address-hint">Where is the work located? City or full address.</p>
|
||||
<p class="form-field__error" id="address-error" aria-live="polite"></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-field">
|
||||
<label for="phone">Phone number <span aria-hidden="true">*</span></label>
|
||||
<input
|
||||
type="tel"
|
||||
id="phone"
|
||||
name="phone"
|
||||
required
|
||||
inputmode="tel"
|
||||
autocomplete="tel"
|
||||
aria-required="true"
|
||||
aria-describedby="phone-error"
|
||||
>
|
||||
<p class="form-field__error" id="phone-error" aria-live="polite"></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-field">
|
||||
<label for="email">Email address <span aria-hidden="true">*</span></label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
name="email"
|
||||
required
|
||||
inputmode="email"
|
||||
autocomplete="email"
|
||||
aria-required="true"
|
||||
aria-describedby="email-error"
|
||||
>
|
||||
<p class="form-field__error" id="email-error" aria-live="polite"></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-field">
|
||||
<label for="description">Project description <span aria-hidden="true">*</span></label>
|
||||
<textarea
|
||||
id="description"
|
||||
name="description"
|
||||
rows="5"
|
||||
required
|
||||
aria-required="true"
|
||||
aria-describedby="description-hint description-char-count description-error"
|
||||
></textarea>
|
||||
<p class="form-field__hint" id="description-hint">What needs to be fixed, replaced, or improved?</p>
|
||||
<p class="form-field__char-count" id="description-char-count" aria-live="polite"></p>
|
||||
<p class="form-field__error" id="description-error" aria-live="polite"></p>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn--primary form__submit">Send My Request</button>
|
||||
|
||||
|
||||
<div class="form-success" role="status" hidden>
|
||||
<p class="form-success__icon" aria-hidden="true">✓</p>
|
||||
<h2 class="form-success__title">Your request is on its way!</h2>
|
||||
<p class="form-success__body">Diana will review your request and get back to you within 1–2 business days. If your project is urgent, you can also reach her directly at <a href="tel:+16508339380">(650) 833-9380</a>.</p>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<aside class="contact-secondary">
|
||||
<h2>Other ways to reach Diana</h2>
|
||||
|
||||
<div class="contact-secondary__method">
|
||||
<span class="contact-secondary__icon" aria-hidden="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.4 2 2 0 0 1 3.6 1.22h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L7.91 8.78a16 16 0 0 0 6 6l.92-.92a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 21.5 16h.5a2 2 0 0 1 .02.92z"/>
|
||||
</svg>
|
||||
</span>
|
||||
<div>
|
||||
<p class="contact-secondary__label">Call or text</p>
|
||||
<a href="tel:+16508339380" class="contact-secondary__value">(650) 833-9380</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-secondary__method">
|
||||
<span class="contact-secondary__icon" aria-hidden="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
|
||||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/>
|
||||
<polyline points="22,6 12,13 2,6"/>
|
||||
</svg>
|
||||
</span>
|
||||
<div>
|
||||
<p class="contact-secondary__label">Email</p>
|
||||
<a href="mailto:diana@spotlighthis.com" class="contact-secondary__value">diana@spotlighthis.com</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>For urgent repairs, calling is fastest.</p>
|
||||
|
||||
<p class="contact-secondary__area">Diana serves San Francisco and the Bay Area (within 50 miles).</p>
|
||||
</aside>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="footer__inner container">
|
||||
|
||||
<div>
|
||||
<a href="../index.html" class="footer__brand" aria-label="HER Home Enhancement & Restoration — Home">
|
||||
<span class="footer__brand-her">HER</span>
|
||||
<span class="footer__brand-tagline" aria-hidden="true">Home Enhancement<br><span class="footer__brand-amp">&</span> Restoration</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<nav aria-label="Footer navigation">
|
||||
<p class="footer__nav-heading">Services in the Bay Area</p>
|
||||
<div class="footer__nav-cols">
|
||||
<ul class="footer__nav" role="list">
|
||||
|
||||
|
||||
<li><a href="../services/painting/index.html">Painting</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/tile-setting/index.html">Tile Setting</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/drywall/index.html">Drywall & Sheetrocking</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/plumbing/index.html">Minor Plumbing</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/electrical/index.html">Minor Electrical</a></li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
<ul class="footer__nav" role="list">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/carpentry-and-mounting/index.html">Carpentry & Mounting</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/flooring/index.html">Flooring & Wood Refinishing</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/security-safety/index.html">Security & Safety Equipment</a></li>
|
||||
|
||||
|
||||
|
||||
<li><a href="../services/boat-work/index.html">Boat Work</a></li>
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div>
|
||||
<p class="footer__nav-heading">Contact</p>
|
||||
<div class="footer__contact">
|
||||
<a href="tel:+16508339380">(650) 833-9380</a>
|
||||
<a href="mailto:diana@spotlighthis.com">diana@spotlighthis.com</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="footer__bottom">
|
||||
<div class="container">
|
||||
<p>© 2026 Home Enhancement & Restoration — HER. All rights reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="../js/main.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user