TF-602 Persist size item email when selection on tablet

core/lib/presentation/views/button/icon_button_web.dart

@@ -34,24 +34,28 @@ Widget buildIconWebHasPosition(BuildContext context, {
   IconWebHasPositionCallback? onTapDown,
   IconWebCallback? onTap,
 }) {
-  return InkWell(
+  return Material(
-      onTapDown: (detail) {
+    color: Colors.transparent,
-        final screenSize = MediaQuery.of(context).size;
+    shape: CircleBorder(),
-        final offset = detail.globalPosition;
+    child: InkWell(
-        final position = RelativeRect.fromLTRB(
+        onTapDown: (detail) {
-          offset.dx,
+          final screenSize = MediaQuery.of(context).size;
-          offset.dy,
+          final offset = detail.globalPosition;
-          screenSize.width - offset.dx,
+          final position = RelativeRect.fromLTRB(
-          screenSize.height - offset.dy,
+            offset.dx,
-        );
+            offset.dy,
-        onTapDown?.call(position);
+            screenSize.width - offset.dx,
-      },
+            screenSize.height - offset.dy,
-      onTap: () => onTap?.call(),
+          );
-      borderRadius: BorderRadius.all(Radius.circular(35)),
+          onTapDown?.call(position);
-      child: Tooltip(
+        },
-        message: tooltip ?? '',
+        onTap: () => onTap?.call(),
-        child: icon,
+        borderRadius: BorderRadius.all(Radius.circular(12)),
-      )
+        child: Tooltip(
+          message: tooltip ?? '',
+          child: icon,
+        )
+    ),
   );
 }
 

lib/features/thread/presentation/thread_view.dart

@@ -61,7 +61,7 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                                   color: Colors.white,
                                   padding: EdgeInsets.symmetric(
                                       horizontal: 16,
-                                      vertical: BuildUtils.isWeb && _responsiveUtils.isTabletLarge(context) ? 8 : 0),
+                                      vertical: BuildUtils.isWeb && !_responsiveUtils.isDesktop(context) ? 8 : 0),
                                   margin: const EdgeInsets.only(
                                       bottom: !BuildUtils.isWeb ? 16 : 0),
                                   child: _buildSearchFormInActive(context))
@@ -70,7 +70,7 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                                   color: Colors.white,
                                   padding: EdgeInsets.symmetric(
                                       horizontal: 8,
-                                      vertical: BuildUtils.isWeb && _responsiveUtils.isTabletLarge(context) ? 8 : 0),
+                                      vertical: BuildUtils.isWeb && !_responsiveUtils.isDesktop(context) ? 8 : 0),
                                   margin: const EdgeInsets.only(
                                       bottom: !BuildUtils.isWeb ? 16 : 0),
                                   child: _buildSearchFormActive(context))

lib/features/thread/presentation/widgets/app_bar_thread_widget_builder.dart

