diff --git a/backend/app.py b/backend/app.py index 8dc48fa..d012d8e 100644 --- a/backend/app.py +++ b/backend/app.py @@ -72,7 +72,7 @@ class SecurityHeadersMiddleware(BaseHTTPMiddleware): "connect-src 'self' https://cdn.jsdelivr.net https://*.tile.openstreetmap.org https://unpkg.com https://www.google-analytics.com https://analytics.google.com https://*.google-analytics.com; " "frame-ancestors 'none'; " "base-uri 'self'; " - "form-action 'self';" + "form-action 'self' https://formsubmit.co;" ) # HSTS (only enable if using HTTPS in production) diff --git a/frontend/index.html b/frontend/index.html index 8550644..ff68409 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -346,8 +346,26 @@ diff --git a/frontend/styles.css b/frontend/styles.css index 25b2207..3f56551 100644 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -1197,14 +1197,82 @@ body { /* Footer */ .footer { - text-align: center; - padding: 2rem; margin-top: 3rem; border-top: 1px solid var(--border-color); color: var(--text-muted); font-size: 0.85rem; } +.footer-content { + max-width: 600px; + margin: 0 auto; + padding: 2rem; +} + +.footer-contact { + margin-bottom: 2rem; +} + +.footer-contact h3 { + font-family: 'Playfair Display', serif; + font-size: 1.25rem; + color: var(--text-primary); + margin-bottom: 0.5rem; +} + +.footer-contact > p { + color: var(--text-muted); + margin-bottom: 1rem; +} + +.contact-form { + display: flex; + flex-direction: column; + gap: 0.75rem; +} + +.contact-form .form-row { + display: flex; + gap: 0.75rem; +} + +.contact-form .form-input { + flex: 1; + padding: 0.75rem 1rem; + font-family: inherit; + font-size: 0.9rem; + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + background: var(--bg-card); + color: var(--text-primary); + transition: var(--transition); +} + +.contact-form .form-input:focus { + outline: none; + border-color: var(--accent-teal); + box-shadow: 0 0 0 3px rgba(45, 106, 100, 0.1); +} + +.contact-form .form-input::placeholder { + color: var(--text-muted); +} + +.contact-form .form-textarea { + min-height: 100px; + resize: vertical; +} + +.contact-form .btn { + align-self: flex-start; +} + +.footer-source { + text-align: center; + padding-top: 1.5rem; + border-top: 1px solid var(--border-color); +} + .footer a { color: var(--accent-teal); text-decoration: none; @@ -1214,9 +1282,14 @@ body { text-decoration: underline; } -.footer-note { - margin-top: 0.5rem; - font-size: 0.75rem; +@media (max-width: 768px) { + .contact-form .form-row { + flex-direction: column; + } + + .contact-form .btn { + align-self: stretch; + } } /* Loading State */