patx/demo
fix form jdb landscape
Commit 1078efa · patx · 2026-06-15T17:07:26-04:00
Comments
No comments yet.
Diff
diff --git a/docs/jdb.html b/docs/jdb.html
index 24dcc3f..33d7924 100644
--- a/docs/jdb.html
+++ b/docs/jdb.html
@@ -766,6 +766,20 @@ body.modal-open { overflow: hidden; }
background: rgba(74,124,89,.1); border: 1px solid rgba(74,124,89,.3);
font-size: 13px; color: var(--green-d); font-weight: 400; margin-top: 12px;
}
+.estimate-form.is-submitted {
+ justify-content: center;
+ min-height: 320px;
+}
+.estimate-form.is-submitted > :not(.form-success) {
+ display: none;
+}
+.estimate-form.is-submitted .form-success {
+ display: block;
+ margin-top: 0;
+ padding: 24px;
+ font-size: 15px;
+ line-height: 1.6;
+}
/* ─── FOOTER ─── */
footer {
@@ -777,12 +791,16 @@ footer {
gap: 60px; padding-bottom: 56px;
border-bottom: 1px solid rgba(255,255,255,.07);
}
-.footer-brand-name {
- font-family: 'Cormorant Garamond', serif;
- font-size: 28px; font-weight: 600; color: var(--white);
- margin-bottom: 6px; letter-spacing: .02em;
+.footer-logo-link {
+ display: inline-flex;
+ align-items: center;
+ margin-bottom: 14px;
+}
+.footer-logo-image {
+ display: block;
+ width: 96px;
+ height: auto;
}
-.footer-brand-name span { color: var(--rust); }
.footer-tagline {
font-size: 13px; line-height: 1.7; font-weight: 300;
color: rgba(255,255,255,.35); margin-bottom: 28px;
@@ -947,6 +965,7 @@ footer {
footer { padding: 56px 24px 32px; }
.footer-top { grid-template-columns: 1fr 1fr; gap: 36px; }
+ .footer-logo-image { width: 82px; }
.footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
}
</style>
@@ -1363,7 +1382,7 @@ footer {
<textarea class="form-textarea" placeholder="Size of the area, current state, what you're hoping for — anything helps James prepare for the visit."></textarea>
</div>
<button type="submit" class="form-submit">Send Request — It's Free</button>
- <div class="form-success" id="formSuccess">
+ <div class="form-success" id="formSuccess" role="status" tabindex="-1">
✓ Request received. James will be in touch within 24 hours.
</div>
</form>
@@ -1374,7 +1393,9 @@ footer {
<footer>
<div class="footer-top">
<div>
- <div class="footer-brand-name">JDB<span>.</span>Landscape</div>
+ <a href="#hero" class="footer-logo-link" aria-label="JDB Landscape home">
+ <img class="footer-logo-image" src="jdb-logo.png" width="400" height="398" alt="JDB Landscape">
+ </a>
<p class="footer-tagline">Quality work. Fair prices.<br>Expectations exceeded.</p>
<div class="footer-social">
<a href="https://www.instagram.com/jdb_landscape/" target="_blank" rel="noopener" class="footer-social-link" title="Instagram">
@@ -1602,13 +1623,11 @@ srEls.forEach(el => obs.observe(el));
// ─── FORM ───
function submitForm(e) {
e.preventDefault();
- const btn = e.target.querySelector('.form-submit');
- btn.textContent = 'Sending…';
- btn.disabled = true;
- setTimeout(() => {
- btn.textContent = 'Sent ✓';
- document.getElementById('formSuccess').style.display = 'block';
- }, 900);
+ const form = e.currentTarget;
+ const success = form.querySelector('.form-success');
+
+ form.classList.add('is-submitted');
+ success.focus();
}
</script>
</body>