TF-467 Apply new UI for mailbox browser

core/lib/presentation/extensions/color_extension.dart

@@ -107,6 +107,7 @@ extension AppColor on Color {
   static const colorAvatar = Color(0xFFDE5E5E);
   static const colorFocusButton = Color(0x14818C99);
   static const colorBorderEmailAddressInvalid = Color(0xFFFF3347);
+  static const colorBgMailboxSelected = Color(0xFF99E4E8EC);
 
   static const mapGradientColor = [
     [Color(0xFF21D4FD), Color(0xFFB721FF)],

core/lib/presentation/resources/image_paths.dart

@@ -87,6 +87,7 @@ class ImagePaths {
   String get icEmpty => _getImagePath('ic_empty.svg');
   String get icNotConnection => _getImagePath('ic_not_connection.svg');
   String get icDeleteTrash => _getImagePath('ic_delete_trash.svg');
+  String get icMenuDrawer => _getImagePath('ic_menu_drawer.svg');
 
   String _getImagePath(String imageName) {
     return AssetsPaths.images + imageName;

core/lib/presentation/utils/responsive_utils.dart

@@ -9,7 +9,7 @@ class ResponsiveUtils {
   final int minTabletLargeWidth = 900;
 
   final double defaultSizeDrawerWidthMobileTablet = 375;
-  final double defaultSizeDrawerWidthWeb = 320;
+  final double defaultSizeDrawerWidthWeb = 262;
 
   final double _loginTextFieldWidthSmallScreen = 280.0;
   final double _loginTextFieldWidthLargeScreen = 320.0;

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

@@ -20,7 +20,7 @@ Widget buildIconWeb({
           icon: icon,
           iconSize: iconSize,
           padding: iconPadding ?? EdgeInsets.all(8.0),
-          splashRadius: splashRadius ?? 20,
+          splashRadius: splashRadius ?? 15,
           tooltip: tooltip ?? '',
           onPressed: onTap)
   );

core/lib/presentation/views/search/search_bar_view.dart

@@ -1,6 +1,8 @@
 
 import 'package:core/core.dart';
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 
 typedef OnOpenSearchViewAction = Function();
@@ -61,30 +63,20 @@ class SearchBarView {
               child: Row(
                 crossAxisAlignment: CrossAxisAlignment.center,
                 children: [
-                  _buildSearchButton(),
-                  Expanded(child: Text(
-                    _hintTextSearch ?? '',
-                    maxLines: 1,
-                    style: TextStyle(fontSize: 17, color: AppColor.colorHintSearchBar)))
+                  buildIconWeb(
+                      splashRadius: 12,
+                      icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 16, height: 16, fit: BoxFit.fill),
+                      onTap: () => _onOpenSearchViewAction?.call()),
+                  Expanded(child:
+                    Transform(transform: Matrix4.translationValues(-5, 0.0, 0.0),
+                    child: Text(
+                        _hintTextSearch ?? '',
+                        maxLines: 1,
+                        style: TextStyle(fontSize: kIsWeb ? 15 : 17, color: AppColor.colorHintSearchBar))))
                 ]
               )
           )
       ),
     );
   }
-
- Widget _buildSearchButton() {
-   return Material(
-     color: Colors.transparent,
-     shape: CircleBorder(),
-     child: Padding(
-       padding: EdgeInsets.only(left: 2),
-       child: IconButton(
-         splashRadius: 20,
-         icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 18, height: 18, fit: BoxFit.fill),
-         onPressed: () => _onOpenSearchViewAction?.call()
-       )
-     )
-   );
- }
 }