From a258dec4ee264dcc68b875c5b00b451a88a70a18 Mon Sep 17 00:00:00 2001 From: dab246 Date: Mon, 10 Mar 2025 02:18:34 +0700 Subject: [PATCH] TF-3410 Use `TextTheme` apply almost text style for text widget Signed-off-by: dab246 --- assets/images/ic_add_email_forwards.svg | 3 - assets/images/ic_close_dialog.svg | 3 + contact/pubspec.lock | 12 +- .../extensions/color_extension.dart | 3 +- .../extensions/string_extension.dart | 2 + .../presentation/resources/image_paths.dart | 2 +- core/lib/presentation/utils/theme_utils.dart | 113 ++- ...firmation_dialog_action_sheet_builder.dart | 17 +- .../views/dialog/confirm_dialog_button.dart | 10 +- .../dialog/confirmation_dialog_builder.dart | 741 ++++++++++-------- core/lib/utils/html/html_utils.dart | 2 +- core/pubspec.lock | 14 +- core/pubspec.yaml | 2 + .../base/base_mailbox_controller.dart | 21 +- lib/features/base/mixin/logout_mixin.dart | 14 +- .../mixin/mailbox_action_handler_mixin.dart | 89 ++- .../mixin/message_dialog_action_mixin.dart | 223 +++--- .../widget/application_version_widget.dart | 6 +- .../presentation/composer_controller.dart | 41 - .../composer_print_draft_extension.dart | 2 +- .../recipient_composer_widget_style.dart | 16 +- .../styles/subject_composer_widget_style.dart | 10 +- .../from_composer_drop_down_widget_style.dart | 6 + .../widgets/recipient_composer_widget.dart | 6 +- .../widgets/recipient_tag_item_widget.dart | 2 +- .../widgets/subject_composer_widget.dart | 7 +- .../web/from_composer_drop_down_widget.dart | 6 +- .../controller/single_email_controller.dart | 38 +- .../email_view_app_bar_widget_styles.dart | 4 - .../presentation/mailbox_controller.dart | 67 +- .../mailbox/presentation/mailbox_view.dart | 15 +- .../presentation/mailbox_view_web.dart | 11 +- .../mixin/mailbox_widget_mixin.dart | 7 +- .../widgets/copy_subaddress_widget.dart | 2 - .../widgets/user_information_widget.dart | 12 +- .../mailbox_dashboard_controller.dart | 77 +- .../mailbox_dashboard_view_web.dart | 30 +- .../widgets/compose_button_widget.dart | 7 +- .../navigation_bar/navigation_bar_widget.dart | 69 +- .../base/setting_detail_view_builder.dart | 16 +- .../email_rules/email_rules_controller.dart | 21 +- .../email_rules/email_rules_view.dart | 24 +- .../widgets/email_rules_header_widget.dart | 36 +- .../widgets/list_email_rules_widget.dart | 8 +- .../forward/forward_controller.dart | 34 +- .../presentation/forward/forward_view.dart | 160 ++-- ...complete_contact_text_field_with_tags.dart | 56 +- .../widgets/forward_header_widget.dart | 39 - .../widgets/forward_warning_banner.dart | 16 +- .../widgets/list_email_forward_widget.dart | 63 +- .../language_and_region_view.dart | 69 +- .../language_and_region_header_widget.dart | 28 - ...ailbox_visibility_interactor_bindings.dart | 2 + .../mailbox_visibility_view.dart | 12 +- .../mailbox_visibility_header_widget.dart | 34 - .../manage_account_dashboard_controller.dart | 13 +- .../manage_account_dashboard_view.dart | 42 +- .../menu/manage_account_menu_view.dart | 57 +- .../settings/settings_first_level_view.dart | 20 +- .../menu/settings/settings_view.dart | 14 +- .../presentation/menu/settings_utils.dart | 133 ++-- .../account_menu_item_tile_builder.dart | 10 +- .../presentation/model/account_menu_item.dart | 44 +- .../preferences/preferences_view.dart | 108 +-- .../widgets/setting_option_item.dart | 10 +- .../identities/identities_controller.dart | 15 +- .../profiles/identities/identities_view.dart | 8 +- .../delete_identity_dialog_builder.dart | 59 +- .../presentation/profiles/profiles_view.dart | 21 +- .../widgets/profiles_header_widget.dart | 40 - .../presentation/vacation/vacation_view.dart | 390 +++++---- .../widgets/setting_explanation_widget.dart | 27 + .../widgets/setting_header_widget.dart | 38 + .../quotas/presentation/quotas_view.dart | 18 +- .../rules_filter_creator_controller.dart | 2 +- .../sending_queue_controller.dart | 22 - .../mixin/base_email_item_tile.dart | 16 +- .../mixin/email_action_controller.dart | 24 +- .../styles/item_email_tile_styles.dart | 4 + .../widgets/email_tile_web_builder.dart | 45 +- .../controller/upload_controller.dart | 13 +- model/lib/extensions/username_extension.dart | 8 - model/lib/model.dart | 1 - model/pubspec.lock | 12 +- pubspec.lock | 2 +- pubspec.yaml | 2 - web/index.html | 2 +- 87 files changed, 1774 insertions(+), 1776 deletions(-) delete mode 100644 assets/images/ic_add_email_forwards.svg create mode 100644 assets/images/ic_close_dialog.svg delete mode 100644 lib/features/manage_account/presentation/forward/widgets/forward_header_widget.dart delete mode 100644 lib/features/manage_account/presentation/language_and_region/widgets/language_and_region_header_widget.dart delete mode 100644 lib/features/manage_account/presentation/mailbox_visibility/widgets/mailbox_visibility_header_widget.dart delete mode 100644 lib/features/manage_account/presentation/profiles/widgets/profiles_header_widget.dart create mode 100644 lib/features/manage_account/presentation/widgets/setting_explanation_widget.dart create mode 100644 lib/features/manage_account/presentation/widgets/setting_header_widget.dart delete mode 100644 model/lib/extensions/username_extension.dart diff --git a/assets/images/ic_add_email_forwards.svg b/assets/images/ic_add_email_forwards.svg deleted file mode 100644 index 438743207..000000000 --- a/assets/images/ic_add_email_forwards.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/images/ic_close_dialog.svg b/assets/images/ic_close_dialog.svg new file mode 100644 index 000000000..67b82c477 --- /dev/null +++ b/assets/images/ic_close_dialog.svg @@ -0,0 +1,3 @@ + + + diff --git a/contact/pubspec.lock b/contact/pubspec.lock index 2315887ce..78d8583a8 100644 --- a/contact/pubspec.lock +++ b/contact/pubspec.lock @@ -292,10 +292,10 @@ packages: dependency: transitive description: name: ffi - sha256: "7bf0adc28a23d395f19f3f1eb21dd7cfd1dd9f8e1c50051c069122e6853bc878" + sha256: "16ed7b077ef01ad6170a3d0c57caa4a112a38d7a2ed5602e0aca9ca6f3d98da6" url: "https://pub.dev" source: hosted - version: "2.1.0" + version: "2.1.3" file: dependency: transitive description: @@ -1273,18 +1273,18 @@ packages: dependency: transitive description: name: win32 - sha256: "5a751eddf9db89b3e5f9d50c20ab8612296e4e8db69009788d6c8b060a84191c" + sha256: a79dbe579cb51ecd6d30b17e0cae4e0ea15e2c0e66f69ad4198f22a6789e94f4 url: "https://pub.dev" source: hosted - version: "4.1.4" + version: "5.5.1" win32_registry: dependency: transitive description: name: win32_registry - sha256: "1c52f994bdccb77103a6231ad4ea331a244dbcef5d1f37d8462f713143b0bfae" + sha256: "723b7f851e5724c55409bb3d5a32b203b3afe8587eaf5dafb93a5fed8ecda0d6" url: "https://pub.dev" source: hosted - version: "1.1.0" + version: "1.1.4" xdg_directories: dependency: transitive description: diff --git a/core/lib/presentation/extensions/color_extension.dart b/core/lib/presentation/extensions/color_extension.dart index cafea1ece..991f2edba 100644 --- a/core/lib/presentation/extensions/color_extension.dart +++ b/core/lib/presentation/extensions/color_extension.dart @@ -111,7 +111,6 @@ extension AppColor on Color { static const colorBorderIdentityInfo = Color(0xFFE7E8EC); static const colorBgMailboxSelected = Color(0x99E4E8EC); static const colorLoading = Color(0x2999A2AD); - static const colorActionButtonHover = Color(0xFFA2AAB3); static const colorBgMenuItemDropDownSelected = Color(0x80DEE2E7); static const colorButtonCancelDialog = Color(0x0D000000); static const colorShadowComposerButton = Color(0x99007AFF); @@ -245,7 +244,7 @@ extension AppColor on Color { static const blue400 = Color(0xFF80BDFF); static const m3Tertiary = Color(0xFF8C9CAF); static const m3Neutral70 = Color(0xFFAEAAAE); - static const colorF3F6F9 = Color(0xFFF3F6F9); + static const grayBackgroundColor = Color(0xFFF3F6F9); static const m3SurfaceBackground = Color(0xFF1C1B1F); static const mapGradientColor = [ diff --git a/core/lib/presentation/extensions/string_extension.dart b/core/lib/presentation/extensions/string_extension.dart index cd4cd1502..375a83459 100644 --- a/core/lib/presentation/extensions/string_extension.dart +++ b/core/lib/presentation/extensions/string_extension.dart @@ -38,4 +38,6 @@ extension StringExtension on String { return ''; } } + + String get firstCharacterToUpperCase => isNotEmpty ? this[0].toUpperCase() : ''; } \ No newline at end of file diff --git a/core/lib/presentation/resources/image_paths.dart b/core/lib/presentation/resources/image_paths.dart index 83e10f612..84c3c56da 100644 --- a/core/lib/presentation/resources/image_paths.dart +++ b/core/lib/presentation/resources/image_paths.dart @@ -141,7 +141,6 @@ class ImagePaths { String get icSwitchOff => _getImagePath('ic_switch_off.svg'); String get icClock => _getImagePath('ic_clock.svg'); String get icCalendar => _getImagePath('ic_calendar.svg'); - String get icAddEmailForward => _getImagePath('ic_add_email_forwards.svg'); String get icChevronDownOutline => _getImagePath('ic_chevron_down_outline.svg'); String get icUndo => _getImagePath('ic_undo.svg'); String get icDownloadAttachment => _getImagePath('ic_download_attachment.svg'); @@ -227,6 +226,7 @@ class ImagePaths { String get icSubaddressingAllow => _getImagePath('ic_subaddressing_allow.svg'); String get icSubaddressingDisallow => _getImagePath('ic_subaddressing_disallow.svg'); String get icMarkAsImportant => _getImagePath('ic_mark_as_important.svg'); + String get icCloseDialog => _getImagePath('ic_close_dialog.svg'); String _getImagePath(String imageName) { return AssetsPaths.images + imageName; diff --git a/core/lib/presentation/utils/theme_utils.dart b/core/lib/presentation/utils/theme_utils.dart index d6bc7e4e4..389c1fae5 100644 --- a/core/lib/presentation/utils/theme_utils.dart +++ b/core/lib/presentation/utils/theme_utils.dart @@ -4,6 +4,7 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; class ThemeUtils { + ThemeUtils._(); static ThemeData get appTheme { return ThemeData( @@ -23,11 +24,119 @@ class ThemeUtils { static TextTheme get _textTheme { return const TextTheme( - bodyMedium: TextStyle(color: AppColor.baseTextColor), - bodySmall: TextStyle(color: AppColor.baseTextColor), + bodyLarge: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: -0.15, + fontSize: 17, + height: 24 / 17, + ), + bodyMedium: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: 0.25, + ), + bodySmall: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w400, + letterSpacing: 0.0, + fontSize: 13, + height: 16 / 13 + ), + labelLarge: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: 0.1, + ), + labelSmall: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: 0.5, + ), + displayLarge: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w700, + ), + displayMedium: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + letterSpacing: 0.4, + ), + displaySmall: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + letterSpacing: 0.4, + ), + headlineMedium: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + ), + headlineSmall: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + letterSpacing: 0.4, + ), + headlineLarge: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + fontSize: 32, + ), + titleLarge: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w600, + letterSpacing: 0.0, + fontSize: 22, + height: 28 / 22, + ), + titleMedium: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: 0.15, + ), + titleSmall: TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w500, + letterSpacing: 0.1, + ), ); } + static TextStyle textStyleBodyBody1({Color? color, FontWeight? fontWeight}) => TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: fontWeight ?? FontWeight.w500, + letterSpacing: 0.0, + fontSize: 16, + height: 20 / 16, + color: color, + ); + + static TextStyle textStyleBodyBody2({Color? color, FontWeight? fontWeight}) => TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: fontWeight ?? FontWeight.w400, + letterSpacing: 0.0, + fontSize: 15, + height: 20 / 15, + color: color, + ); + + static TextStyle textStyleBodyBody3({Color? color, FontWeight? fontWeight}) => TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: fontWeight ?? FontWeight.w400, + letterSpacing: 0.0, + fontSize: 14, + height: 18 / 14, + color: color, + ); + + static TextStyle textStyleHeadingH6({Color? color, FontWeight? fontWeight}) => TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: fontWeight ?? FontWeight.w700, + letterSpacing: 0.0, + fontSize: 20, + height: 24 / 20, + color: color, + ); + static TextSelectionThemeData get _textSelectionTheme { return const TextSelectionThemeData( cursorColor: AppColor.primaryColor, diff --git a/core/lib/presentation/views/bottom_popup/confirmation_dialog_action_sheet_builder.dart b/core/lib/presentation/views/bottom_popup/confirmation_dialog_action_sheet_builder.dart index 2698acb26..178153400 100644 --- a/core/lib/presentation/views/bottom_popup/confirmation_dialog_action_sheet_builder.dart +++ b/core/lib/presentation/views/bottom_popup/confirmation_dialog_action_sheet_builder.dart @@ -66,7 +66,10 @@ class ConfirmationDialogActionSheetBuilder { child: Text( _messageText ?? '', textAlign: TextAlign.center, - style: _styleMessage ?? const TextStyle(fontSize: 14, color: AppColor.colorMessageConfirmDialog)), + style: _styleMessage ?? Theme.of(context).textTheme.bodyLarge?.copyWith( + color: AppColor.steelGrayA540, + ), + ), onPressed: () => {}, ), ) @@ -79,7 +82,9 @@ class ConfirmationDialogActionSheetBuilder { cursor: PlatformInfo.isWeb ? WidgetStateMouseCursor.clickable : MouseCursor.defer, child: CupertinoActionSheetAction( child: RichText(text: TextSpan( - style: _styleMessage ?? const TextStyle(fontSize: 14, color: AppColor.colorMessageConfirmDialog), + style: _styleMessage ?? Theme.of(context).textTheme.bodyLarge?.copyWith( + color: AppColor.steelGrayA540, + ), children: listTextSpan )), onPressed: () => {}, @@ -93,7 +98,9 @@ class ConfirmationDialogActionSheetBuilder { child: CupertinoActionSheetAction( child: Text( _confirmText ?? '', - style: _styleConfirmButton ?? const TextStyle(fontWeight: FontWeight.w500, fontSize: 20, color: AppColor.colorActionDeleteConfirmDialog)), + style: _styleConfirmButton ?? Theme.of(context).textTheme.bodyLarge?.copyWith( + color: AppColor.steelGray600, + )), onPressed: () => _onConfirmActionClick?.call(), ), ) @@ -104,7 +111,9 @@ class ConfirmationDialogActionSheetBuilder { child: CupertinoActionSheetAction( child: Text( _cancelText ?? '', - style: _styleCancelButton ?? const TextStyle(fontWeight: FontWeight.w500, fontSize: 20, color: AppColor.colorActionCancelDialog)), + style: _styleCancelButton ?? Theme.of(context).textTheme.bodyLarge?.copyWith( + color: Colors.white, + )), onPressed: () => _onCancelActionClick?.call(), ), ), diff --git a/core/lib/presentation/views/dialog/confirm_dialog_button.dart b/core/lib/presentation/views/dialog/confirm_dialog_button.dart index bc53f3c6e..817325f0f 100644 --- a/core/lib/presentation/views/dialog/confirm_dialog_button.dart +++ b/core/lib/presentation/views/dialog/confirm_dialog_button.dart @@ -8,17 +8,19 @@ class ConfirmDialogButton extends StatelessWidget { final Color backgroundColor; final EdgeInsetsGeometry? padding; final int? maxLines; - final TextStyle textStyle; + final TextStyle? textStyle; + final Color? textColor; final VoidCallback? onTapAction; const ConfirmDialogButton({ super.key, required this.label, - required this.textStyle, required this.backgroundColor, + this.textStyle, this.borderRadius, this.padding, this.maxLines, + this.textColor, this.onTapAction }); @@ -45,7 +47,9 @@ class ConfirmDialogButton extends StatelessWidget { textAlign: TextAlign.center, maxLines: maxLines, overflow: TextOverflow.ellipsis, - style: textStyle + style: textStyle ?? Theme.of(context).textTheme.bodyLarge?.copyWith( + color: textColor, + ) ), ), ), diff --git a/core/lib/presentation/views/dialog/confirmation_dialog_builder.dart b/core/lib/presentation/views/dialog/confirmation_dialog_builder.dart index c31d9cd59..a86e8195f 100644 --- a/core/lib/presentation/views/dialog/confirmation_dialog_builder.dart +++ b/core/lib/presentation/views/dialog/confirmation_dialog_builder.dart @@ -1,5 +1,6 @@ - -import 'package:core/core.dart'; +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/resources/image_paths.dart'; +import 'package:core/presentation/views/button/tmail_button_widget.dart'; import 'package:core/presentation/views/dialog/confirm_dialog_button.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; @@ -8,354 +9,436 @@ typedef OnConfirmButtonAction = void Function(); typedef OnCancelButtonAction = void Function(); typedef OnCloseButtonAction = void Function(); -class ConfirmDialogBuilder { - final ImagePaths _imagePath; - - Key? _key; - String _title = ''; - String _textContent = ''; - String _confirmText = ''; - String _cancelText = ''; - Widget? _iconWidget; - Widget? _additionalWidgetContent; - Color? _colorCancelButton; - Color? _colorConfirmButton; - TextStyle? _styleTextCancelButton; - TextStyle? _styleTextConfirmButton; - TextStyle? _styleTitle; - TextStyle? _styleContent; - double? _radiusButton; - EdgeInsetsGeometry? _paddingTitle; - EdgeInsets? _paddingContent; - EdgeInsetsGeometry? _paddingButton; - EdgeInsets? _marginButton; - EdgeInsets? _outsideDialogPadding; - EdgeInsetsGeometry? _marginIcon; - EdgeInsets? _margin; - double? _widthDialog; - final double maxWith; - Alignment? _alignment; - Color? _backgroundColor; +class ConfirmationDialogBuilder extends StatelessWidget { + final ImagePaths imagePath; + final String title; + final String textContent; + final String confirmText; + final String cancelText; + final Widget? iconWidget; + final Widget? additionalWidgetContent; + final Color? colorCancelButton; + final Color? colorConfirmButton; + final TextStyle? styleTextCancelButton; + final TextStyle? styleTextConfirmButton; + final TextStyle? styleTitle; + final TextStyle? styleContent; + final double? radiusButton; + final EdgeInsetsGeometry? paddingTitle; + final EdgeInsetsGeometry? paddingContent; + final EdgeInsetsGeometry? paddingButton; + final EdgeInsetsGeometry? marginButton; + final EdgeInsets? outsideDialogPadding; + final EdgeInsetsGeometry? marginIcon; + final EdgeInsetsGeometry? margin; + final double? widthDialog; + final double maxWidth; + final Alignment? alignment; + final Color? backgroundColor; final bool showAsBottomSheet; final List? listTextSpan; final int? titleActionButtonMaxLines; final bool isArrangeActionButtonsVertical; final bool useIconAsBasicLogo; + final OnConfirmButtonAction? onConfirmButtonAction; + final OnCancelButtonAction? onCancelButtonAction; + final OnCloseButtonAction? onCloseButtonAction; - OnConfirmButtonAction? _onConfirmButtonAction; - OnCancelButtonAction? _onCancelButtonAction; - OnCloseButtonAction? _onCloseButtonAction; + const ConfirmationDialogBuilder({ + super.key, + required this.imagePath, + this.title = '', + this.textContent = '', + this.confirmText = '', + this.cancelText = '', + this.iconWidget, + this.additionalWidgetContent, + this.colorCancelButton, + this.colorConfirmButton, + this.styleTextCancelButton, + this.styleTextConfirmButton, + this.styleTitle, + this.styleContent, + this.radiusButton, + this.paddingTitle, + this.paddingContent, + this.paddingButton, + this.marginButton, + this.outsideDialogPadding, + this.marginIcon, + this.margin, + this.widthDialog, + this.maxWidth = double.infinity, + this.alignment, + this.backgroundColor, + this.showAsBottomSheet = false, + this.listTextSpan, + this.titleActionButtonMaxLines, + this.isArrangeActionButtonsVertical = false, + this.useIconAsBasicLogo = false, + this.onConfirmButtonAction, + this.onCancelButtonAction, + this.onCloseButtonAction, + }); - ConfirmDialogBuilder( - this._imagePath, - { - this.showAsBottomSheet = false, - this.listTextSpan, - this.maxWith = double.infinity, - this.titleActionButtonMaxLines, - this.isArrangeActionButtonsVertical = false, - this.useIconAsBasicLogo = false, + @override + Widget build(BuildContext context) { + return showAsBottomSheet + ? _BodyContent( + imagePath: imagePath, + title: title, + textContent: textContent, + confirmText: confirmText, + cancelText: cancelText, + iconWidget: iconWidget, + additionalWidgetContent: additionalWidgetContent, + colorCancelButton: colorCancelButton, + colorConfirmButton: colorConfirmButton, + styleTextCancelButton: styleTextCancelButton, + styleTextConfirmButton: styleTextConfirmButton, + styleTitle: styleTitle, + styleContent: styleContent, + radiusButton: radiusButton, + paddingTitle: paddingTitle, + paddingContent: paddingContent, + paddingButton: paddingButton, + marginButton: marginButton, + marginIcon: marginIcon, + margin: margin, + widthDialog: widthDialog, + maxWidth: maxWidth, + listTextSpan: listTextSpan, + titleActionButtonMaxLines: titleActionButtonMaxLines, + isArrangeActionButtonsVertical: isArrangeActionButtonsVertical, + useIconAsBasicLogo: useIconAsBasicLogo, + onConfirmButtonAction: onConfirmButtonAction, + onCancelButtonAction: onCancelButtonAction, + onCloseButtonAction: onCloseButtonAction, + ) + : Dialog( + shape: const RoundedRectangleBorder( + borderRadius: BorderRadius.all(Radius.circular(18))), + insetPadding: outsideDialogPadding, + alignment: alignment ?? Alignment.center, + backgroundColor: backgroundColor, + child: _BodyContent( + imagePath: imagePath, + title: title, + textContent: textContent, + confirmText: confirmText, + cancelText: cancelText, + iconWidget: iconWidget, + additionalWidgetContent: additionalWidgetContent, + colorCancelButton: colorCancelButton, + colorConfirmButton: colorConfirmButton, + styleTextCancelButton: styleTextCancelButton, + styleTextConfirmButton: styleTextConfirmButton, + styleTitle: styleTitle, + styleContent: styleContent, + radiusButton: radiusButton, + paddingTitle: paddingTitle, + paddingContent: paddingContent, + paddingButton: paddingButton, + marginButton: marginButton, + marginIcon: marginIcon, + margin: margin, + widthDialog: widthDialog, + maxWidth: maxWidth, + listTextSpan: listTextSpan, + titleActionButtonMaxLines: titleActionButtonMaxLines, + isArrangeActionButtonsVertical: isArrangeActionButtonsVertical, + useIconAsBasicLogo: useIconAsBasicLogo, + onConfirmButtonAction: onConfirmButtonAction, + onCancelButtonAction: onCancelButtonAction, + onCloseButtonAction: onCloseButtonAction, + ), + ); + } +} + +class _BodyContent extends StatelessWidget { + final ImagePaths imagePath; + final String title; + final String textContent; + final String confirmText; + final String cancelText; + final Widget? iconWidget; + final Widget? additionalWidgetContent; + final Color? colorCancelButton; + final Color? colorConfirmButton; + final TextStyle? styleTextCancelButton; + final TextStyle? styleTextConfirmButton; + final TextStyle? styleTitle; + final TextStyle? styleContent; + final double? radiusButton; + final EdgeInsetsGeometry? paddingTitle; + final EdgeInsetsGeometry? paddingContent; + final EdgeInsetsGeometry? paddingButton; + final EdgeInsetsGeometry? marginButton; + final EdgeInsetsGeometry? marginIcon; + final EdgeInsetsGeometry? margin; + final double? widthDialog; + final double maxWidth; + final List? listTextSpan; + final int? titleActionButtonMaxLines; + final bool isArrangeActionButtonsVertical; + final bool useIconAsBasicLogo; + final OnConfirmButtonAction? onConfirmButtonAction; + final OnCancelButtonAction? onCancelButtonAction; + final OnCloseButtonAction? onCloseButtonAction; + + const _BodyContent({ + required this.imagePath, + required this.title, + required this.textContent, + required this.confirmText, + required this.cancelText, + this.iconWidget, + this.additionalWidgetContent, + this.colorCancelButton, + this.colorConfirmButton, + this.styleTextCancelButton, + this.styleTextConfirmButton, + this.styleTitle, + this.styleContent, + this.radiusButton, + this.paddingTitle, + this.paddingContent, + this.paddingButton, + this.marginButton, + this.marginIcon, + this.margin, + this.widthDialog, + required this.maxWidth, + this.listTextSpan, + this.titleActionButtonMaxLines, + required this.isArrangeActionButtonsVertical, + required this.useIconAsBasicLogo, + this.onConfirmButtonAction, + this.onCancelButtonAction, + this.onCloseButtonAction, + }); + + @override + Widget build(BuildContext context) { + return Container( + width: widthDialog ?? 400, + constraints: BoxConstraints(maxWidth: maxWidth), + decoration: const BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.all(Radius.circular(18)), + ), + margin: margin, + padding: const EdgeInsetsDirectional.only( + top: 11, + end: 11, + start: 16, + bottom: 24, + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + _buildCloseButton(), + _buildIcon(), + _buildTitle(context), + _buildContent(context), + _buildAdditionalContent(), + _buildActionButtons(context), + ].where((widget) => widget != const SizedBox.shrink()).toList(), + ), + ); + } + + Widget _buildCloseButton() { + return onCloseButtonAction != null + ? Align( + alignment: AlignmentDirectional.topEnd, + child: TMailButtonWidget.fromIcon( + icon: imagePath.icCloseDialog, + iconSize: 29, + iconColor: AppColor.steelGrayA540, + padding: const EdgeInsets.all(5), + backgroundColor: Colors.transparent, + onTapActionCallback: onCloseButtonAction, + ), + ) + : const SizedBox(height: 24); + } + + Widget _buildIcon() { + if (useIconAsBasicLogo) { + return Padding( + padding: const EdgeInsets.all(20), + child: SvgPicture.asset( + imagePath.icTMailLogo, + fit: BoxFit.fill, + width: 50, + height: 50, + ), + ); + } else if (iconWidget != null) { + return Container( + margin: marginIcon ?? EdgeInsets.zero, + alignment: Alignment.center, + child: iconWidget, + ); } - ); - - void key(Key key) { - _key = key; + return const SizedBox.shrink(); } - void title(String title) { - _title = title; + Widget _buildTitle(BuildContext context) { + return title.trim().isNotEmpty + ? Padding( + padding: paddingTitle ?? + const EdgeInsetsDirectional.only(top: 16, end: 5), + child: Center( + child: Text( + title, + textAlign: TextAlign.center, + style: styleTitle ?? + Theme.of(context).textTheme.titleLarge?.copyWith( + color: AppColor.m3SurfaceBackground, + ), + ), + ), + ) + : const SizedBox.shrink(); } - void content(String content) { - _textContent = content; + Widget _buildContent(BuildContext context) { + if (textContent.trim().isNotEmpty) { + return Padding( + padding: + paddingContent ?? const EdgeInsetsDirectional.only(top: 16, end: 5), + child: Center( + child: Text( + textContent, + textAlign: TextAlign.center, + style: styleContent ?? + Theme.of(context).textTheme.bodyLarge?.copyWith( + color: AppColor.steelGrayA540, + ), + ), + ), + ); + } else if (listTextSpan != null) { + return Padding( + padding: + paddingContent ?? const EdgeInsetsDirectional.only(top: 16, end: 5), + child: Center( + child: RichText( + textAlign: TextAlign.center, + text: TextSpan( + style: styleContent ?? + Theme.of(context).textTheme.bodyLarge?.copyWith( + color: AppColor.steelGrayA540, + ), + children: listTextSpan, + ), + ), + ), + ); + } + return const SizedBox.shrink(); } - void addWidgetContent(Widget? icon) { - _additionalWidgetContent = icon; + Widget _buildAdditionalContent() { + return additionalWidgetContent != null + ? Padding( + padding: const EdgeInsetsDirectional.only(top: 16, end: 5), + child: additionalWidgetContent!, + ) + : const SizedBox.shrink(); } - void addIcon(Widget? icon) { - _iconWidget = icon; - } - - void colorCancelButton(Color? color) { - _colorCancelButton = color; - } - - void colorConfirmButton(Color? color) { - _colorConfirmButton = color; - } - - void styleTextCancelButton(TextStyle? style) { - _styleTextCancelButton = style; - } - - void styleTextConfirmButton(TextStyle? style) { - _styleTextConfirmButton = style; - } - - void styleTitle(TextStyle? style) { - _styleTitle = style; - } - - void styleContent(TextStyle? style) { - _styleContent = style; - } - - void radiusButton(double? radius) { - _radiusButton = radius; - } - - void paddingTitle(EdgeInsetsGeometry? value) { - _paddingTitle = value; - } - - void paddingContent(EdgeInsets? value) { - _paddingContent = value; - } - - void paddingButton(EdgeInsetsGeometry? value) { - _paddingButton = value; - } - - void marginButton(EdgeInsets? value) { - _marginButton = value; - } - - void marginIcon(EdgeInsetsGeometry? value) { - _marginIcon = value; - } - - void margin(EdgeInsets? value) { - _margin = value; - } - - void widthDialog(double? value) { - _widthDialog = value; - } - - void alignment(Alignment? alignment) { - _alignment = alignment; - } - - void outsideDialogPadding(EdgeInsets? value) { - _outsideDialogPadding = value; - } - - void backgroundColor(Color value) { - _backgroundColor = value; - } - - void onConfirmButtonAction(String confirmText, OnConfirmButtonAction? onConfirmButtonAction) { - _confirmText = confirmText; - _onConfirmButtonAction = onConfirmButtonAction; - } - - void onCancelButtonAction(String cancelText, OnCancelButtonAction? onCancelButtonAction) { - _cancelText = cancelText; - _onCancelButtonAction = onCancelButtonAction; - } - - void onCloseButtonAction(OnCloseButtonAction? onCloseButtonAction) { - _onCloseButtonAction = onCloseButtonAction; - } - - Widget build() { - if (showAsBottomSheet) { - return _bodyContent(); + Widget _buildActionButtons(BuildContext context) { + if (isArrangeActionButtonsVertical) { + return Padding( + padding: marginButton ?? + const EdgeInsetsDirectional.only(start: 15, end: 20), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + if (cancelText.isNotEmpty) + Padding( + padding: const EdgeInsetsDirectional.only(top: 16), + child: _buildButton( + context, + cancelText, + onCancelButtonAction, + colorCancelButton, + styleTextCancelButton, + ), + ), + if (confirmText.isNotEmpty) + Padding( + padding: const EdgeInsetsDirectional.only(top: 16), + child: _buildButton( + context, + confirmText, + onConfirmButtonAction, + colorConfirmButton, + styleTextConfirmButton, + ), + ), + ], + ), + ); } else { - return Dialog( - key: _key, - shape: const RoundedRectangleBorder( - borderRadius: BorderRadius.all(Radius.circular(18))), - insetPadding: _outsideDialogPadding, - alignment: _alignment ?? Alignment.center, - backgroundColor: _backgroundColor, - child: _bodyContent(), + return Padding( + padding: marginButton ?? + const EdgeInsetsDirectional.only(top: 16, start: 15, end: 20), + child: Row( + children: [ + if (cancelText.isNotEmpty) + Expanded( + child: _buildButton( + context, + cancelText, + onCancelButtonAction, + colorCancelButton, + styleTextCancelButton, + ), + ), + if (confirmText.isNotEmpty && cancelText.isNotEmpty) + const SizedBox(width: 16), + if (confirmText.isNotEmpty) + Expanded( + child: _buildButton( + context, + confirmText, + onConfirmButtonAction, + colorConfirmButton, + styleTextConfirmButton, + ), + ), + ], + ), ); } } - Widget _bodyContent() { - return Container( - width: _widthDialog ?? 400, - constraints: BoxConstraints(maxWidth: maxWith), - decoration: const BoxDecoration( - color: Colors.white, - borderRadius: BorderRadius.all(Radius.circular(18)), - ), - margin: _margin, - padding: const EdgeInsetsDirectional.only( - top: 8, - end: 8, - start: 16, - bottom: 24, - ), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - if (_onCloseButtonAction != null) - Align( - alignment: AlignmentDirectional.topEnd, - child: TMailButtonWidget.fromIcon( - icon: _imagePath.icCancel, - iconSize: 24, - iconColor: AppColor.steelGrayA540, - padding: const EdgeInsets.all(5), - backgroundColor: Colors.transparent, - onTapActionCallback: _onCloseButtonAction, - ), - ) - else - const SizedBox(height: 24), - if (useIconAsBasicLogo) - SvgPicture.asset( - _imagePath.icTMailLogo, - fit: BoxFit.fill, - width: 70, - height: 70, - ) - else if (_iconWidget != null) - Container( - margin: _marginIcon ?? EdgeInsets.zero, - alignment: Alignment.center, - child: _iconWidget, - ), - if (_title.isNotEmpty) - Padding( - padding: _paddingTitle - ?? const EdgeInsetsDirectional.only(top: 16, end: 8,), - child: Center( - child: Text( - _title, - textAlign: TextAlign.center, - style: _styleTitle ?? const TextStyle( - fontSize: 22.0, - color: AppColor.m3SurfaceBackground, - fontWeight: FontWeight.w600, - ) - ) - ) - ), - if (_textContent.isNotEmpty) - Padding( - padding: _paddingContent - ?? const EdgeInsetsDirectional.only(top: 16, end: 8,), - child: Center( - child: Text( - _textContent, - textAlign: TextAlign.center, - style: _styleContent ?? const TextStyle( - fontSize: 17.0, - color: AppColor.steelGrayA540, - fontWeight: FontWeight.w500, - ), - ), - ), - ) - else if (listTextSpan != null) - Padding( - padding: _paddingContent ?? - const EdgeInsetsDirectional.only(top: 16, end: 8,), - child: Center( - child: RichText( - textAlign: TextAlign.center, - text: TextSpan( - style: _styleContent ?? const TextStyle( - fontSize: 17.0, - color: AppColor.steelGrayA540, - fontWeight: FontWeight.w500, - ), - children: listTextSpan, - ), - ), - ), - ), - if (_additionalWidgetContent != null) - Padding( - padding:const EdgeInsetsDirectional.only(top: 16, end: 8,), - child: _additionalWidgetContent, - ), - if (isArrangeActionButtonsVertical) - ...[ - if (_cancelText.isNotEmpty) - Padding( - padding: const EdgeInsetsDirectional.only(top: 16, end: 8,), - child: ConfirmDialogButton( - label: _cancelText, - backgroundColor: _colorCancelButton ?? AppColor.blue700, - borderRadius: _radiusButton, - textStyle: _styleTextCancelButton ?? const TextStyle( - fontSize: 17, - height: 24 / 17, - fontWeight: FontWeight.w500, - color: Colors.white, - ), - padding: _paddingButton, - maxLines: titleActionButtonMaxLines, - onTapAction: _onCancelButtonAction), - ), - if (_confirmText.isNotEmpty) - Padding( - padding: const EdgeInsetsDirectional.only(top: 16, end: 8), - child: ConfirmDialogButton( - label: _confirmText, - backgroundColor: _colorConfirmButton ?? AppColor.colorF3F6F9, - borderRadius: _radiusButton, - textStyle: _styleTextConfirmButton ?? const TextStyle( - fontSize: 17, - height: 24 / 17, - fontWeight: FontWeight.w500, - color: AppColor.steelGray600, - ), - padding: _paddingButton, - maxLines: titleActionButtonMaxLines, - onTapAction: _onConfirmButtonAction), - ), - ] - else - Padding( - padding: _marginButton - ?? const EdgeInsetsDirectional.only(top: 16, end: 8), - child: Row( - children: [ - if (_cancelText.isNotEmpty) - Expanded(child: ConfirmDialogButton( - label: _cancelText, - backgroundColor: _colorCancelButton ?? AppColor.blue700, - borderRadius: _radiusButton, - textStyle: _styleTextCancelButton ?? const TextStyle( - fontSize: 17, - height: 24 / 17, - fontWeight: FontWeight.w500, - color: Colors.white, - ), - padding: _paddingButton, - maxLines: titleActionButtonMaxLines, - onTapAction: _onCancelButtonAction, - )), - if (_confirmText.isNotEmpty && _cancelText.isNotEmpty) - const SizedBox(width: 16), - if (_confirmText.isNotEmpty) - Expanded(child: ConfirmDialogButton( - label: _confirmText, - backgroundColor: _colorConfirmButton ?? AppColor.colorF3F6F9, - borderRadius: _radiusButton, - textStyle: _styleTextConfirmButton ?? const TextStyle( - fontSize: 17, - height: 24 / 17, - fontWeight: FontWeight.w500, - color: AppColor.steelGray600, - ), - padding: _paddingButton, - maxLines: titleActionButtonMaxLines, - onTapAction: _onConfirmButtonAction, - )) - ], - ), - ) - ], - ), + Widget _buildButton( + BuildContext context, + String label, + VoidCallback? onTapAction, + Color? bgColor, + TextStyle? textStyle, + ) { + return ConfirmDialogButton( + label: label, + backgroundColor: bgColor ?? + (onTapAction == onConfirmButtonAction + ? AppColor.grayBackgroundColor + : AppColor.blue700), + borderRadius: radiusButton, + textStyle: textStyle, + padding: paddingButton, + textColor: onTapAction == onConfirmButtonAction + ? AppColor.steelGray600 + : Colors.white, + maxLines: titleActionButtonMaxLines, + onTapAction: onTapAction, ); } } diff --git a/core/lib/utils/html/html_utils.dart b/core/lib/utils/html/html_utils.dart index 7fed3a0bd..4bc132aa0 100644 --- a/core/lib/utils/html/html_utils.dart +++ b/core/lib/utils/html/html_utils.dart @@ -126,7 +126,7 @@ class HtmlUtils { ${useDefaultFont && PlatformInfo.isMobile - ? '' + ? '' : ''}