fix(todo): Today's tab centres its day in the calendar

The day stood on the calendar's bottom edge: a line box's place in the
space below the calendar's line was the font's to choose. It is placed by
its baseline now.

Whats-New: Today's tab shows its day centred in the calendar.
Whats-New-De: Der Heute-Tab zeigt den Tag mittig im Kalender.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Signed-off-by: Tizian 「ティツィアーン」 <raisondetredev@pm.me>
This commit is contained in:
Tizian 「ティツィアーン」 2026-11-05 14:17:35 +01:00
commit 6ee7aeabc0
Signed by: raisondetredev
GPG key ID: 07F6FCF405488B64
2 changed files with 63 additions and 16 deletions

View file

@ -8,6 +8,12 @@ import 'package:material_ui/material_ui.dart';
/// blank calendar with today's day of the month in it, as Lucide's /// blank calendar with today's day of the month in it, as Lucide's
/// `calendar-1` holds a 1, drawn anew at midnight. /// `calendar-1` holds a 1, drawn anew at midnight.
class const TodayIcon({super.key}) extends StatefulWidget { class const TodayIcon({super.key}) extends StatefulWidget {
/// The day's size, in the calendar's 24 units.
static const _fontSize = 9.6;
/// Noto Sans' digits' height, of the font's size.
static const _digitHeight = 0.714;
@override @override
State<TodayIcon> createState() => _TodayIconState(); State<TodayIcon> createState() => _TodayIconState();
} }
@ -49,22 +55,27 @@ class _TodayIconState() extends State<TodayIcon> {
alignment: Alignment.center, alignment: Alignment.center,
children: [ children: [
const Icon(LucideIcons.calendar), const Icon(LucideIcons.calendar),
// Lucide's calendar: its box from 4 to 22 of 24 units, the line // Lucide's calendar: inside its strokes from 11 to 21 of 24 units.
// under its rings at 10; the day centred in what is below it. // Placed by its baseline, a line box's place in it being the font's
Positioned( // to choose (the day stood on the frame, 5 Nov 2026).
top: size * 10 / 24, Positioned.fill(
bottom: size * 2 / 24, child: Align(
left: 0, alignment: Alignment.topCenter,
right: 0, child: Baseline(
child: Center( baseline:
child: Text( size *
'${clock.now().day}', (16 + TodayIcon._digitHeight * TodayIcon._fontSize / 2) /
textScaler: TextScaler.noScaling, 24,
style: TextStyle( baselineType: TextBaseline.alphabetic,
color: icon.color, child: Text(
fontSize: size * 0.4, '${clock.now().day}',
height: 1, textScaler: TextScaler.noScaling,
fontWeight: FontWeight.w700, style: TextStyle(
color: icon.color,
fontSize: size * TodayIcon._fontSize / 24,
height: 1,
fontWeight: FontWeight.w700,
),
), ),
), ),
), ),

View file

@ -0,0 +1,36 @@
import 'package:clock/clock.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:halkyon_todo_flutter/src/tabs/today_icon.dart';
import 'package:material_ui/material_ui.dart';
void main() {
testWidgets("the day's digits stand centred below the calendar's line, "
"whatever the font's line box (the developer's review, 5 Nov 2026)", (
tester,
) async {
await tester.pumpWidget(
const Directionality(
textDirection: TextDirection.ltr,
child: IconTheme(
data: IconThemeData(size: 24),
child: Center(child: TodayIcon()),
),
),
);
final icon = tester.getTopLeft(find.byType(TodayIcon));
final day = find.text('${clock.now().day}');
final measured = TextPainter(
text: TextSpan(text: '5', style: tester.widget<Text>(day).style),
textDirection: TextDirection.ltr,
)..layout();
addTearDown(measured.dispose);
final baseline =
tester.getTopLeft(day).dy +
measured.computeDistanceToActualBaseline(TextBaseline.alphabetic) -
icon.dy;
// The digits, 0.714 of 9.6 units high, between the strokes at 11 and 21.
expect(baseline, moreOrLessEquals(19.43, epsilon: 0.01));
});
}