Die Fugen im Kalender werden dunkel statt hell
Filipe, screen18: "die linien zwischen den kacheln und der rand die so kras durchsichtig sind, ich will dass dass die viel dunkler sind und die kacheln vom kalender selber sollen viel krasser und geiler aussehen." WOHER DIE LINIEN KOMMEN, und das erklaert den Fehler: Sie sind gar nicht gezeichnet. Das Raster hat `gap: 1px` und darunter eine Flaeche -- in den Luecken zwischen den Tagen scheint diese Flaeche durch, DAS sind die Linien. Sie trugen `var(--rand)`, einen hellen halbdurchsichtigen Ton, der fuer Raender AUF dunklem Grund gedacht ist. Zwischen zwei ohnehin dunklen Kacheln wirkt derselbe Ton wie ein heller Schleier -- genau das, was Filipe "kras durchsichtig" nennt. Jetzt ein eigener tiefer Ton (#05070c): Die Fuge ist DUNKLER als die Kacheln daneben, nicht heller. Damit sieht sie eingefraest aus statt aufgemalt -- dieselbe Ueberlegung wie bei den Fasen auf der Startseite. Der aeussere Rand bekommt eine feine helle Innenkante, sonst verlaeuft der Kalender am Rand ins Nichts. DIE TAGE BEKOMMEN TIEFE: ein leichter Verlauf von oben nach unten und ein Lichtsaum an der Oberkante -- Licht kommt von oben, also ist die Oberkante hell und die Flaeche faellt ab. BEWUSST SCHWACH (der Verlauf umfasst rund vier Prozent Helligkeit): Ein Monatsraster hat 35 bis 42 dieser Felder nebeneinander. Was bei einer einzelnen Kachel wirkt, wird hier vierzigfach zu Unruhe. Wochenende und fremde Monate bleiben ruhiger und heben sich ueber WENIGER LICHT ab, nicht ueber eine andere Farbe. Nachgemessen am laufenden Kalender: Fugenfarbe rgb(5, 7, 12), 35 Tage im Raster. pruef-kalender EXIT=0, 84 Pruefungen. Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
@@ -1084,3 +1084,67 @@
|
||||
@media (forced-colors: active) {
|
||||
.wecker-knopf[data-an="ja"] { border: 2px solid CanvasText; }
|
||||
}
|
||||
|
||||
/* ===================================================================
|
||||
DIE LINIEN IM KALENDER WERDEN DUNKEL (08.09.2026)
|
||||
|
||||
Filipe, screen18: "ich will dass der kalender so bleibt, nur die
|
||||
linien zwischen den kacheln und der rand die so kras durchsichtig
|
||||
sind, ich will dass dass die viel dunkler sind und die kacheln vom
|
||||
kalender selber sollen viel krasser und geiler aussehen bitte."
|
||||
|
||||
WOHER DIE LINIEN KOMMEN: Sie sind gar nicht gezeichnet. Das Raster
|
||||
hat `gap: 1px` und darunter eine Flaeche -- in den Luecken zwischen
|
||||
den Tagen scheint diese Flaeche durch, und DAS sind die Linien. Sie
|
||||
trugen `var(--rand)`, einen hellen, halbdurchsichtigen Ton, der fuer
|
||||
Raender AUF dunklem Grund gedacht ist. Zwischen zwei ohnehin dunklen
|
||||
Kacheln wirkt derselbe Ton wie ein heller Schleier.
|
||||
|
||||
Jetzt ein eigener, tiefer Ton: Die Fuge ist dunkler als die Kacheln
|
||||
daneben, nicht heller. So sieht es aus wie eingefraest statt wie
|
||||
aufgemalt -- dieselbe Ueberlegung wie bei den Fasen der Kacheln auf
|
||||
der Startseite.
|
||||
|
||||
Der aeussere Rand bekommt zusaetzlich eine feine helle Innenkante.
|
||||
Ohne sie verschwaende der Kalender am Rand ins Nichts; mit ihr steht
|
||||
er als Platte auf der Seite. */
|
||||
.k-raster {
|
||||
gap: 1px;
|
||||
background: #05070c;
|
||||
border: 1px solid rgba(4, 6, 11, .9);
|
||||
box-shadow:
|
||||
inset 0 0 0 1px rgba(150, 186, 220, .09), /* die feine Innenkante */
|
||||
0 18px 44px -28px rgba(0, 0, 0, .9);
|
||||
}
|
||||
|
||||
/* ---- Und die Tage selbst bekommen Tiefe --------------------------
|
||||
|
||||
Vorher eine flache Flaeche in einem Ton. Jetzt ein sehr leichter
|
||||
Verlauf von oben nach unten und ein Lichtsaum an der Oberkante --
|
||||
dasselbe Mittel wie bei den Kacheln der Startseite: Licht kommt von
|
||||
oben, also ist die Oberkante hell und die Flaeche darunter faellt ab.
|
||||
|
||||
Bewusst schwach gehalten (der Verlauf umfasst rund vier Prozent
|
||||
Helligkeit): Ein Monatsraster hat 35 bis 42 dieser Felder
|
||||
nebeneinander. Was bei einer einzelnen Kachel wirkt, wird hier
|
||||
vierzigfach zu Unruhe. */
|
||||
.k-tag {
|
||||
background:
|
||||
linear-gradient(180deg, rgba(24, 32, 48, .78), rgba(10, 14, 23, .78));
|
||||
box-shadow: inset 0 1px 0 rgba(160, 195, 230, .07);
|
||||
}
|
||||
.k-tag:hover {
|
||||
background:
|
||||
linear-gradient(180deg, rgba(34, 45, 66, .9), rgba(17, 23, 37, .9));
|
||||
box-shadow: inset 0 1px 0 rgba(160, 195, 230, .13);
|
||||
}
|
||||
/* Wochenende und fremde Monate bleiben ruhiger -- sie sollen sich vom
|
||||
Arbeitstag abheben, und das tun sie ueber weniger Licht, nicht ueber
|
||||
eine andere Farbe. */
|
||||
.k-tag[data-wochenende="ja"] {
|
||||
background: linear-gradient(180deg, rgba(16, 21, 33, .82), rgba(8, 11, 18, .82));
|
||||
}
|
||||
.k-tag[data-fremd="ja"] {
|
||||
background: linear-gradient(180deg, rgba(12, 16, 25, .7), rgba(6, 9, 15, .7));
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user