From 4c2e72cb207efbe04df674a1bb7496ba2e16b3fa Mon Sep 17 00:00:00 2001 From: Guido Date: Thu, 27 Aug 2026 21:04:32 +0200 Subject: [PATCH] =?UTF-8?q?fix:=20Bankanbindung=20gliedern=20=E2=80=93=20u?= =?UTF-8?q?nd=20ein=20Platzhalter,=20der=20nicht=20ersetzt=20wurde?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Im Kopf jeder Verbindung stand woertlich "zuletzt {{when}}": Der Text erwartet `when`, uebergeben wurde `datum`. Die Gliederung lieh sich die Klassen des Postfachs – gestrichelte Trennlinien, sonst nichts. Damit war weder zu sehen, wo eine Bank aufhoert, noch welcher Knopf zu welchem Konto gehoert, und das Suchfeld fuer eine neue Bank verschwamm mit den Angaben der schon verbundenen. Jetzt: Jede Verbindung ist ein umrandeter Block mit Kopfzeile. Jedes Konto darin hat eine eigene linke Kante – die bindet seine Knoepfe sichtbar an es. Die Knoepfe der VERBINDUNG (alle Konten, Salden, trennen) stehen ohne Einrueckung hinter einer Trennlinie, gehoeren also erkennbar zur Bank und nicht zum letzten Konto. "Weitere Bank verbinden" ist mit eigener Ueberschrift abgesetzt. Nebenbei brach "Minuten (0 = aus)" neben dem Zahlenfeld um und las sich wie ein Fehler; die Klammer steht ohnehin im Hinweis darunter. Im Browser nachgemessen. Co-Authored-By: Claude Opus 5 --- web/src/finance.css | 55 ++++++++++++++++++++++++ web/src/locales/de.json | 5 ++- web/src/locales/en.json | 5 ++- web/src/pages/settings/Bankanbindung.jsx | 18 +++++--- 4 files changed, 73 insertions(+), 10 deletions(-) diff --git a/web/src/finance.css b/web/src/finance.css index bfa6d91..76a8992 100644 --- a/web/src/finance.css +++ b/web/src/finance.css @@ -1336,3 +1336,58 @@ tr.row-dup { flex: 0 0 auto; white-space: nowrap; } + +/* ---------- Bankanbindung: Verbindung, Konto, neue Bank ---------- + Vorher lieh sich das die Klassen des Postfachs: gestrichelte Trennlinien, + sonst nichts. Damit war nicht zu sehen, welcher Knopf zu welchem Konto + gehört und wo eine Bank aufhört. */ +.bank-verbindung { + border: 1px solid var(--border); + border-radius: var(--radius); + padding: var(--sp-4); + margin-top: var(--sp-4); +} +.bank-verbindung-kopf { + display: flex; + align-items: center; + gap: var(--sp-2); + padding-bottom: var(--sp-2); + margin-bottom: var(--sp-2); + border-bottom: 1px solid var(--border); +} +/* Ein Konto der Verbindung: eingerückt und mit eigener Kante. Die Kante ist + das, was seine Knöpfe sichtbar an es bindet. */ +.bank-konto { + border-left: 2px solid var(--border-strong); + padding: var(--sp-3) 0 var(--sp-3) var(--sp-3); + margin-top: var(--sp-3); +} +.bank-konto + .bank-konto { + margin-top: var(--sp-2); +} +.bank-konto select { + width: 100%; + margin-top: 4px; +} +/* Die Knöpfe der VERBINDUNG (alle Konten, Salden, trennen) stehen ohne + Einrückung – so gehören sie sichtbar zur Bank und nicht zum letzten Konto. */ +.bank-verbindung > .mail-actions { + padding-top: var(--sp-3); + border-top: 1px solid var(--border); +} +/* Eine neue Bank hinzufügen ist etwas anderes als eine bestehende zu pflegen. */ +.bank-neu { + margin-top: var(--sp-5); + padding-top: var(--sp-4); + border-top: 2px solid var(--border-strong); +} +.bank-neu h3 { + margin: 0 0 var(--sp-3); + font-size: 1rem; +} + +/* Die Einheit neben dem Zahlenfeld darf nicht umbrechen – „Minuten (0" in der + einen und „= aus)" in der nächsten Zeile las sich wie ein Fehler. */ +.bank-verbindung .input-with-button > .muted { + white-space: nowrap; +} diff --git a/web/src/locales/de.json b/web/src/locales/de.json index f2b7b52..7dd7cf8 100644 --- a/web/src/locales/de.json +++ b/web/src/locales/de.json @@ -648,11 +648,12 @@ "syncAll": "Alle Konten holen", "syncOne": "Umsätze holen", "poll": "Automatisch holen", - "pollUnit": "Minuten (0 = aus)", + "pollUnit": "Minuten", "pollHint": "Certain holt die Umsätze dann von selbst und bucht sie. 0 schaltet das ab; weniger als 15 Minuten lassen die Banken nicht zu.", "pollSaved": "Takt gespeichert.", "syncOlder": "Älteres nachholen", - "syncedDuplicate": "{{n}} standen schon da (aus Datei oder von Hand) und wurden übersprungen." + "syncedDuplicate": "{{n}} standen schon da (aus Datei oder von Hand) und wurden übersprungen.", + "addTitle": "Weitere Bank verbinden" }, "bankReturn": { "title": "Rückkehr von der Bank", diff --git a/web/src/locales/en.json b/web/src/locales/en.json index 1f0ccd4..efc4226 100644 --- a/web/src/locales/en.json +++ b/web/src/locales/en.json @@ -648,11 +648,12 @@ "syncAll": "Fetch all accounts", "syncOne": "Fetch transactions", "poll": "Fetch automatically", - "pollUnit": "minutes (0 = off)", + "pollUnit": "minutes", "pollHint": "Certain then fetches and books transactions on its own. 0 turns this off; banks do not allow less than 15 minutes.", "pollSaved": "Interval saved.", "syncOlder": "Catch up on older", - "syncedDuplicate": "{{n}} were already there (from a file or entered by hand) and were skipped." + "syncedDuplicate": "{{n}} were already there (from a file or entered by hand) and were skipped.", + "addTitle": "Connect another bank" }, "bankReturn": { "title": "Back from your bank", diff --git a/web/src/pages/settings/Bankanbindung.jsx b/web/src/pages/settings/Bankanbindung.jsx index 7889937..5779fd6 100644 --- a/web/src/pages/settings/Bankanbindung.jsx +++ b/web/src/pages/settings/Bankanbindung.jsx @@ -232,12 +232,16 @@ export default function Bankanbindung() { {/* Schritt 2: bestehende Verbindungen samt Kontozuordnung */} {verbindungen.map((v) => ( -
-
{v.aspsp_name} {v.aspsp_country}
+
+
+ + {v.aspsp_name} + {v.aspsp_country} +
{v.last_error ? `${t("bank.lastError")}: ${v.last_error}` - : v.last_sync_at ? t("bank.lastSync", { datum: formatDate(v.last_sync_at.slice(0, 10)) }) + : v.last_sync_at ? t("bank.lastSync", { when: formatDate(v.last_sync_at.slice(0, 10)) }) : t("bank.neverSynced")}
{v.valid_until && ( @@ -253,7 +257,7 @@ export default function Bankanbindung() {

{t("bank.noAccountsFound")}

) : ( linksVon(v).map((l) => ( -
+
{l.remote_name || l.iban || l.remote_uid} {/* Produktbezeichnung und Ersatzkennung sind bei Pockets das @@ -371,9 +375,11 @@ export default function Bankanbindung() {
))} - {/* Schritt 3: neue Bank verbinden */} + {/* Schritt 3: neue Bank verbinden. Deutlich abgesetzt – sonst verschwimmt + das Suchfeld mit den Angaben der schon verbundenen Banken. */} {app && ( -
+
+

{t("bank.addTitle")}