Frontend: Aus main übernommen assets/ und includes/frontend-* synchronisiert in develop (CSS/Ergebnis/Formular).

2026-01-30 21:27:15 +01:00
parent 9911947c3a
commit 64546f3b62
4 changed files with 360 additions and 9 deletions
--- a/assets/frontend-form.css
+++ b/assets/frontend-form.css
@@ -0,0 +1,104 @@
+.kc-form-container {
+    box-sizing: border-box;
+    width: 100%;
+    max-width: 680px;
+    margin: 28px auto;
+    background: #f8fbe7;
+    border-left: 8px solid #b6d333;
+    border-radius: 14px;
+    box-shadow: 0 5px 22px #8eae291a;
+    padding: 28px 22px;
+    font-family: 'Segoe UI', Arial, sans-serif;
+}
+
+.kc-form-container h2 {
+    color: #3b5323;
+    font-family: 'Montserrat', Arial, sans-serif;
+    font-size: 2em;
+    margin-top: 0;
+    margin-bottom: 0.5em;
+    letter-spacing: -1px;
+}
+
+.kc-form-row {
+    margin-bottom: 22px;
+}
+
+.kc-form-row label {
+    display: block;
+    font-weight: 700;
+    color: #1c3866;
+    margin-bottom: 7px;
+    font-size: 1.07em;
+}
+
+.kc-form-row select,
+.kc-form-row input[type="text"],
+.kc-form-row input[type="email"],
+.kc-form-row input[type="number"] {
+    box-sizing: border-box;
+    width: 100%;
+    padding: 10px;
+    border: 1.7px solid #d6e39f;
+    border-radius: 5px;
+    background: #fcffe9;
+    font-size: 1.09em;
+    margin-top: 3px;
+    transition: border .2s;
+}
+
+.kc-form-row input[type="text"]:focus,
+.kc-form-row select:focus {
+    outline: none;
+    border-color: #b6d333;
+    background: #fffde8;
+}
+
+.kc-form-row input[type="submit"] {
+    background: #2f5393;
+    color: #fff;
+    padding: 13px 28px;
+    font-weight: bold;
+    font-size: 1.13em;
+    border: 0;
+    border-radius: 7px;
+    cursor: pointer;
+    margin-top: 6px;
+    box-shadow: 0 2px 8px #1c38661a;
+    transition: background .2s;
+}
+.kc-form-row input[type="submit"]:hover {
+    background: #1c3866;
+}
+
+.kc-required {
+    color: #e42626;
+    font-weight: bold;
+}
+.kc-success-msg {
+    color: #288830;
+    background: #f2fbe2;
+    border-left: 4px solid #b6d333;
+    padding: 15px 15px 15px 22px;
+    margin-bottom: 25px;
+    font-size: 1.1em;
+    border-radius: 7px;
+}
+.kc-error-msg {
+    color: #a80000;
+    background: #ffeaea;
+    border-left: 4px solid #e12b2b;
+    padding: 15px 15px 15px 22px;
+    margin-bottom: 25px;
+    font-size: 1.1em;
+    border-radius: 7px;
+}
+@media (max-width: 900px) {
+    .kc-form-container {padding:20px 14px;}
+}
+
+@media (max-width: 520px) {
+    .kc-form-container {padding:14px 10px;border-radius:10px;margin:14px 10px;}
+    .kc-form-container h2 {font-size:1.4em}
+    .kc-form-row {margin-bottom:14px}
+}