TF-3765 Change dialog style

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

core/lib/presentation/utils/theme_utils.dart

@@ -249,7 +249,16 @@ class ThemeUtils {
     letterSpacing: 0.1,
     fontSize: 14,
     height: 20 / 14,
-    color: color ??AppColor.primaryMain,
+    color: color ?? AppColor.primaryMain,
+  );
+
+  static const TextStyle textStyleM3BodyMedium1 = TextStyle(
+    fontFamily: ConstantsUI.fontApp,
+    fontWeight: FontWeight.w400,
+    letterSpacing: -0.15,
+    fontSize: 16,
+    height: 24 / 16,
+    color: AppColor.textPrimary,
   );
 
   static TextStyle textStyleAppShortcut() => const TextStyle(

core/lib/presentation/views/bottom_popup/confirmation_dialog_action_sheet_builder.dart

@@ -1,5 +1,6 @@
 
 import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:core/utils/platform_info.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
@@ -19,7 +20,6 @@ class ConfirmationDialogActionSheetBuilder {
   OnCancelActionClick? _onCancelActionClick;
   TextStyle? _styleConfirmButton;
   TextStyle? _styleCancelButton;
-  TextStyle? _styleMessage;
   List<TextSpan>? listTextSpan;
 
   ConfirmationDialogActionSheetBuilder(this._context, {this.listTextSpan});
@@ -38,10 +38,6 @@ class ConfirmationDialogActionSheetBuilder {
     _messageText = message;
   }
 
-  void styleMessage(TextStyle? style) {
-    _styleMessage = style;
-  }
-
   void styleConfirmButton(TextStyle? style) {
     _styleConfirmButton = style;
   }
@@ -66,9 +62,7 @@ class ConfirmationDialogActionSheetBuilder {
                     child: Text(
                         _messageText ?? '',
                         textAlign: TextAlign.center,
-                        style: _styleMessage ?? Theme.of(context).textTheme.bodyLarge?.copyWith(
-                          color: AppColor.steelGrayA540,
-                        ),
+                        style: ThemeUtils.textStyleM3BodyMedium1,
                     ),
                     onPressed: () => {},
                   ),
@@ -82,9 +76,7 @@ class ConfirmationDialogActionSheetBuilder {
                 cursor: PlatformInfo.isWeb ? WidgetStateMouseCursor.clickable : MouseCursor.defer,
                 child: CupertinoActionSheetAction(
                   child: RichText(text: TextSpan(
-                    style: _styleMessage ?? Theme.of(context).textTheme.bodyLarge?.copyWith(
-                      color: AppColor.steelGrayA540,
-                    ),
+                    style: ThemeUtils.textStyleM3BodyMedium1,
                     children: listTextSpan
                   )),
                   onPressed: () => {},

core/lib/presentation/views/dialog/confirm_dialog_button.dart

@@ -1,57 +1,37 @@
-
+import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:flutter/material.dart';
 
 class ConfirmDialogButton extends StatelessWidget {
-
   final String label;
-  final double? borderRadius;
-  final Color backgroundColor;
-  final EdgeInsetsGeometry? padding;
-  final int? maxLines;
-  final TextStyle? textStyle;
+  final Color? backgroundColor;
   final Color? textColor;
   final VoidCallback? onTapAction;
 
   const ConfirmDialogButton({
     super.key,
     required this.label,
-    required this.backgroundColor,
-    this.textStyle,
-    this.borderRadius,
-    this.padding,
-    this.maxLines,
+    this.backgroundColor,
     this.textColor,
-    this.onTapAction
+    this.onTapAction,
   });
 
   @override
   Widget build(BuildContext context) {
-    return Material(
-      type: MaterialType.transparency,
-      child: InkWell(
-        onTap: onTapAction,
-        borderRadius: BorderRadius.all(Radius.circular(borderRadius ?? 10)),
-        child: Container(
-          width: double.infinity,
-          height: maxLines == 1 ? 44 : null,
-          decoration: BoxDecoration(
-            color: backgroundColor,
-            borderRadius: BorderRadius.all(Radius.circular(borderRadius ?? 10)),
-          ),
-          alignment: Alignment.center,
-          padding: maxLines == 1
-            ? const EdgeInsets.symmetric(horizontal: 8)
-            : padding ?? const EdgeInsets.symmetric(horizontal: 8, vertical: 12),
-          child: Text(
-            label,
-            textAlign: TextAlign.center,
-            maxLines: maxLines,
-            overflow: TextOverflow.ellipsis,
-            style: textStyle ?? Theme.of(context).textTheme.bodyLarge?.copyWith(
-              color: textColor,
-            )
-          ),
+    return TextButton(
+      style: TextButton.styleFrom(
+        backgroundColor: backgroundColor,
+        overlayColor: Theme.of(context).colorScheme.outline.withOpacity(0.08),
+        shape: const RoundedRectangleBorder(
+          borderRadius: BorderRadius.all(Radius.circular(100)),
         ),
+        padding: const EdgeInsets.symmetric(horizontal: 10),
+      ),
+      onPressed: onTapAction,
+      child: Text(
+        label,
+        style: ThemeUtils.textStyleM3LabelLarge(color: textColor),
+        maxLines: 1,
+        overflow: TextOverflow.ellipsis,
       ),
     );
   }

core/lib/presentation/views/dialog/confirmation_dialog_builder.dart

@@ -1,5 +1,6 @@
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
+import 'package:core/presentation/utils/theme_utils.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';
@@ -23,23 +24,12 @@ class ConfirmationDialogBuilder extends StatelessWidget {
   final Color? confirmLabelButtonColor;
   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<TextSpan>? listTextSpan;
-  final int? titleActionButtonMaxLines;
   final bool isArrangeActionButtonsVertical;
   final bool useIconAsBasicLogo;
   final OnConfirmButtonAction? onConfirmButtonAction;
@@ -61,25 +51,14 @@ class ConfirmationDialogBuilder extends StatelessWidget {
     this.confirmLabelButtonColor,
     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 = true,
+    this.useIconAsBasicLogo = false,
     this.onConfirmButtonAction,
     this.onCancelButtonAction,
     this.onCloseButtonAction,
@@ -100,21 +79,9 @@ class ConfirmationDialogBuilder extends StatelessWidget {
             confirmBackgroundButtonColor: confirmBackgroundButtonColor,
             cancelLabelButtonColor: cancelLabelButtonColor,
             confirmLabelButtonColor: confirmLabelButtonColor,
-            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,
@@ -123,10 +90,11 @@ class ConfirmationDialogBuilder extends StatelessWidget {
           )
         : Dialog(
             shape: const RoundedRectangleBorder(
-                borderRadius: BorderRadius.all(Radius.circular(18))),
+              borderRadius: BorderRadius.all(Radius.circular(16)),
+            ),
             insetPadding: outsideDialogPadding,
             alignment: alignment ?? Alignment.center,
-            backgroundColor: backgroundColor,
+            backgroundColor: Colors.white,
             child: _BodyContent(
               imagePath: imagePath,
               title: title,
@@ -139,21 +107,9 @@ class ConfirmationDialogBuilder extends StatelessWidget {
               confirmBackgroundButtonColor: confirmBackgroundButtonColor,
               cancelLabelButtonColor: cancelLabelButtonColor,
               confirmLabelButtonColor: confirmLabelButtonColor,
-              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,
@@ -176,21 +132,9 @@ class _BodyContent extends StatelessWidget {
   final Color? confirmBackgroundButtonColor;
   final Color? cancelLabelButtonColor;
   final Color? confirmLabelButtonColor;
-  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<TextSpan>? listTextSpan;
-  final int? titleActionButtonMaxLines;
   final bool isArrangeActionButtonsVertical;
   final bool useIconAsBasicLogo;
   final OnConfirmButtonAction? onConfirmButtonAction;
@@ -209,21 +153,9 @@ class _BodyContent extends StatelessWidget {
     this.confirmBackgroundButtonColor,
     this.cancelLabelButtonColor,
     this.confirmLabelButtonColor,
-    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,
@@ -234,47 +166,55 @@ class _BodyContent extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Container(
-      width: widthDialog ?? 400,
+      width: 421,
       constraints: BoxConstraints(maxWidth: maxWidth),
       decoration: const BoxDecoration(
         color: Colors.white,
-        borderRadius: BorderRadius.all(Radius.circular(18)),
+        borderRadius: BorderRadius.all(Radius.circular(16)),
       ),
       margin: margin,
-      padding: const EdgeInsetsDirectional.only(
-        top: 11,
-        end: 11,
-        start: 16,
-        bottom: 24,
-      ),
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
+      child: Stack(
         children: [
-          _buildCloseButton(),
-          _buildIcon(),
-          _buildTitle(context),
-          _buildContent(context),
-          _buildAdditionalContent(),
-          _buildActionButtons(context),
-        ].where((widget) => widget != const SizedBox.shrink()).toList(),
+          Padding(
+            padding: const EdgeInsetsDirectional.only(
+              start: 32,
+              end: 32,
+              top: 24,
+              bottom: 32,
+            ),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                _buildIcon(),
+                _buildTitle(context),
+                _buildContent(context),
+                _buildAdditionalContent(),
+                _buildActionButtons(context),
+              ].where((widget) => widget != const SizedBox.shrink()).toList(),
+            ),
+          ),
+          if (_showCloseButton()) _buildCloseButton(),
+        ],
       ),
     );
   }
 
+  bool _showCloseButton() => onCloseButtonAction != null;
+
   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);
+    return PositionedDirectional(
+      top: 4,
+      end: 4,
+      child: TMailButtonWidget.fromIcon(
+        icon: imagePath.icCloseDialog,
+        iconSize: 24,
+        iconColor: AppColor.m3Tertiary,
+        padding: const EdgeInsets.all(10),
+        borderRadius: 24,
+        backgroundColor: Colors.transparent,
+        onTapActionCallback: onCloseButtonAction,
+      ),
+    );
   }
 
   Widget _buildIcon() {
@@ -289,28 +229,18 @@ class _BodyContent extends StatelessWidget {
         ),
       );
     } else if (iconWidget != null) {
-      return Container(
-        margin: marginIcon ?? EdgeInsets.zero,
-        alignment: Alignment.center,
-        child: iconWidget,
-      );
+      return Center(child: iconWidget);
     }
     return const SizedBox.shrink();
   }
 
   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,
-                        ),
+        ? Center(
+            child: Text(
+              title,
+              style: ThemeUtils.textStyleM3HeadlineSmall.copyWith(
+                color: AppColor.textPrimary,
               ),
             ),
           )
@@ -320,33 +250,19 @@ class _BodyContent extends StatelessWidget {
   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,
-                    ),
-          ),
+        padding: const EdgeInsetsDirectional.only(top: 32),
+        child: Text(
+          textContent,
+          style: ThemeUtils.textStyleM3BodyMedium1,
         ),
       );
     } 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,
-            ),
+        padding: const EdgeInsetsDirectional.only(top: 32),
+        child: RichText(
+          text: TextSpan(
+            style: ThemeUtils.textStyleM3BodyMedium1,
+            children: listTextSpan,
           ),
         ),
       );
@@ -357,42 +273,45 @@ class _BodyContent extends StatelessWidget {
   Widget _buildAdditionalContent() {
     return additionalWidgetContent != null
         ? Padding(
-            padding: const EdgeInsetsDirectional.only(top: 16, end: 5),
+            padding: const EdgeInsetsDirectional.only(top: 16),
             child: additionalWidgetContent!,
           )
         : const SizedBox.shrink();
   }
 
   Widget _buildActionButtons(BuildContext context) {
-    if (isArrangeActionButtonsVertical) {
+    if (isArrangeActionButtonsVertical ||
+        cancelText.isEmpty ||
+        confirmText.isEmpty
+    ) {
       return Padding(
-        padding: marginButton ??
-            const EdgeInsetsDirectional.only(start: 15, end: 20),
+        padding: const EdgeInsetsDirectional.only(top: 44),
         child: Column(
           mainAxisSize: MainAxisSize.min,
           children: [
             if (cancelText.isNotEmpty)
-              Padding(
-                padding: const EdgeInsetsDirectional.only(top: 16),
-                child: _buildButton(
-                  context,
-                  cancelText,
-                  onCancelButtonAction,
-                  cancelBackgroundButtonColor,
-                  cancelLabelButtonColor,
-                  styleTextCancelButton,
+              SizedBox(
+                width: double.infinity,
+                height: 48,
+                child: ConfirmDialogButton(
+                  label: cancelText,
+                  backgroundColor: cancelBackgroundButtonColor,
+                  textColor: cancelLabelButtonColor,
+                  onTapAction: onCancelButtonAction,
                 ),
               ),
+            if (confirmText.isNotEmpty && cancelText.isNotEmpty)
+              const SizedBox(height: 8),
             if (confirmText.isNotEmpty)
-              Padding(
-                padding: const EdgeInsetsDirectional.only(top: 16),
-                child: _buildButton(
-                  context,
-                  confirmText,
-                  onConfirmButtonAction,
-                  confirmBackgroundButtonColor,
-                  confirmLabelButtonColor,
-                  styleTextConfirmButton,
+              SizedBox(
+                width: double.infinity,
+                height: 48,
+                child: ConfirmDialogButton(
+                  label: confirmText,
+                  backgroundColor: confirmBackgroundButtonColor
+                      ?? AppColor.primaryMain,
+                  textColor: confirmLabelButtonColor ?? Colors.white,
+                  onTapAction: onConfirmButtonAction,
                 ),
               ),
           ],
@@ -400,63 +319,43 @@ class _BodyContent extends StatelessWidget {
       );
     } else {
       return Padding(
-        padding: marginButton ??
-            const EdgeInsetsDirectional.only(top: 16, start: 15, end: 20),
+        padding: const EdgeInsetsDirectional.only(
+          top: 44,
+          start: 12,
+          end: 12,
+        ),
         child: Row(
+          mainAxisAlignment: MainAxisAlignment.end,
           children: [
-            if (cancelText.isNotEmpty)
-              Expanded(
-                child: _buildButton(
-                  context,
-                  cancelText,
-                  onCancelButtonAction,
-                  cancelBackgroundButtonColor,
-                  cancelLabelButtonColor,
-                  styleTextCancelButton,
+            Flexible(
+              child: Container(
+                constraints: const BoxConstraints(minWidth: 67),
+                height: 48,
+                child: ConfirmDialogButton(
+                  label: cancelText,
+                  backgroundColor: cancelBackgroundButtonColor,
+                  textColor: cancelLabelButtonColor,
+                  onTapAction: onCancelButtonAction,
                 ),
               ),
-            if (confirmText.isNotEmpty && cancelText.isNotEmpty)
-              const SizedBox(width: 16),
-            if (confirmText.isNotEmpty)
-              Expanded(
-                child: _buildButton(
-                  context,
-                  confirmText,
-                  onConfirmButtonAction,
-                  confirmBackgroundButtonColor,
-                  confirmLabelButtonColor,
-                  styleTextConfirmButton,
+            ),
+            const SizedBox(width: 8),
+            Flexible(
+              child: Container(
+                constraints: const BoxConstraints(minWidth: 135),
+                height: 48,
+                child: ConfirmDialogButton(
+                  label: confirmText,
+                  backgroundColor: confirmBackgroundButtonColor
+                      ?? AppColor.primaryMain,
+                  textColor: confirmLabelButtonColor ?? Colors.white,
+                  onTapAction: onConfirmButtonAction,
                 ),
               ),
+            ),
           ],
         ),
       );
     }
   }
-
-  Widget _buildButton(
-    BuildContext context,
-    String label,
-    VoidCallback? onTapAction,
-    Color? bgColor,
-    Color? textColor,
-    TextStyle? textStyle,
-  ) {
-    return ConfirmDialogButton(
-      label: label,
-      backgroundColor: bgColor ??
-          (onTapAction == onConfirmButtonAction
-              ? AppColor.blue700
-              : AppColor.grayBackgroundColor),
-      borderRadius: radiusButton,
-      textStyle: textStyle,
-      padding: paddingButton,
-      textColor: textColor ??
-        (onTapAction == onConfirmButtonAction
-          ? Colors.white
-          : AppColor.steelGray600),
-      maxLines: titleActionButtonMaxLines,
-      onTapAction: onTapAction,
-    );
-  }
 }

core/lib/presentation/views/dialog/edit_text_dialog_builder.dart

@@ -2,6 +2,7 @@ import 'dart:async';
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:core/presentation/views/button/tmail_button_widget.dart';
+import 'package:core/presentation/views/dialog/confirm_dialog_button.dart';
 import 'package:core/presentation/views/text/text_field_builder.dart';
 import 'package:flutter/material.dart';
 
@@ -159,58 +160,25 @@ class _EditTextDialogBuilderState extends State<EditTextDialogBuilder> {
                       mainAxisAlignment: MainAxisAlignment.end,
                       children: [
                         Flexible(
-                          child: TextButton(
-                            style: TextButton.styleFrom(
-                              overlayColor: Theme.of(context)
-                                .colorScheme
-                                .outline
-                                .withOpacity(0.08),
-                              minimumSize: const Size(67, 48),
-                              shape: const RoundedRectangleBorder(
-                                borderRadius: BorderRadius.all(
-                                  Radius.circular(100),
-                                ),
-                              ),
-                              padding: const EdgeInsets.symmetric(
-                                horizontal: 10,
-                              ),
-                            ),
-                            onPressed: _onNegativeAction,
-                            child: Text(
-                              widget.negativeText,
-                              style: ThemeUtils.textStyleM3LabelLarge(),
-                              maxLines: 1,
-                              overflow: TextOverflow.ellipsis,
+                          child: Container(
+                            constraints: const BoxConstraints(minWidth: 67),
+                            height: 48,
+                            child: ConfirmDialogButton(
+                              label: widget.negativeText,
+                              onTapAction: _onNegativeAction,
                             ),
                           ),
                         ),
                         const SizedBox(width: 8),
                         Flexible(
-                          child: TextButton(
-                            style: TextButton.styleFrom(
+                          child: Container(
+                            constraints: const BoxConstraints(minWidth: 119),
+                            height: 48,
+                            child: ConfirmDialogButton(
+                              label: widget.positiveText,
                               backgroundColor: AppColor.primaryMain,
-                              overlayColor: Theme.of(context)
-                                .colorScheme
-                                .outline
-                                .withOpacity(0.08),
-                              minimumSize: const Size(119, 48),
-                              shape: const RoundedRectangleBorder(
-                                borderRadius: BorderRadius.all(
-                                  Radius.circular(100),
-                                ),
-                              ),
-                              padding: const EdgeInsets.symmetric(
-                                horizontal: 10,
-                              ),
-                            ),
-                            onPressed: _onPositiveAction,
-                            child: Text(
-                              widget.positiveText,
-                              style: ThemeUtils.textStyleM3LabelLarge(
-                                color: Colors.white,
-                              ),
-                              maxLines: 1,
-                              overflow: TextOverflow.ellipsis,
+                              textColor: Colors.white,
+                              onTapAction: _onPositiveAction,
                             ),
                           ),
                         ),
@@ -258,13 +226,13 @@ class _EditTextDialogBuilderState extends State<EditTextDialogBuilder> {
 
   Widget _buildCloseButton() {
     return PositionedDirectional(
-      top: 0,
-      end: 0,
+      top: 4,
+      end: 4,
       child: TMailButtonWidget.fromIcon(
         icon: widget.closeIcon!,
         iconSize: 24,
         iconColor: AppColor.m3Tertiary,
-        padding: const EdgeInsets.all(12),
+        padding: const EdgeInsets.all(10),
         borderRadius: 24,
         backgroundColor: Colors.transparent,
         onTapActionCallback: widget.onCloseButtonAction,

lib/features/base/mixin/logout_mixin.dart

@@ -1,4 +1,3 @@
-import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:flutter/material.dart';
 import 'package:tmail_ui_user/features/base/mixin/message_dialog_action_mixin.dart';
@@ -19,14 +18,11 @@ mixin LogoutMixin implements MessageDialogActionMixin {
       title: appLocalizations.logoutConfirmation,
       alignCenter: true,
       outsideDismissible: false,
-      titleActionButtonMaxLines: 1,
-      messageStyle: ThemeUtils.textStyleBodyBody2(color: AppColor.steelGray400),
       listTextSpan: [
         TextSpan(text: AppLocalizations.of(context).messageConfirmationLogout),
         TextSpan(
           text: ' $userAddress',
-          style: ThemeUtils.textStyleBodyBody2(
-            color: AppColor.steelGray400,
+          style: ThemeUtils.textStyleM3BodyMedium1.copyWith(
             fontWeight: FontWeight.w700,
           ),
         ),

lib/features/base/mixin/message_dialog_action_mixin.dart

@@ -33,20 +33,13 @@ mixin MessageDialogActionMixin {
         bool usePopScope = false,
         List<TextSpan>? listTextSpan,
         Widget? icon,
-        TextStyle? titleStyle,
-        TextStyle? messageStyle,
-        TextStyle? actionStyle,
-        TextStyle? cancelStyle,
         Color? actionButtonColor,
         Color? cancelButtonColor,
         Color? cancelLabelButtonColor,
         Color? confirmLabelButtonColor,
-        EdgeInsetsGeometry? marginIcon,
-        EdgeInsetsGeometry? paddingButton,
         PopInvokedWithResultCallback? onPopInvoked,
         bool isArrangeActionButtonsVertical = false,
-        int? titleActionButtonMaxLines,
-        bool useIconAsBasicLogo = true,
+        bool useIconAsBasicLogo = false,
         EdgeInsetsGeometry? dialogMargin,
       }
   ) async {
@@ -59,7 +52,6 @@ mixin MessageDialogActionMixin {
           key: key,
           imagePath: imagePaths,
           listTextSpan: listTextSpan,
-          titleActionButtonMaxLines: titleActionButtonMaxLines,
           isArrangeActionButtonsVertical: isArrangeActionButtonsVertical,
           useIconAsBasicLogo: useIconAsBasicLogo,
           title: title ?? '',
@@ -71,12 +63,6 @@ mixin MessageDialogActionMixin {
           confirmBackgroundButtonColor: actionButtonColor,
           cancelLabelButtonColor: cancelLabelButtonColor,
           confirmLabelButtonColor: confirmLabelButtonColor,
-          styleTextCancelButton: cancelStyle,
-          styleTextConfirmButton: actionStyle,
-          styleTitle: titleStyle,
-          styleContent: messageStyle,
-          paddingButton: paddingButton,
-          marginIcon: marginIcon,
           onConfirmButtonAction: () {
             if (autoPerformPopBack) {
               popBack();
@@ -108,21 +94,15 @@ mixin MessageDialogActionMixin {
             showAsBottomSheet: true,
             listTextSpan: listTextSpan,
             maxWidth: responsiveUtils.getSizeScreenShortestSide(context) - 16,
-            titleActionButtonMaxLines: titleActionButtonMaxLines,
             isArrangeActionButtonsVertical: isArrangeActionButtonsVertical,
             textContent: message,
             title: title ?? '',
             iconWidget: icon,
             margin: dialogMargin,
-            widthDialog: responsiveUtils.getSizeScreenWidth(context),
             confirmBackgroundButtonColor: actionButtonColor,
             cancelBackgroundButtonColor: cancelButtonColor,
             cancelLabelButtonColor: cancelLabelButtonColor,
             confirmLabelButtonColor: confirmLabelButtonColor,
-            styleContent: messageStyle,
-            styleTitle: titleStyle,
-            styleTextCancelButton: cancelStyle,
-            styleTextConfirmButton: actionStyle,
             confirmText: actionName,
             cancelText: hasCancelButton ? cancelTitle ?? AppLocalizations.of(context).cancel : '',
             useIconAsBasicLogo: useIconAsBasicLogo,
@@ -151,15 +131,12 @@ mixin MessageDialogActionMixin {
             backgroundColor: Colors.transparent,
             isDismissible: outsideDismissible,
             enableDrag: true,
-            ignoreSafeArea: false,
+            ignoreSafeArea: true,
             shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(18))),
           );
         } else {
           return (ConfirmationDialogActionSheetBuilder(context, listTextSpan: listTextSpan)
             ..messageText(message)
-            ..styleConfirmButton(actionStyle)
-            ..styleMessage(messageStyle)
-            ..styleCancelButton(cancelStyle)
             ..onCancelAction(
                 cancelTitle ?? AppLocalizations.of(context).cancel,
                 () {
@@ -182,7 +159,6 @@ mixin MessageDialogActionMixin {
             key: key,
             imagePath: imagePaths,
             listTextSpan: listTextSpan,
-            titleActionButtonMaxLines: titleActionButtonMaxLines,
             isArrangeActionButtonsVertical: isArrangeActionButtonsVertical,
             useIconAsBasicLogo: useIconAsBasicLogo,
             title: title ?? '',
@@ -192,10 +168,6 @@ mixin MessageDialogActionMixin {
             cancelBackgroundButtonColor: cancelButtonColor,
             cancelLabelButtonColor: cancelLabelButtonColor,
             confirmLabelButtonColor: confirmLabelButtonColor,
-            styleContent: messageStyle,
-            styleTitle: titleStyle,
-            styleTextCancelButton: cancelStyle,
-            styleTextConfirmButton: actionStyle,
             confirmText: actionName,
             cancelText: hasCancelButton ? cancelTitle ?? AppLocalizations.of(context).cancel : '',
             onConfirmButtonAction: () {

lib/features/composer/presentation/composer_controller.dart

@@ -784,6 +784,7 @@ class ComposerController extends BaseController
         title: AppLocalizations.of(context).sending_failed,
         hasCancelButton: false,
         showAsBottomSheet: true,
+        dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
       ).whenComplete(() => _sendButtonState = ButtonState.enabled);
       return;
     }
@@ -804,7 +805,8 @@ class ComposerController extends BaseController
         },
         showAsBottomSheet: true,
         title: AppLocalizations.of(context).sending_failed,
-        hasCancelButton: false
+        hasCancelButton: false,
+        dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
       ).whenComplete(() => _sendButtonState = ButtonState.enabled);
       return;
     }
@@ -819,6 +821,7 @@ class ComposerController extends BaseController
         autoPerformPopBack: false,
         title: AppLocalizations.of(context).empty_subject,
         showAsBottomSheet: true,
+        dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
       ).whenComplete(() => _sendButtonState = ButtonState.enabled);
       return;
     }
@@ -830,7 +833,8 @@ class ComposerController extends BaseController
         AppLocalizations.of(context).got_it,
         title: AppLocalizations.of(context).sending_failed,
         showAsBottomSheet: true,
-        hasCancelButton: false
+        hasCancelButton: false,
+        dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
       ).whenComplete(() => _sendButtonState = ButtonState.enabled);
       return;
     }
@@ -1933,7 +1937,6 @@ class ComposerController extends BaseController
       alignCenter: true,
       outsideDismissible: false,
       autoPerformPopBack: false,
-      titleActionButtonMaxLines: 1,
       isArrangeActionButtonsVertical: true,
       usePopScope: true,
       onConfirmAction: () => _handleSaveMessageToDraft(context),

lib/features/email/presentation/controller/single_email_controller.dart

@@ -1968,14 +1968,13 @@ class SingleEmailController extends BaseController with AppLoaderMixin {
         }
       },
       showAsBottomSheet: true,
+      dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
       title: AppLocalizations.of(context).unsubscribeMail,
-      messageStyle: ThemeUtils.textStyleBodyBody2(color: AppColor.steelGray400),
       listTextSpan: [
         TextSpan(text: AppLocalizations.of(context).unsubscribeMailDialogMessage),
         TextSpan(
           text: ' ${presentationEmail.getSenderName()}',
-          style: ThemeUtils.textStyleBodyBody2(
-            color: AppColor.steelGray400,
+          style: ThemeUtils.textStyleM3BodyMedium1.copyWith(
             fontWeight: FontWeight.w700,
           ),
         ),

lib/features/manage_account/presentation/forward/forward_controller.dart

@@ -127,6 +127,7 @@ class ForwardController extends BaseController {
       cancelTitle: AppLocalizations.of(context).remove,
       onCancelAction: () => _handleDeleteRecipientAction({emailAddress}),
       showAsBottomSheet: true,
+      dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
     );
   }
 
@@ -210,6 +211,7 @@ class ForwardController extends BaseController {
       cancelTitle: AppLocalizations.of(context).remove,
       onCancelAction: () => _handleDeleteRecipientAction(listEmailAddress),
       showAsBottomSheet: true,
+      dialogMargin: MediaQuery.paddingOf(context).add(const EdgeInsets.only(bottom: 12)),
     );
   }
 

lib/features/manage_account/presentation/profiles/identities/widgets/delete_identity_dialog_builder.dart

@@ -32,7 +32,6 @@ class DeleteIdentityDialogBuilder extends StatelessWidget {
         appLocalizations: appLocalizations,
         alignment: Alignment.bottomCenter,
         outsideDialogPadding: EdgeInsets.only(bottom: PlatformInfo.isWeb ? 42 : 16),
-        widthDialog: MediaQuery.of(context).size.width - 16,
       ),
       landscapeMobile: _buildDeleteDialog(appLocalizations: appLocalizations),
       tablet: _buildDeleteDialog(appLocalizations: appLocalizations),
@@ -50,7 +49,6 @@ class DeleteIdentityDialogBuilder extends StatelessWidget {
     required AppLocalizations appLocalizations,
     Alignment? alignment,
     EdgeInsets? outsideDialogPadding,
-    double? widthDialog,
   }) {
     return ConfirmationDialogBuilder(
       key: const Key('confirm_dialog_delete_identity'),
@@ -61,7 +59,6 @@ class DeleteIdentityDialogBuilder extends StatelessWidget {
       confirmText: appLocalizations.cancel,
       alignment: alignment,
       outsideDialogPadding: outsideDialogPadding,
-      widthDialog: widthDialog,
       onCancelButtonAction: onDeleteIdentityAction,
       onConfirmButtonAction: popBack,
       onCloseButtonAction: popBack,

lib/main/deep_links/open_app_deep_link_handler_mixin.dart

@@ -1,5 +1,5 @@
-import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/extensions/either_view_state_extension.dart';
+import 'package:core/presentation/utils/theme_utils.dart';
 import 'package:core/utils/string_convert.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
@@ -127,19 +127,11 @@ mixin OpenAppDeepLinkHandlerMixin on MessageDialogActionMixin {
       title: appLocalizations.switchAccountConfirmation,
       alignCenter: true,
       outsideDismissible: false,
-      titleActionButtonMaxLines: 1,
-      messageStyle: const TextStyle(
-        color: AppColor.colorTextBody,
-        fontSize: 15,
-        fontWeight: FontWeight.w400,
-      ),
       listTextSpan: [
         TextSpan(text: appLocalizations.youAreCurrentlyLoggedInWith),
         TextSpan(
           text: ' $currentUsername',
-          style: const TextStyle(
-            color: AppColor.colorTextBody,
-            fontSize: 15,
+          style: ThemeUtils.textStyleM3BodyMedium1.copyWith(
             fontWeight: FontWeight.bold,
           ),
         ),
@@ -147,9 +139,7 @@ mixin OpenAppDeepLinkHandlerMixin on MessageDialogActionMixin {
         TextSpan(text: appLocalizations.doYouWantToLogOutAndSwitchTo),
         TextSpan(
           text: ' $newUsername',
-          style: const TextStyle(
-            color: AppColor.colorTextBody,
-            fontSize: 15,
+          style: ThemeUtils.textStyleM3BodyMedium1.copyWith(
             fontWeight: FontWeight.bold,
           ),
         ),