@@ -64,13 +64,9 @@ class AppBarThreadWidgetBuilder {
       alignment: Alignment.topCenter,
       color: Colors.white,
       margin: EdgeInsets.zero,
-      padding: EdgeInsets.only(
+      padding: EdgeInsets.symmetric(
-          left: 8,
+          vertical: _selectMode == SelectMode.INACTIVE ? 16 : 11,
-          bottom: !BuildUtils.isWeb ? 8 : 16,
+          horizontal: 8),
-          right: 8,
-          top: !BuildUtils.isWeb && _responsiveUtils.isPortraitMobile(_context)
-              ? 0
-              : 16),
       child: MediaQuery(
         data: const MediaQueryData(padding: EdgeInsets.zero),
         child: _buildAppBar()
@@ -109,46 +105,101 @@ class AppBarThreadWidgetBuilder {
           icon: SvgPicture.asset(_imagePaths.icCloseComposer,
               color: AppColor.colorTextButton,
               fit: BoxFit.fill),
+          minSize: 25,
+          iconSize: 25,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 15,
           tooltip: AppLocalizations.of(_context).cancel,
           onTap: () => _onCancelEditThread?.call()),
       Expanded(child: Text(
         AppLocalizations.of(_context).count_email_selected(_listSelectionEmail.length),
-        style: const TextStyle(fontSize: 17,
+        style: const TextStyle(
-            fontWeight: FontWeight.w500, color: AppColor.colorTextButton))),
+            fontSize: 17,
+            fontWeight: FontWeight.w500,
+            color: AppColor.colorTextButton))),
       buildIconWeb(
-          icon: SvgPicture.asset(_listSelectionEmail.isAllEmailRead ? _imagePaths.icRead : _imagePaths.icUnread, fit: BoxFit.fill),
+          minSize: 25,
-          tooltip: _listSelectionEmail.isAllEmailRead ? AppLocalizations.of(_context).unread : AppLocalizations.of(_context).read,
+          iconSize: 25,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 15,
+          icon: SvgPicture.asset(
+              _listSelectionEmail.isAllEmailRead
+                  ? _imagePaths.icRead
+                  : _imagePaths.icUnread,
+              fit: BoxFit.fill),
+          tooltip: _listSelectionEmail.isAllEmailRead
+              ? AppLocalizations.of(_context).unread
+              : AppLocalizations.of(_context).read,
           onTap: () => _onEmailSelectionAction?.call(
-              _listSelectionEmail.isAllEmailRead ? EmailActionType.markAsUnread : EmailActionType.markAsRead,
+              _listSelectionEmail.isAllEmailRead
+                  ? EmailActionType.markAsUnread
+                  : EmailActionType.markAsRead,
               _listSelectionEmail)),
+      const SizedBox(width: 5),
       buildIconWeb(
-          icon: SvgPicture.asset(_listSelectionEmail.isAllEmailStarred ? _imagePaths.icUnStar : _imagePaths.icStar, fit: BoxFit.fill),
+          minSize: 25,
-          tooltip: _listSelectionEmail.isAllEmailStarred ? AppLocalizations.of(_context).not_starred : AppLocalizations.of(_context).starred,
+          iconSize: 25,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 15,
+          icon: SvgPicture.asset(
+              _listSelectionEmail.isAllEmailStarred
+                  ? _imagePaths.icUnStar
+                  : _imagePaths.icStar,
+              fit: BoxFit.fill),
+          tooltip: _listSelectionEmail.isAllEmailStarred
+              ? AppLocalizations.of(_context).not_starred
+              : AppLocalizations.of(_context).starred,
           onTap: () => _onEmailSelectionAction?.call(
-              _listSelectionEmail.isAllEmailStarred ? EmailActionType.unMarkAsStarred : EmailActionType.markAsStarred,
+              _listSelectionEmail.isAllEmailStarred
+                  ? EmailActionType.unMarkAsStarred
+                  : EmailActionType.markAsStarred,
               _listSelectionEmail)),
+      const SizedBox(width: 5),
       if (_currentMailbox?.isDrafts == false)
