diff --git a/website/.env.example b/website/.env.example new file mode 100644 index 0000000..7735897 --- /dev/null +++ b/website/.env.example @@ -0,0 +1,9 @@ +SMTP_HOST=smtp.example.com +SMTP_PORT=587 +SMTP_SECURE=false +SMTP_USER=website@example.com +SMTP_PASSWORD=change-me +SMTP_FROM=website@example.com +SMTP_HELO=fedeo.de +SMTP_REJECT_UNAUTHORIZED=true +CONTACT_TO=f.federspiel@federspiel.tech diff --git a/website/app/assets/css/main.css b/website/app/assets/css/main.css index 4399a45..ab48fe2 100644 --- a/website/app/assets/css/main.css +++ b/website/app/assets/css/main.css @@ -676,21 +676,25 @@ footer { padding: clamp(3rem, 7vw, 6rem) clamp(1rem, 4vw, 2rem) 5rem; } +.contact-page, .audience-page { margin: 0 auto; max-width: 1180px; padding: clamp(3rem, 7vw, 6rem) clamp(1rem, 4vw, 2rem) 5rem; } +.contact-heading, .audience-heading { max-width: 58rem; margin-bottom: 2.5rem; } +.contact-heading h1, .audience-heading h1 { max-width: 12ch; } +.contact-heading p, .audience-heading p { color: #51605c; font-size: 1.08rem; @@ -698,6 +702,103 @@ footer { max-width: 46rem; } +.contact-form { + background: rgba(255, 255, 255, 0.76); + border: 1px solid rgba(23, 33, 31, 0.1); + border-radius: 0.5rem; + display: grid; + gap: 1rem; + max-width: 820px; + padding: clamp(1.25rem, 4vw, 2rem); +} + +.form-grid { + display: grid; + gap: 1rem; + grid-template-columns: repeat(2, minmax(0, 1fr)); +} + +.contact-form label { + color: #17211f; + display: grid; + font-size: 0.95rem; + font-weight: 800; + gap: 0.45rem; +} + +.contact-form input, +.contact-form textarea { + background: #ffffff; + border: 1px solid rgba(23, 33, 31, 0.14); + border-radius: 0.45rem; + color: #17211f; + font: inherit; + font-weight: 500; + min-height: 3rem; + padding: 0.8rem 0.9rem; + width: 100%; +} + +.contact-form textarea { + line-height: 1.55; + min-height: 12rem; + resize: vertical; +} + +.contact-form input:focus, +.contact-form textarea:focus { + border-color: var(--accent); + box-shadow: 0 0 0 0.2rem rgba(105, 195, 80, 0.18); + outline: none; +} + +.honeypot { + display: none; +} + +.check-row { + align-items: start; + display: flex; + font-weight: 500; + gap: 0.7rem; + line-height: 1.55; +} + +.check-row input { + flex: 0 0 auto; + margin-top: 0.25rem; + min-height: auto; + width: auto; +} + +.check-row a, +.form-status.error { + color: var(--accent-dark); + font-weight: 800; +} + +.form-actions { + align-items: center; + display: flex; + flex-wrap: wrap; + gap: 1rem; +} + +.form-actions button { + border: 0; + cursor: pointer; +} + +.form-actions button:disabled { + cursor: wait; + opacity: 0.72; +} + +.form-status { + color: #51605c; + margin: 0; +} + .audience-grid { display: grid; gap: 1rem; @@ -771,6 +872,10 @@ footer { grid-template-columns: repeat(2, minmax(0, 1fr)); } +.privacy-grid article { + align-content: start; +} + .legal-grid article { background: rgba(255, 255, 255, 0.76); border: 1px solid rgba(23, 33, 31, 0.1); @@ -842,6 +947,7 @@ footer p { .highlights, .feature-grid, + .form-grid, .audience-grid, .audience-fit, .matrix-layout, @@ -886,6 +992,7 @@ footer p { font-size: 3rem; } + .contact-heading h1, .audience-heading h1 { font-size: 2.55rem; max-width: none; diff --git a/website/app/pages/datenschutz.vue b/website/app/pages/datenschutz.vue new file mode 100644 index 0000000..61e7ef1 --- /dev/null +++ b/website/app/pages/datenschutz.vue @@ -0,0 +1,105 @@ + diff --git a/website/app/pages/impressum.vue b/website/app/pages/impressum.vue index 5eae53d..7f23fcb 100644 --- a/website/app/pages/impressum.vue +++ b/website/app/pages/impressum.vue @@ -11,7 +11,7 @@ Open Source Selfhost Matrix - Kontakt + Kontakt Einloggen @@ -99,8 +99,9 @@ FEDEO
Zielgruppen + Kontakt Impressum - Datenschutz + Datenschutz Einloggen

Copyright © 2026 Federspiel Technology UG haftungsbeschränkt.

diff --git a/website/app/pages/index.vue b/website/app/pages/index.vue index d743d23..19548cb 100644 --- a/website/app/pages/index.vue +++ b/website/app/pages/index.vue @@ -11,7 +11,7 @@ Open Source Selfhost Matrix - Kontakt + Kontakt Einloggen @@ -24,7 +24,7 @@ FEDEO bündelt Projekte, Zeiten, Buchhaltung, Kommunikation, Geräte und Warenflüsse in einer Oberfläche, die den Arbeitsalltag kleiner und mittlerer Teams spürbar ruhiger macht.

- Demo anfragen + Demo anfragen Funktionen ansehen
@@ -215,15 +215,16 @@ Frag eine Demo an und wir zeigen dir, wie FEDEO zu deinen Abläufen passt.

- Kontakt aufnehmen + Kontakt aufnehmen