mARTin-B78/My-Weekly-ToDo-List
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: date vertical alignment uses baseline with relative offsets

Browse Source 
Use baseline alignment as anchor so the date positions relative to the
weekday text, not the container. Apply small em-based offsets for
top/center/bottom to fine-tune positioning without overshooting.

v1.34.3

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
mARTin 2026-03-15 09:04:53 +01:00
parent a66f2c0bb4
commit d6009ef7b2
2 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "my-weekly-todo-list",
"version": "1.34.2",
"version": "1.34.3",
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
"main": "index.js",
"scripts": {

18
src/components/WeeklyView.tsx
View File

@ -6404,7 +6404,7 @@ export default function WeeklyView() {
activeDateLayout === "above" ||
activeDateLayout === "below"
? (profile.dateAlignment === "left" ? "flex-start" : profile.dateAlignment === "right" ? "flex-end" : "center")
: (profile.dateVerticalAlign === "top" ? "flex-start" : profile.dateVerticalAlign === "bottom" ? "baseline" : "center"),
: "baseline",
justifyContent:
profile.dateAlignment === "left"
? "flex-start"
@ -6421,7 +6421,12 @@ export default function WeeklyView() {
}}
>
{activeDateLayout === "left" && (
<span className="weekly-day-date" style={{ flexShrink: 0, marginBottom: (activeDateLayout === "left" || activeDateLayout === "right") ? 0 : undefined }}>
<span className="weekly-day-date" style={{
flexShrink: 0,
marginBottom: 0,
position: "relative",
top: profile.dateVerticalAlign === "top" ? "-0.35em" : profile.dateVerticalAlign === "bottom" ? "0.1em" : "-0.1em",
}}>
{formatDateHeader(date, language)}
</span>
)}
@ -6435,7 +6440,14 @@ export default function WeeklyView() {
activeDateLayout === "above" ||
activeDateLayout === "below" ||
activeDateLayout === undefined) && (
<span className="weekly-day-date" style={{ flexShrink: 0, marginBottom: (activeDateLayout === "right" || activeDateLayout === undefined) ? 0 : undefined }}>
<span className="weekly-day-date" style={{
flexShrink: 0,
marginBottom: (activeDateLayout === "above" || activeDateLayout === "below") ? undefined : 0,
...(activeDateLayout !== "above" && activeDateLayout !== "below" ? {
position: "relative" as const,
top: profile.dateVerticalAlign === "top" ? "-0.35em" : profile.dateVerticalAlign === "bottom" ? "0.1em" : "-0.1em",
} : {}),
}}>
{formatDateHeader(date, language)}
</span>
)}