-        buildIconWeb(
+        ... [
-            icon: SvgPicture.asset(_imagePaths.icMove, fit: BoxFit.fill),
+          buildIconWeb(
-            tooltip: AppLocalizations.of(_context).move,
+              minSize: 25,
-            onTap: () => _onEmailSelectionAction?.call(EmailActionType.moveToMailbox, _listSelectionEmail)),
+              iconSize: 25,
-      if (_currentMailbox?.isDrafts == false)
+              iconPadding: const EdgeInsets.all(5),
-        buildIconWeb(
+              splashRadius: 15,
-            icon: SvgPicture.asset(_currentMailbox?.isSpam == true
+              icon: SvgPicture.asset(_imagePaths.icMove, fit: BoxFit.fill),
-                ? _imagePaths.icNotSpam : _imagePaths.icSpam,
+              tooltip: AppLocalizations.of(_context).move,
-                fit: BoxFit.fill),
+              onTap: () => _onEmailSelectionAction?.call(EmailActionType.moveToMailbox, _listSelectionEmail)),
-            tooltip: _currentMailbox?.isSpam == true ? AppLocalizations.of(_context).un_spam : AppLocalizations.of(_context).mark_as_spam,
+          const SizedBox(width: 5),
-            onTap: () => _currentMailbox?.isSpam == true
+          buildIconWeb(
-                ? _onEmailSelectionAction?.call(EmailActionType.unSpam, _listSelectionEmail)
+              minSize: 25,
-                : _onEmailSelectionAction?.call(EmailActionType.moveToSpam, _listSelectionEmail)),
+              iconSize: 25,
+              iconPadding: const EdgeInsets.all(5),
+              splashRadius: 15,
+              icon: SvgPicture.asset(_currentMailbox?.isSpam == true
+                  ? _imagePaths.icNotSpam : _imagePaths.icSpam,
+                  fit: BoxFit.fill),
+              tooltip: _currentMailbox?.isSpam == true
+                  ? AppLocalizations.of(_context).un_spam
+                  : AppLocalizations.of(_context).mark_as_spam,
+              onTap: () => _currentMailbox?.isSpam == true
+                  ? _onEmailSelectionAction?.call(EmailActionType.unSpam, _listSelectionEmail)
+                  : _onEmailSelectionAction?.call(EmailActionType.moveToSpam, _listSelectionEmail)),
+          const SizedBox(width: 5),
+        ],
       buildIconWeb(
-          icon: SvgPicture.asset(_imagePaths.icDelete, fit: BoxFit.fill),
+          minSize: 25,
+          iconSize: 25,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 15,
+          icon: SvgPicture.asset(
+              _imagePaths.icDeleteComposer,
+              width: 18,
+              height: 18,
+              color: AppColor.textFieldErrorBorderColor,
+              fit: BoxFit.fill),
           tooltip: _currentMailbox?.role != PresentationMailbox.roleTrash
               ? AppLocalizations.of(_context).move_to_trash
               : AppLocalizations.of(_context).delete_permanently,
           onTap: () => _currentMailbox?.isTrash == true
               ? _onEmailSelectionAction?.call(EmailActionType.deletePermanently, _listSelectionEmail)
               : _onEmailSelectionAction?.call(EmailActionType.moveToTrash, _listSelectionEmail)),
+      const SizedBox(width: 10),
     ]);
   }
 
