From 09ef386eab8d52c50f9bd6f833afd77196919c20 Mon Sep 17 00:00:00 2001 From: checkedear <271323618+checkedear@users.noreply.github.com> Date: Sat, 25 Apr 2026 17:00:13 +0200 Subject: [PATCH] fix: countdown widget design --- .../widgets/home_main_starting_soon.dart | 147 ++++++++---------- firka_common/lib/ui/shared/counter_digit.dart | 22 ++- 2 files changed, 80 insertions(+), 89 deletions(-) diff --git a/firka/lib/ui/phone/widgets/home_main_starting_soon.dart b/firka/lib/ui/phone/widgets/home_main_starting_soon.dart index 912adb3..0a59be5 100644 --- a/firka/lib/ui/phone/widgets/home_main_starting_soon.dart +++ b/firka/lib/ui/phone/widgets/home_main_starting_soon.dart @@ -2,6 +2,8 @@ import 'package:firka/ui/components/firka_card.dart'; import 'package:firka/l10n/app_localizations.dart'; import 'package:firka/ui/theme/style.dart'; import 'package:firka/ui/shared/counter_digit.dart'; +import 'package:firka_common/firka_common.dart'; +import 'package:firka_common/ui/components/filled_circle.dart'; import 'package:flutter/material.dart'; import 'package:kreta_api/kreta_api.dart'; @@ -24,89 +26,72 @@ class StartingSoonWidget extends StatelessWidget { var minTxt = hour == 1 ? l10n.starting_min : l10n.starting_min_plural; var secTxt = hour == 1 ? l10n.starting_sec : l10n.starting_sec_plural; - return Column( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - FirkaCard( - attached: Attach.bottom, - left: [ - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - children: [ - SizedBox(width: 6), - Text( - l10n.starting_soon, - style: appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - ], + return FirkaCard.single( + margin: EdgeInsets.only(bottom: 1), + padding: EdgeInsets.all(16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + FilledCircle( + diameter: 32, + color: appStyle.colors.a15p, + child: FirkaIconWidget( + FirkaIconType.majesticonsLocal, + "sunSolid", + size: 20, + color: appStyle.colors.accent, ), - Row( - children: [ - CounterDigitWidget( - hour.toString(), - appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - SizedBox(width: 2), - Text( - hourTxt, - style: appStyle.fonts.B_16R.apply( - color: appStyle.colors.textPrimary, - ), - ), - SizedBox(width: 4), - CounterDigitWidget( - (min / 10).floor().toString(), - appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - CounterDigitWidget( - ((min % 10)).toString(), - appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - SizedBox(width: 2), - Text( - minTxt, - style: appStyle.fonts.B_16R.apply( - color: appStyle.colors.textPrimary, - ), - ), - SizedBox(width: 4), - CounterDigitWidget( - (sec / 10).floor().toString(), - appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - CounterDigitWidget( - ((sec % 10)).toString(), - appStyle.fonts.H_16px.apply( - color: appStyle.colors.textPrimary, - ), - ), - SizedBox(width: 2), - Text( - secTxt, - style: appStyle.fonts.B_16R.apply( - color: appStyle.colors.textPrimary, - ), - ), - ], + ), + SizedBox(width: 8), + Text( + l10n.starting_soon, + style: appStyle.fonts.B_16SB.apply( + color: appStyle.colors.textPrimary, ), - ], - ), - ], - right: [], - ), - ], + ), + ], + ), + Row( + children: [ + CounterDigitWidget((hour / 10).floor().toString()), + SizedBox(width: 4), + CounterDigitWidget(((hour % 10)).toString()), + SizedBox(width: 8), + Text( + hourTxt, + style: appStyle.fonts.B_16R.apply( + color: appStyle.colors.textSecondary, + ), + ), + SizedBox(width: 8), + CounterDigitWidget((min / 10).floor().toString()), + SizedBox(width: 4), + CounterDigitWidget(((min % 10)).toString()), + SizedBox(width: 8), + Text( + minTxt, + style: appStyle.fonts.B_16R.apply( + color: appStyle.colors.textSecondary, + ), + ), + SizedBox(width: 8), + CounterDigitWidget((sec / 10).floor().toString()), + SizedBox(width: 4), + CounterDigitWidget(((sec % 10)).toString()), + SizedBox(width: 8), + Text( + secTxt, + style: appStyle.fonts.B_16R.apply( + color: appStyle.colors.textSecondary, + ), + ), + ], + ), + ], + ), ); } } diff --git a/firka_common/lib/ui/shared/counter_digit.dart b/firka_common/lib/ui/shared/counter_digit.dart index 4ce82e0..5678c11 100644 --- a/firka_common/lib/ui/shared/counter_digit.dart +++ b/firka_common/lib/ui/shared/counter_digit.dart @@ -2,20 +2,26 @@ import 'package:flutter/material.dart'; import 'package:firka_common/ui/theme/style.dart'; +import '../../firka_common.dart'; + class CounterDigitWidget extends StatelessWidget { final String c; - final TextStyle? style; - const CounterDigitWidget(this.c, this.style, {super.key}); + const CounterDigitWidget(this.c, {super.key}); @override Widget build(BuildContext context) { - return Card( - shadowColor: Colors.transparent, - color: appStyle.colors.buttonSecondaryFill, - child: Padding( - padding: const EdgeInsets.only(left: 8, right: 8, top: 4, bottom: 4), - child: Text(c, style: style), + return Container( + width: 18, + decoration: ShapeDecoration( + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)), + color: appStyle.colors.buttonSecondaryFill, + ), + padding: EdgeInsets.symmetric(vertical: 2), + child: Text( + c, + textAlign: TextAlign.center, + style: appStyle.fonts.H_16px.apply(color: appStyle.colors.textPrimary), ), ); }