TF-3410 Fix list email item in ThreadView was not applied correct font

Signed-off-by: dab246 <tdvu@linagora.com>

core/lib/presentation/extensions/color_extension.dart

@@ -26,6 +26,7 @@ extension AppColor on Color {
   static const mailboxBackgroundColor = Color(0xFFFFFFFF);
   static const mailboxSelectedTextColor = Color(0xFF3840F7);
   static const mailboxTextColor = Color(0xFF182952);
+  static const emailMailboxContainColor = Color(0xFF162546);
   static const mailboxSelectedTextNumberColor = Color(0xFF182952);
   static const mailboxSelectedIconColor = Color(0xFF3840F7);
   static const mailboxIconColor = Color(0xFF7E869B);
@@ -36,7 +37,7 @@ extension AppColor on Color {
   static const myFolderTitleColor = Color(0xFF7E869B);
   static const titleAppBarMailboxListMail = Color(0xFF182952);
   static const counterMailboxColor = Color(0xFF3840F7);
-  static const backgroundCounterMailboxColor = Color(0xFFE6E5FF);
+  static const backgroundCounterMailboxColor = Color(0xFFE3E1FD);
   static const backgroundCounterMailboxSelectedColor = Color(0x17313131);
   static const bgMailboxListMail = Color(0xFFFBFBFF);
   static const bgMessenger = Color(0xFFF2F2F5);

core/lib/presentation/utils/theme_utils.dart

@@ -110,16 +110,24 @@ class ThemeUtils {
     color: color,
   );
 
-  static TextStyle textStyleBodyBody2({Color? color, FontWeight? fontWeight}) => TextStyle(
+  static TextStyle textStyleBodyBody2({
+    Color? color,
+    Color? backgroundColor,
+    FontWeight? fontWeight,
+  }) => TextStyle(
     fontFamily: ConstantsUI.fontApp,
     fontWeight: fontWeight ?? FontWeight.w400,
     letterSpacing: 0.0,
     fontSize: 15,
     height: 20 / 15,
     color: color,
+    backgroundColor: backgroundColor,
   );
 
-  static TextStyle textStyleBodyBody3({Color? color, FontWeight? fontWeight}) => TextStyle(
+  static TextStyle textStyleBodyBody3({
+    Color? color,
+    FontWeight? fontWeight,
+  }) => TextStyle(
     fontFamily: ConstantsUI.fontApp,
     fontWeight: fontWeight ?? FontWeight.w400,
     letterSpacing: 0.0,
@@ -128,7 +136,24 @@ class ThemeUtils {
     color: color,
   );
 
-  static TextStyle textStyleHeadingH6({Color? color, FontWeight? fontWeight}) => TextStyle(
+  static TextStyle textStyleBodyContact({
+    Color? color,
+    Color? backgroundColor,
+    FontWeight? fontWeight,
+  }) => TextStyle(
+    fontFamily: ConstantsUI.fontApp,
+    fontWeight: fontWeight ?? FontWeight.w600,
+    letterSpacing: 0.0,
+    fontSize: 15,
+    height: 20 / 15,
+    color: color,
+    backgroundColor: backgroundColor,
+  );
+
+  static TextStyle textStyleHeadingH6({
+    Color? color,
+    FontWeight? fontWeight,
+  }) => TextStyle(
     fontFamily: ConstantsUI.fontApp,
     fontWeight: fontWeight ?? FontWeight.w700,
     letterSpacing: 0.0,
@@ -137,6 +162,18 @@ class ThemeUtils {
     color: color,
   );
 
+  static TextStyle textStyleHeadingHeadingSmall({
+    Color? color,
+    FontWeight? fontWeight,
+  }) => TextStyle(
+    fontFamily: ConstantsUI.fontApp,
+    fontWeight: fontWeight ?? FontWeight.w500,
+    letterSpacing: 0.0,
+    fontSize: 17,
+    height: 22 / 17,
+    color: color,
+  );
+
   static TextSelectionThemeData get _textSelectionTheme {
     return const TextSelectionThemeData(
       cursorColor: AppColor.primaryColor,

core/lib/presentation/views/text/rich_text_builder.dart

@@ -4,8 +4,8 @@ class RichTextBuilder extends StatefulWidget {
 
   final String textOrigin;
   final String wordToStyle;
-  final TextStyle styleOrigin;
+  final TextStyle? styleOrigin;
-  final TextStyle styleWord;
+  final TextStyle? styleWord;
   final String? preMarkedText;
   final bool ensureHighlightVisible;
 
@@ -91,8 +91,8 @@ class _RichTextBuilderState extends State<RichTextBuilder> with AutomaticKeepAli
   List<InlineSpan> _getSpans({
     required String text,
     required String word,
-    required TextStyle styleOrigin,
+    required TextStyle? styleOrigin,
-    required TextStyle styleWord,
+    required TextStyle? styleWord,
   }) {
     if (word.isEmpty) {
       return [TextSpan(text: text, style: styleOrigin)];

lib/features/thread/presentation/mixin/base_email_item_tile.dart

@@ -1,8 +1,10 @@
 
+import 'package:core/presentation/constants/constants_ui.dart';
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
 import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:core/presentation/utils/style_utils.dart';
+import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:core/presentation/views/text/rich_text_builder.dart';
 import 'package:core/presentation/views/text/text_overflow_builder.dart';
 import 'package:core/utils/platform_info.dart';
@@ -35,19 +37,20 @@ mixin BaseEmailItemTile {
     if (hasMailboxLabel(isSearchEmailRunning, email)) {
       return Container(
           margin: const EdgeInsetsDirectional.only(start: 8),
-          padding: const EdgeInsetsDirectional.symmetric(
+          padding: const EdgeInsetsDirectional.symmetric(horizontal: 8),
-              horizontal: 8,
-              vertical: 3),
           constraints: const BoxConstraints(maxWidth: 100),
-          decoration: BoxDecoration(
+          decoration: const BoxDecoration(
-              borderRadius: BorderRadius.circular(10),
+              borderRadius: BorderRadius.all(Radius.circular(100)),
               color: AppColor.backgroundCounterMailboxColor),
           child: TextOverflowBuilder(
             email.mailboxContain?.getDisplayName(context) ?? '',
             style: const TextStyle(
-                fontSize: 10,
+              fontFamily: ConstantsUI.fontApp,
-                color: AppColor.mailboxTextColor,
+              fontSize: 10,
-                fontWeight: FontWeight.bold),
+              color: AppColor.emailMailboxContainColor,
+              height: 24 / 10,
+              fontWeight: FontWeight.w500,
+            ),
           )
       );
     } else {
@@ -88,26 +91,25 @@ mixin BaseEmailItemTile {
       return RichTextBuilder(
         textOrigin: informationSender(email, mailbox),
         wordToStyle: query?.value ?? '',
-        styleOrigin: TextStyle(
+        styleOrigin: !email.hasRead
-          fontSize: 15,
+          ? ThemeUtils.textStyleBodyContact(color: Colors.black)
-          color: buildTextColorForReadEmail(email),
+          : ThemeUtils.textStyleBodyBody2(color: AppColor.steelGray400),
-          fontWeight: buildFontForReadEmail(email)
+        styleWord: !email.hasRead
-        ),
+          ? ThemeUtils.textStyleBodyContact(
-        styleWord: TextStyle(
+              color: Colors.black,
-          fontSize: 15,
+              backgroundColor: Colors.amberAccent[200],
-          color: buildTextColorForReadEmail(email),
+            )
-          backgroundColor: Colors.amberAccent[200],
+          : ThemeUtils.textStyleBodyBody2(
-          fontWeight: buildFontForReadEmail(email)
+              color: AppColor.steelGray400,
-        )
+              backgroundColor: Colors.amberAccent[200],
+            ),
       );
     } else {
       return TextOverflowBuilder(
         informationSender(email, mailbox),
-        style: TextStyle(
+        style: !email.hasRead
-          fontSize: 15,
+          ? ThemeUtils.textStyleBodyContact(color: Colors.black)
-          overflow: CommonTextStyle.defaultTextOverFlow,
+          : ThemeUtils.textStyleBodyBody2(color: AppColor.steelGray400)
-          color: buildTextColorForReadEmail(email),
-          fontWeight: buildFontForReadEmail(email))
       );
     }
   }
@@ -124,25 +126,23 @@ mixin BaseEmailItemTile {
         wordToStyle: query?.value ?? '',
         preMarkedText: email.sanitizedSearchSnippetSubject,
         ensureHighlightVisible: true,
-        styleOrigin: TextStyle(
+        styleOrigin: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
           color: buildTextColorForReadEmail(email),
-          fontWeight: buildFontForReadEmail(email)
+          fontWeight: buildFontForReadEmail(email),
         ),
-        styleWord: TextStyle(
+        styleWord: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
           backgroundColor: Colors.amberAccent[200],
           color: buildTextColorForReadEmail(email),
-          fontWeight: buildFontForReadEmail(email)
+          fontWeight: buildFontForReadEmail(email),
-        )
+        ),
       );
     } else {
       return TextOverflowBuilder(
         email.getEmailTitle(),
-        style: TextStyle(
+        style: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
           color: buildTextColorForReadEmail(email),
-          fontWeight: buildFontForReadEmail(email))
+          fontWeight: buildFontForReadEmail(email),
+        ),
       );
     }
   }
@@ -159,24 +159,19 @@ mixin BaseEmailItemTile {
         wordToStyle: query?.value ?? '',
         preMarkedText: email.sanitizedSearchSnippetPreview,
         ensureHighlightVisible: true,
-        styleOrigin: const TextStyle(
+        styleOrigin: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
           color: AppColor.steelGray400,
-          fontWeight: FontWeight.normal
         ),
-        styleWord: TextStyle(
+        styleWord: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
-          color: AppColor.steelGray400,
           backgroundColor: Colors.amberAccent[200],
-        )
+        ),
       );
     } else {
       return TextOverflowBuilder(
         email.getPartialContent(),
-        style: const TextStyle(
+        style: Theme.of(context).textTheme.bodySmall?.copyWith(
-          fontSize: 13,
           color: AppColor.steelGray400,
-          fontWeight: FontWeight.normal)
+        )
       );
     }
   }
@@ -187,10 +182,10 @@ mixin BaseEmailItemTile {
         maxLines: 1,
         softWrap: CommonTextStyle.defaultSoftWrap,
         overflow: CommonTextStyle.defaultTextOverFlow,
-        style:  TextStyle(
+        style: Theme.of(context).textTheme.bodySmall?.copyWith(
-            fontSize: 13,
+          color: buildTextColorForReadEmail(email),
-            color: buildTextColorForReadEmail(email),
+          fontWeight: buildFontForReadEmail(email),
-            fontWeight: buildFontForReadEmail(email))
+        ),
     );
   }
 
@@ -250,11 +245,9 @@ mixin BaseEmailItemTile {
       ),
       child: Text(
         email.getAvatarText(),
-        style: textStyle ?? const TextStyle(
+        style: textStyle ?? ThemeUtils.textStyleHeadingHeadingSmall(
-          fontSize: 22,
           color: Colors.white,
-          fontWeight: FontWeight.w500
+        ),
-        )
       )
     );
   }