@@ -241,7 +292,7 @@ class AppBarThreadWidgetBuilder {
       child: Padding(
         padding: const EdgeInsets.only(left: 16, right: 16),
         child: InkWell(
-            borderRadius: const BorderRadius.all(Radius.circular(10)),
+            borderRadius: const BorderRadius.all(Radius.circular(12)),
             onTap: () {
               if (_onFilterEmailAction != null
                   && _responsiveUtils.isScreenWithShortestSide(_context)) {
@@ -274,6 +325,10 @@ class AppBarThreadWidgetBuilder {
 
   Widget _buildMenuButton() {
     return buildIconWeb(
+        minSize: 20,
+        iconSize: 20,
+        iconPadding: const EdgeInsets.all(3),
+        splashRadius: 15,
         icon: SvgPicture.asset(_imagePaths.icMenuDrawer, fit: BoxFit.fill),
         onTap:() => _onOpenMailboxMenuActionClick?.call());
   }

lib/features/thread/presentation/widgets/email_tile_web_builder.dart

@@ -94,14 +94,19 @@ class EmailTileBuilder {
             : null,
         child: tile,
       );
-    } else {
+    } else if (_responsiveUtils.isTabletLarge(_context) || _responsiveUtils.isTablet(_context)) {
       return Container(
-          margin: _selectModeAll == SelectMode.ACTIVE
+          margin: const EdgeInsets.only(top: 3, left: 16, right: 16),
-              ? const EdgeInsets.only(top: 3, left: 16, right: 16)
+          padding: const EdgeInsets.only(bottom: 8, right: 8, top: 8),
-              : EdgeInsets.zero,
+          decoration: _selectModeAll == SelectMode.ACTIVE && _presentationEmail.selectMode == SelectMode.ACTIVE
-          padding: _selectModeAll == SelectMode.ACTIVE
+              ? BoxDecoration(borderRadius: BorderRadius.circular(14), color: AppColor.colorItemEmailSelectedDesktop)
-              ? const EdgeInsets.only(top: 8, bottom: 16, right: 8)
+              : BoxDecoration(borderRadius: BorderRadius.circular(0), color: Colors.white),
-              : const EdgeInsets.only(bottom: 10, left: 16, right: 16),
+          alignment: Alignment.center,
+          child: tile);
+    }else {
+      return Container(
+          margin: const EdgeInsets.only(top: 3, left: 16, right: 16),
+          padding: const EdgeInsets.only(bottom: 8, right: 8, top: 8),
           decoration: _selectModeAll == SelectMode.ACTIVE && _presentationEmail.selectMode == SelectMode.ACTIVE
               ? BoxDecoration(borderRadius: BorderRadius.circular(14), color: AppColor.colorItemEmailSelectedDesktop)
               : BoxDecoration(borderRadius: BorderRadius.circular(0), color: Colors.white),
@@ -240,127 +245,143 @@ class EmailTileBuilder {
       return InkWell(
         onTap: () => _emailActionClick?.call(EmailActionType.preview, _presentationEmail),
         onHover: (value) => _onHoverItemChanged(value, setState),
-        child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
+        child: Stack(
-          InkWell(
+          children: [
-            onTap: () {
+            Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
-              if (isHoverIcon) {
+              InkWell(
-                _emailActionClick?.call(EmailActionType.selection, _presentationEmail);
+                onTap: () {
-              }
+                  if (isHoverIcon) {
-            },
+                    _emailActionClick?.call(EmailActionType.selection, _presentationEmail);
-            onHover: (value) => _onHoverIconChanged(value, setState),
+                  }
-            child: Padding(
+                },
-              padding: const EdgeInsets.only(top: 8, right: 12),
+                onHover: (value) => _onHoverIconChanged(value, setState),
-              child: _buildAvatarIcon())),
+                child: Padding(
-          Expanded(child: Column(children: [
+                  padding: const EdgeInsets.only(top: 8, right: 12),
-            Transform(
+                  child: _buildAvatarIcon())),
-                transform: Matrix4.translationValues(0.0, isHoverItem ? -10.0 : 0.0, 0.0),
+              Expanded(child: Stack(alignment: Alignment.bottomCenter,
-                child: Row(children: [
-                  if (!_presentationEmail.hasRead)
-                    Padding(
-                        padding: const EdgeInsets.only(right: 5),
-                        child: SvgPicture.asset(_imagePaths.icUnreadStatus, width: 9, height: 9, fit: BoxFit.fill)),
-                  Expanded(
-                      child: _searchStatus == SearchStatus.ACTIVE && _searchQuery != null && _searchQuery!.value.isNotEmpty
-                          ? RichTextBuilder(
-                              _getInformationSender(),
-                              _searchQuery!.value,
-                              TextStyle(
-                                  fontSize: 15,
-                                  color: _buildTextColorForReadEmail(),
-                                  fontWeight: _buildFontForReadEmail()),
-                              TextStyle(
-                                  fontSize: 15,
-                                  color: _buildTextColorForReadEmail(),
-                                  backgroundColor: AppColor.bgWordSearch,
-                                  fontWeight: _buildFontForReadEmail())
-                            ).build()
-                          : Text(
-                              _getInformationSender(),
-                              maxLines: 1,
-                              style: TextStyle(
-                                  fontSize: 15,
-                                  color: _buildTextColorForReadEmail(),
-                                  fontWeight: _buildFontForReadEmail()))
-                  ),
-                  if (isHoverItem)
-                    _buildListActionButtonWhenHover()
-                  else
-                    _buildDateTimeForMobileTabletScreen()
-                ])),
-            Transform(
-              transform: Matrix4.translationValues(0.0, isHoverItem ? -10.0 : 0.0, 0.0),
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                mainAxisSize: MainAxisSize.min,
                 children: [
-                  Padding(
+                  Column(children: [
-                      padding: EdgeInsets.only(top: isHoverItem ? 0 : 8),
+                    Row(children: [
-                      child: Row(
+                      if (!_presentationEmail.hasRead)
-                        mainAxisSize: MainAxisSize.min,
+                        Padding(
-                        children: [
+                            padding: const EdgeInsets.only(right: 5),
-                          Expanded(child: _searchStatus == SearchStatus.ACTIVE && _searchQuery != null && _searchQuery!.value.isNotEmpty
+                            child: SvgPicture.asset(
-                              ? RichTextBuilder(
+                                _imagePaths.icUnreadStatus,
-                                  _presentationEmail.getEmailTitle(),
+                                width: 9,
-                                  _searchQuery!.value,
+                                height: 9,
-                                  TextStyle(
+                                fit: BoxFit.fill)),
-                                      fontSize: 13,
+                      Expanded(child: _searchStatus == SearchStatus.ACTIVE &&
-                                      color: _buildTextColorForReadEmail()),
+                        _searchQuery != null &&
-                                  TextStyle(
+                        _searchQuery!.value.isNotEmpty
-                                      fontSize: 13,
-                                      backgroundColor: AppColor.bgWordSearch,
-                                      color: _buildTextColorForReadEmail())
-                                ).build()
-                              : Text(
-                                  _presentationEmail.getEmailTitle(),
-                                  maxLines: 1,
-                                  style: TextStyle(
-                                      fontSize: 13,
-                                      color: _buildTextColorForReadEmail()))
-                          ),
-                          if (_searchStatus == SearchStatus.ACTIVE && _presentationEmail.mailboxName.isNotEmpty)
-                            Container(
-                                margin: const EdgeInsets.only(left: 8),
-                                padding: const EdgeInsets.only(left: 8, right: 8, top: 3, bottom: 3),
-                                constraints: const BoxConstraints(maxWidth: 100),
-                                decoration: BoxDecoration(
-                                    borderRadius: BorderRadius.circular(10),
-                                    color: AppColor.backgroundCounterMailboxColor),
-                                child: Text(
-                                  _presentationEmail.mailboxName,
-                                  maxLines: 1,
-                                  style: const TextStyle(fontSize: 10, color: AppColor.mailboxTextColor, fontWeight: FontWeight.bold),
-                                )
-                            ),
-                          if (_presentationEmail.hasStarred)
-                            SvgPicture.asset(_imagePaths.icStar, width: 15, height: 15, fit: BoxFit.fill)
-                        ],
-                      )),
-                  Padding(
-                      padding: const EdgeInsets.only(top: 8),
-                      child: Row(children: [
-                        Expanded(child: _searchStatus ==
-                            SearchStatus.ACTIVE && _searchQuery != null &&
-                            _searchQuery!.value.isNotEmpty
                             ? RichTextBuilder(
-                                _presentationEmail.getPartialContent(),
+                                _getInformationSender(),
                                 _searchQuery!.value,
-                                const TextStyle(fontSize: 13, color: AppColor.colorContentEmail),
+                                TextStyle(
-                                const TextStyle(fontSize: 13, color: AppColor.colorContentEmail, backgroundColor: AppColor.bgWordSearch)).build()
+                                    fontSize: 15,
+                                    color: _buildTextColorForReadEmail(),
+                                    fontWeight: _buildFontForReadEmail()),
+                                TextStyle(
+                                    fontSize: 15,
+                                    color: _buildTextColorForReadEmail(),
+                                    backgroundColor: AppColor.bgWordSearch,
+                                    fontWeight: _buildFontForReadEmail())
+                              ).build()
                             : Text(
-                                _presentationEmail.getPartialContent(),
+                                _getInformationSender(),
                                 maxLines: 1,
-                                style: const TextStyle(fontSize: 13, color: AppColor.colorContentEmail))
+                                style: TextStyle(
-                        ),
+                                    fontSize: 15,
-                      ])),
+                                    color: _buildTextColorForReadEmail(),
+                                    fontWeight: _buildFontForReadEmail()))
+                      ),
+                      if (isHoverItem)
+                        const SizedBox(width: 120)
+                      else
+                        _buildDateTimeForMobileTabletScreen()
+                    ]),
+                    Padding(
+                        padding: const EdgeInsets.only(top: 8),
+                        child: Row(
+                          mainAxisSize: MainAxisSize.min,
+                          children: [
+                            Expanded(child: _searchStatus == SearchStatus.ACTIVE && _searchQuery != null && _searchQuery!.value.isNotEmpty
+                                ? RichTextBuilder(
+                                    _presentationEmail.getEmailTitle(),
+                                    _searchQuery!.value,
+                                    TextStyle(
+                                        fontSize: 13,
+                                        color: _buildTextColorForReadEmail()),
+                                    TextStyle(
+                                        fontSize: 13,
+                                        backgroundColor: AppColor.bgWordSearch,
+                                        color: _buildTextColorForReadEmail())
+                                  ).build()
+                                : Text(
+                                    _presentationEmail.getEmailTitle(),
+                                    maxLines: 1,
+                                    style: TextStyle(
+                                        fontSize: 13,
+                                        color: _buildTextColorForReadEmail()))
+                            ),
+                            if (_searchStatus == SearchStatus.ACTIVE && _presentationEmail.mailboxName.isNotEmpty)
+                              Container(
+                                  margin: const EdgeInsets.only(left: 8),
+                                  padding: const EdgeInsets.only(left: 8, right: 8, top: 3, bottom: 3),
+                                  constraints: const BoxConstraints(maxWidth: 100),
+                                  decoration: BoxDecoration(
+                                      borderRadius: BorderRadius.circular(10),
+                                      color: AppColor.backgroundCounterMailboxColor),
+                                  child: Text(
+                                    _presentationEmail.mailboxName,
+                                    maxLines: 1,
+                                    style: const TextStyle(fontSize: 10, color: AppColor.mailboxTextColor, fontWeight: FontWeight.bold),
+                                  )
+                              ),
+                            if (_presentationEmail.hasStarred)
+                              SvgPicture.asset(_imagePaths.icStar, width: 15, height: 15, fit: BoxFit.fill)
+                          ],
+                        )),
+                    Padding(
+                        padding: const EdgeInsets.only(top: 8),
+                        child: Row(children: [
+                          Expanded(child: _searchStatus ==
+                              SearchStatus.ACTIVE && _searchQuery != null &&
+                              _searchQuery!.value.isNotEmpty
+                              ? RichTextBuilder(
+                                  _presentationEmail.getPartialContent(),
+                                  _searchQuery!.value,
+                                  const TextStyle(fontSize: 13, color: AppColor.colorContentEmail),
+                                  const TextStyle(fontSize: 13, color: AppColor.colorContentEmail, backgroundColor: AppColor.bgWordSearch)).build()
+                              : Text(
+                                  _presentationEmail.getPartialContent(),
+                                  maxLines: 1,
+                                  style: const TextStyle(fontSize: 13, color: AppColor.colorContentEmail))
+                          ),
+                        ])),
+                  ]),
                   if (_selectModeAll == SelectMode.INACTIVE)
-                    const Padding(
+                    Transform(
-                        padding: EdgeInsets.only(top: 12),
+                      transform: Matrix4.translationValues(0.0, 10.0, 0.0),
-                        child: Divider(color: AppColor.lineItemListColor, height: 1, thickness: 0.2)),
+                      child: const Divider(
+                          color: AppColor.lineItemListColor,
+                          height: 1,
+                          thickness: 0.2),
+                    ),
                 ],
-              )
+              ))
-            ),
+            ]),
-          ]))
+            if (isHoverItem)
-        ]),
+              Positioned(
+                top: 0,
+                right: 0,
+                child: Transform(
+                    transform: Matrix4.translationValues(
+                        0.0,
+                        _selectModeAll == SelectMode.INACTIVE ? -5.0 : 0.0,
+                        0.0),
+                    child: _buildListActionButtonWhenHover()))
+          ],
+        ),
       );
     });
   }
