Merge pull request 'Fix n.n.: Darkmode-Farben nach Mockup, blaue Schrift besser lesbar' (#104) from fds2610-bot/Finanzmanager:main into main
Reviewed-on: https://codeberg.org/fds2610/Finanzmanager/pulls/104
This commit is contained in:
fds2610
commit
da38b931e5
4 changed files with 46 additions and 31 deletions
|
|
@ -1,5 +1,14 @@
|
|||
# Änderungen
|
||||
|
||||
## Darkmode-Farben nach Mockup (01.10.2026)
|
||||
|
||||
- Dunkle Palette bläulicher (Navy) statt grau-blau, Seitenleiste, Flächen, Ränder und Akzent angepasst. Der aktive Menüeintrag ist wie im hellen Modus blau hinterlegt (`--navi-aktiv`), der Balken links bleibt weiß (neue Variable `--navi-balken`). Nur Farben, nur im Darkmode (`app.css`).
|
||||
- Blaue Schrift (Links, Überschriften, Marken) besser lesbar: im Darkmode heller, im Hellmodus dunkler. Eigene Variable `--akzent-schrift`, Knöpfe und Rahmen bleiben unverändert.
|
||||
|
||||
## Favicon in hellem und dunklem Modus (01.10.2026)
|
||||
|
||||
- Das Favicon war ein schwarzes „€“ ohne Hintergrund und im Darkmode kaum zu erkennen. Jetzt weißes „€“ auf blauer Kachel – in beiden Modi gut sichtbar (`kopf.php`, `schlicht.php`).
|
||||
|
||||
## Offener Vorgang für fehlgeschlagene Bargeld-Tool-Prüfungen (30.09.2026)
|
||||
|
||||
- Die Kachel „Offene Vorgänge“ im Cockpit zählt jetzt auch Buchungen, deren letzter Abgleich
|
||||
|
|
|
|||
|
|
@ -20,11 +20,13 @@
|
|||
--akzent: #1f6feb;
|
||||
--akzent-text: #ffffff;
|
||||
--akzent-schwach: #e5efff;
|
||||
--akzent-schrift: #1757b8;
|
||||
--navi-grund: #24313f;
|
||||
--navi-text: #cdd7e2;
|
||||
--navi-text-aktiv: #ffffff;
|
||||
--navi-aktiv: #1f6feb;
|
||||
--navi-marke: #6ea8fe;
|
||||
--navi-balken: #ffffff;
|
||||
--positiv: #1a7f4b;
|
||||
--negativ: #c0392b;
|
||||
--warnung: #9a6700;
|
||||
|
|
@ -37,20 +39,22 @@
|
|||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root:not([data-thema="hell"]) {
|
||||
--grund: #161b22;
|
||||
--flaeche: #1c2330;
|
||||
--flaeche-gedaempft: #232b39;
|
||||
--rand: #303a49;
|
||||
--rand-kraeftig: #44506180;
|
||||
--grund: #0d1624;
|
||||
--flaeche: #121c2e;
|
||||
--flaeche-gedaempft: #17233a;
|
||||
--rand: #1f2b3f;
|
||||
--rand-kraeftig: #2c3a52;
|
||||
--text: #e5eaf1;
|
||||
--text-gedaempft: #9aa7b6;
|
||||
--akzent: #4d8ef7;
|
||||
--akzent: #3e87fd;
|
||||
--akzent-text: #0d1117;
|
||||
--akzent-schwach: #1d2b45;
|
||||
--navi-grund: #10151c;
|
||||
--navi-text: #9aa7b6;
|
||||
--akzent-schwach: #172a4a;
|
||||
--akzent-schrift: #7db1ff;
|
||||
--navi-grund: #0a111e;
|
||||
--navi-text: #9fb0c8;
|
||||
--navi-text-aktiv: #ffffff;
|
||||
--navi-aktiv: #2f6fd0;
|
||||
--navi-aktiv: #1f6feb;
|
||||
--navi-balken: #ffffff;
|
||||
--positiv: #46b877;
|
||||
--negativ: #f0705f;
|
||||
--warnung: #d9a441;
|
||||
|
|
@ -59,20 +63,22 @@
|
|||
}
|
||||
|
||||
:root[data-thema="dunkel"] {
|
||||
--grund: #161b22;
|
||||
--flaeche: #1c2330;
|
||||
--flaeche-gedaempft: #232b39;
|
||||
--rand: #303a49;
|
||||
--rand-kraeftig: #445061;
|
||||
--grund: #0d1624;
|
||||
--flaeche: #121c2e;
|
||||
--flaeche-gedaempft: #17233a;
|
||||
--rand: #1f2b3f;
|
||||
--rand-kraeftig: #2c3a52;
|
||||
--text: #e5eaf1;
|
||||
--text-gedaempft: #9aa7b6;
|
||||
--akzent: #4d8ef7;
|
||||
--akzent: #3e87fd;
|
||||
--akzent-text: #0d1117;
|
||||
--akzent-schwach: #1d2b45;
|
||||
--navi-grund: #10151c;
|
||||
--navi-text: #9aa7b6;
|
||||
--akzent-schwach: #172a4a;
|
||||
--akzent-schrift: #7db1ff;
|
||||
--navi-grund: #0a111e;
|
||||
--navi-text: #9fb0c8;
|
||||
--navi-text-aktiv: #ffffff;
|
||||
--navi-aktiv: #2f6fd0;
|
||||
--navi-aktiv: #1f6feb;
|
||||
--navi-balken: #ffffff;
|
||||
--positiv: #46b877;
|
||||
--negativ: #f0705f;
|
||||
--warnung: #d9a441;
|
||||
|
|
@ -89,7 +95,7 @@ body {
|
|||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
a { color: var(--akzent); text-decoration: none; }
|
||||
a { color: var(--akzent-schrift); text-decoration: none; }
|
||||
a:hover { text-decoration: underline; }
|
||||
|
||||
code {
|
||||
|
|
@ -177,7 +183,7 @@ code {
|
|||
|
||||
.seitenleiste a.aktiv {
|
||||
background: var(--navi-aktiv);
|
||||
border-left-color: #fff;
|
||||
border-left-color: var(--navi-balken);
|
||||
color: var(--navi-text-aktiv);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
|
@ -239,7 +245,7 @@ code {
|
|||
margin: 0;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 600;
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
}
|
||||
|
||||
.werkzeuge {
|
||||
|
|
@ -410,7 +416,7 @@ form.inline { display: inline; margin: 0; }
|
|||
.schrittmarke {
|
||||
display: inline-block;
|
||||
background: var(--akzent-schwach);
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
font-size: .8rem;
|
||||
font-weight: 600;
|
||||
padding: .15rem .5rem;
|
||||
|
|
@ -558,7 +564,7 @@ form.inline { display: inline; margin: 0; }
|
|||
Ebene tiefer): Der Eintrag ist ein Link und sieht auch danach aus – sonst
|
||||
probierte ihn niemand aus. */
|
||||
a.legendenname {
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
text-decoration: underline dotted;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
|
@ -672,7 +678,7 @@ a.legendenname:hover { text-decoration: underline; }
|
|||
margin-right: .4rem;
|
||||
border-radius: 999px;
|
||||
background: var(--akzent-schwach);
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
font-family: var(--schrift-zahl);
|
||||
font-size: .8rem;
|
||||
text-align: center;
|
||||
|
|
@ -936,7 +942,7 @@ table.budgetplaner td.budgetzelle { position: relative; }
|
|||
}
|
||||
|
||||
.zahnrad:hover,
|
||||
.zahnrad[aria-expanded="true"] { color: var(--akzent); }
|
||||
.zahnrad[aria-expanded="true"] { color: var(--akzent-schrift); }
|
||||
|
||||
.zahnradmenue {
|
||||
position: absolute;
|
||||
|
|
@ -1898,7 +1904,7 @@ table.bericht .wertlink {
|
|||
|
||||
table.bericht .zeilenlink:hover,
|
||||
table.bericht .wertlink:hover {
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
|
@ -2015,7 +2021,7 @@ table.bericht .wertlink:hover {
|
|||
|
||||
.vorschlagsmarke {
|
||||
background: var(--akzent-schwach);
|
||||
color: var(--akzent);
|
||||
color: var(--akzent-schrift);
|
||||
font-size: .75rem;
|
||||
font-weight: 600;
|
||||
padding: .1rem .5rem;
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@ $istAktiv = static function (string $pfad, array $auch = []) use ($aktuellerPfad
|
|||
<!-- Nur hier eingebunden: Ein zweites Mal im Fuß ließe jeden Handler doppelt
|
||||
laufen – Rückfragen kämen zweimal, Menüs entstünden zweimal. -->
|
||||
<script src="/static/app.js" defer></script>
|
||||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><text y='13' font-size='13'>€</text></svg>">
|
||||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect width='16' height='16' rx='3' fill='%231d6fb8'/><text x='8' y='12.5' font-size='12' font-weight='bold' text-anchor='middle' fill='white' font-family='sans-serif'>€</text></svg>">
|
||||
</head>
|
||||
<body>
|
||||
<?php include __DIR__ . '/meldungen.php'; ?>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ use Finanzmanager\View;
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title><?= View::h($titel) ?> – Finanzmanager</title>
|
||||
<link rel="stylesheet" href="/static/app.css">
|
||||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><text y='13' font-size='13'>€</text></svg>">
|
||||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect width='16' height='16' rx='3' fill='%231d6fb8'/><text x='8' y='12.5' font-size='12' font-weight='bold' text-anchor='middle' fill='white' font-family='sans-serif'>€</text></svg>">
|
||||
</head>
|
||||
<body class="schlicht">
|
||||
<?php include __DIR__ . '/meldungen.php'; ?>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue