Transaction list item UI fixes

SIKV · May 12, 2024 · a5a1033 · a5a1033
1 parent 2fff1e2
commit a5a1033
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 22 deletions.
diff --git a/lib/feature/transactions/ui/transaction_item.dart b/lib/feature/transactions/ui/transaction_item.dart
@@ -11,44 +11,45 @@ class TransactionItem extends ConsumerWidget {
   final TransactionUiModel transaction;
 
   const TransactionItem({
-    Key? key,
+    super.key,
     required this.transaction,
-  }) : super(key: key);
+  });
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final AppTheme appTheme = ref.watch(appThemeManagerProvider);
 
     return Row(
-      mainAxisAlignment: MainAxisAlignment.start,
       children: [
         transaction.getIcon(appTheme.colors),
+
         const SizedBox(width: Spacings.five),
-        Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            Text(transaction.title,
-              style: const TextStyle(
-                fontSize: 18,
+
+        Expanded(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(transaction.title,
+                style: Theme.of(context).textTheme.titleMedium,
               ),
-            ),
-            if (transaction.subtitle != null) ...[
-              Padding(
-                padding: const EdgeInsets.only(top: Spacings.half),
-                child: Text(transaction.subtitle ?? '',
-                  style: Theme.of(context).textTheme.bodySmall?.copyWith(
-                    fontSize: 14,
+              if (transaction.subtitle != null) ...[
+                Padding(
+                  padding: const EdgeInsets.only(top: Spacings.half),
+                  child: Text(transaction.subtitle ?? '',
+                    style: Theme.of(context).textTheme.bodySmall,
+                    maxLines: 2,
+                    overflow: TextOverflow.ellipsis,
                   ),
                 ),
-              ),
+              ],
             ],
-          ],
+          ),
         ),
-        const Spacer(),
+
+        const SizedBox(width: Spacings.five),
+
         Text(transaction.amount,
-          style: const TextStyle(
-            fontSize: 18,
-          ),
+          style: Theme.of(context).textTheme.titleMedium,
         ),
       ],
     );

diff --git a/lib/theme/theme.dart b/lib/theme/theme.dart
@@ -35,6 +35,10 @@ abstract class AppTheme {
           fontSize: 36,
           fontWeight: FontWeight.bold,
         ),
+        titleMedium: const TextStyle(
+          fontSize: 17,
+          fontWeight: FontWeight.w400,
+        ),
         bodySmall: TextStyle(
           fontSize: 14,
           color: colors.colorScheme.onSurface.withOpacity(0.75),