@@ -436,6 +457,10 @@ class EmailTileBuilder {
   Widget _buildListActionButtonWhenHover() {
     return Row(children: [
       buildIconWeb(
+          minSize: 18,
+          iconSize: 18,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 10,
           icon: SvgPicture.asset(
               _presentationEmail.hasRead ? _imagePaths.icRead : _imagePaths.icUnread,
               color: AppColor.colorActionButtonHover,
@@ -446,17 +471,29 @@ class EmailTileBuilder {
           onTap: () => _emailActionClick?.call(
               _presentationEmail.hasRead ? EmailActionType.markAsUnread : EmailActionType.markAsRead,
               _presentationEmail)),
+      const SizedBox(width: 5),
       if (_mailboxRole != PresentationMailbox.roleDrafts)
-        buildIconWeb(
+        ... [
-            icon: SvgPicture.asset(
+          buildIconWeb(
-                _imagePaths.icMove,
+              minSize: 18,
-                width: 16,
+              iconSize: 18,
-                height: 16,
+              iconPadding: const EdgeInsets.all(5),
-                color: AppColor.colorActionButtonHover,
+              splashRadius: 10,
-                fit: BoxFit.fill),
+              icon: SvgPicture.asset(
-            tooltip: AppLocalizations.of(_context).move,
+                  _imagePaths.icMove,
-            onTap: () => _emailActionClick?.call(EmailActionType.moveToMailbox, _presentationEmail)),
+                  width: 16,
+                  height: 16,
+                  color: AppColor.colorActionButtonHover,
+                  fit: BoxFit.fill),
+              tooltip: AppLocalizations.of(_context).move,
+              onTap: () => _emailActionClick?.call(EmailActionType.moveToMailbox, _presentationEmail)),
+          const SizedBox(width: 5),
+        ],
       buildIconWeb(
+          minSize: 18,
+          iconSize: 18,
+          iconPadding: const EdgeInsets.all(5),
+          splashRadius: 10,
           icon: SvgPicture.asset(
               _imagePaths.icDelete,
               width: 16,
@@ -469,6 +506,7 @@ class EmailTileBuilder {
           onTap: () => _emailActionClick?.call(
               _mailboxRole != PresentationMailbox.roleTrash ? EmailActionType.moveToTrash : EmailActionType.deletePermanently,
               _presentationEmail)),
+      const SizedBox(width: 5),
       if (_mailboxRole != PresentationMailbox.roleDrafts)
         buildIconWebHasPosition(
             _context,
@@ -571,15 +609,17 @@ class EmailTileBuilder {
   }) {
     if (isHoverIcon || _presentationEmail.selectMode == SelectMode.ACTIVE
         || (_responsiveUtils.isMobile(_context) && _selectModeAll == SelectMode.ACTIVE)) {
-        return Padding(
+        return Container(
-            padding: _responsiveUtils.isDesktop(_context)
+          color: Colors.transparent,
-                ? const EdgeInsets.symmetric(horizontal: 4)
+          padding: _responsiveUtils.isDesktop(_context)
-                : const EdgeInsets.all(12),
+              ? const EdgeInsets.symmetric(horizontal: 4)
-            child: SvgPicture.asset(
+              : const EdgeInsets.all(12),
-                _presentationEmail.selectMode == SelectMode.ACTIVE
+          child: SvgPicture.asset(
-                    ? _imagePaths.icSelected
+              _presentationEmail.selectMode == SelectMode.ACTIVE
-                    : _imagePaths.icUnSelected,
+                  ? _imagePaths.icSelected
-                fit: BoxFit.fill));
+                  : _imagePaths.icUnSelected,
+              fit: BoxFit.fill),
+        );
     } else {
       return Container(
           width: iconSize ?? 48,