TF-2857 Change logo & text in application

linagora · Jun 5, 2024 · b6055ab · b6055ab
1 parent 60f036a
commit b6055ab
Show file tree

Hide file tree

Showing 11 changed files with 113 additions and 90 deletions.
diff --git a/assets/images/ic_logo_with_text.svg b/assets/images/ic_logo_with_text.svg
diff --git a/assets/images/ic_tmail_logo.svg b/assets/images/ic_tmail_logo.svg
diff --git a/core/lib/presentation/resources/image_paths.dart b/core/lib/presentation/resources/image_paths.dart
@@ -195,7 +195,7 @@ class ImagePaths {
   String get icEventUpdated => _getImagePath('ic_event_updated.svg');
   String get icEventCanceled => _getImagePath('ic_event_canceled.svg');
   String get icFormatQuote => _getImagePath('ic_format_quote.svg');
-  String get icTMailLogo => _getImagePath('ic_tmail_logo.svg');
+  String get icLogoWithText => _getImagePath('ic_logo_with_text.svg');
   String get icLoginGraphic => _getImagePath('ic_login_graphic.svg');
   String get icCancel => _getImagePath('ic_cancel.svg');
   String get icRichToolbar => _getImagePath('ic_rich_toolbar.svg');

diff --git a/core/lib/presentation/views/button/tmail_button_widget.dart b/core/lib/presentation/views/button/tmail_button_widget.dart
@@ -38,6 +38,7 @@ class TMailButtonWidget extends StatelessWidget {
   final int? maxLines;
   final MainAxisSize mainAxisSize;
   final bool isLoading;
+  final Color? hoverColor;
 
   const TMailButtonWidget({
     super.key,
@@ -70,6 +71,7 @@ class TMailButtonWidget extends StatelessWidget {
     this.maxLines,
     this.mainAxisSize = MainAxisSize.max,
     this.isLoading = false,
+    this.hoverColor,
   });
 
   factory TMailButtonWidget.fromIcon({
@@ -93,6 +95,7 @@ class TMailButtonWidget extends StatelessWidget {
     Color? trailingIconColor,
     List<BoxShadow>? boxShadow,
     EdgeInsetsGeometry? margin,
+    Color? hoverColor,
   }) {
     return TMailButtonWidget(
       key: key,
@@ -116,6 +119,7 @@ class TMailButtonWidget extends StatelessWidget {
       trailingIconColor: trailingIconColor,
       boxShadow: boxShadow,
       margin: margin,
+      hoverColor: hoverColor,
     );
   }
 
@@ -139,6 +143,7 @@ class TMailButtonWidget extends StatelessWidget {
     bool flexibleText = false,
     BoxBorder? border,
     int? maxLines,
+    Color? hoverColor,
   }) {
     return TMailButtonWidget(
       key: key,
@@ -160,6 +165,7 @@ class TMailButtonWidget extends StatelessWidget {
       flexibleText: flexibleText,
       border: border,
       maxLines: maxLines,
+      hoverColor: hoverColor,
     );
   }
 
@@ -346,6 +352,7 @@ class TMailButtonWidget extends StatelessWidget {
       margin: margin,
       boxShadow: boxShadow,
       border: border,
+      hoverColor: hoverColor,
       child: childWidget,
     );
   }

diff --git a/core/lib/presentation/views/container/tmail_container_widget.dart b/core/lib/presentation/views/container/tmail_container_widget.dart
@@ -20,6 +20,7 @@ class TMailContainerWidget extends StatelessWidget {
   final EdgeInsetsGeometry? margin;
   final List<BoxShadow>? boxShadow;
   final BoxBorder? border;
+  final Color? hoverColor;
 
   const TMailContainerWidget({
     super.key,
@@ -37,27 +38,31 @@ class TMailContainerWidget extends StatelessWidget {
     this.boxShadow,
     this.margin,
     this.border,
+    this.hoverColor,
   });
 
   @override
   Widget build(BuildContext context) {
     final materialChild = Material(
-      color: Colors.transparent,
+      type: MaterialType.transparency,
       child: InkWell(
         onTap: onTapActionCallback,
-        onTapDown: (detail) {
-          if (onTapActionAtPositionCallback != null) {
-            final screenSize = MediaQuery.of(context).size;
-            final offset = detail.globalPosition;
-            final position = RelativeRect.fromLTRB(
-              offset.dx,
-              offset.dy,
-              screenSize.width - offset.dx,
-              screenSize.height - offset.dy,
-            );
-            onTapActionAtPositionCallback!.call(position);
-          }
-        },
+        onTapDown: onTapActionAtPositionCallback != null
+          ? (detail) {
+              if (onTapActionAtPositionCallback != null) {
+                final screenSize = MediaQuery.of(context).size;
+                final offset = detail.globalPosition;
+                final position = RelativeRect.fromLTRB(
+                  offset.dx,
+                  offset.dy,
+                  screenSize.width - offset.dx,
+                  screenSize.height - offset.dy,
+                );
+                onTapActionAtPositionCallback!.call(position);
+              }
+            }
+          : null,
+        hoverColor: hoverColor,
         borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
         child: tooltipMessage != null
           ? Tooltip(

diff --git a/lib/features/base/widget/application_logo_with_text_widget.dart b/lib/features/base/widget/application_logo_with_text_widget.dart
@@ -0,0 +1,25 @@
+import 'package:core/presentation/resources/image_paths.dart';
+import 'package:core/presentation/views/button/tmail_button_widget.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+class ApplicationLogoWidthTextWidget extends StatelessWidget {
+
+  final ImagePaths _imagePaths = Get.find<ImagePaths>();
+
+  final VoidCallback? onTapAction;
+
+  ApplicationLogoWidthTextWidget({super.key, this.onTapAction});
+
+  @override
+  Widget build(BuildContext context) {
+    return TMailButtonWidget.fromIcon(
+      icon: _imagePaths.icLogoWithText,
+      iconSize: 33,
+      padding: EdgeInsets.zero,
+      backgroundColor: Colors.transparent,
+      hoverColor: Colors.transparent,
+      onTapActionCallback: onTapAction,
+    );
+  }
+}
diff --git a/lib/features/login/presentation/login_view_web.dart b/lib/features/login/presentation/login_view_web.dart
@@ -5,6 +5,7 @@ import 'package:core/presentation/views/text/slogan_builder.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get_state_manager/src/rx_flutter/rx_obx_widget.dart';
+import 'package:tmail_ui_user/features/base/widget/application_logo_with_text_widget.dart';
 import 'package:tmail_ui_user/features/login/presentation/base_login_view.dart';
 import 'package:tmail_ui_user/features/login/presentation/login_form_type.dart';
 import 'package:tmail_ui_user/features/login/presentation/privacy_link_widget.dart';
@@ -39,7 +40,7 @@ class LoginView extends BaseLoginView {
             children: [
               Padding(
                 padding: const EdgeInsets.only(top: 67),
-                child: _buildAppLogo(context)
+                child: ApplicationLogoWidthTextWidget()
               ),
               Padding(
                 padding: const EdgeInsets.only(top: 67),
@@ -181,7 +182,7 @@ class LoginView extends BaseLoginView {
                   children: [
                     Padding(
                       padding: const EdgeInsets.only(top: 66),
-                      child: _buildAppLogo(context)
+                      child: ApplicationLogoWidthTextWidget()
                     ),
                     Padding(
                       padding: const EdgeInsets.only(top: 67),
@@ -221,27 +222,6 @@ class LoginView extends BaseLoginView {
     );
   }
 
-  Widget _buildAppLogo(BuildContext buildContext) {
-    return Row(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        SvgPicture.asset(
-          controller.imagePaths.icTMailLogo,
-          fit: BoxFit.fill,
-          width: 36,
-          height: 36,
-          alignment: Alignment.center),
-        Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 10),
-          child: Text(
-            AppLocalizations.of(buildContext).app_name,
-            style: const TextStyle(color: Colors.black, fontSize: 24, fontWeight: FontWeight.bold),
-            textAlign: TextAlign.center),
-        ),
-      ]
-    );
-  }
-
   Widget _buildLoadingProgress(BuildContext context) {
     return Obx(() => controller.viewState.value.fold(
       (failure) {

diff --git a/lib/features/mailbox/presentation/mailbox_view_web.dart b/lib/features/mailbox/presentation/mailbox_view_web.dart
@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:model/model.dart';
 import 'package:package_info_plus/package_info_plus.dart';
+import 'package:tmail_ui_user/features/base/widget/application_logo_with_text_widget.dart';
 import 'package:tmail_ui_user/features/base/widget/scrollbar_list_view.dart';
 import 'package:tmail_ui_user/features/mailbox/presentation/base_mailbox_view.dart';
 import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_categories.dart';
@@ -61,13 +62,7 @@ class MailboxView extends BaseMailboxView {
           start: controller.responsiveUtils.isDesktop(context) ? 32 : 16,
         ),
         child: Row(children: [
-          SloganBuilder(
-            sizeLogo: 24,
-            text: AppLocalizations.of(context).app_name,
-            textAlign: TextAlign.center,
-            textStyle: const TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),
-            logoSVG: controller.imagePaths.icTMailLogo
-          ),
+          ApplicationLogoWidthTextWidget(),
           Obx(() {
             if (controller.mailboxDashBoardController.appInformation.value != null) {
               return _buildVersionInformation(context, controller.mailboxDashBoardController.appInformation.value!);

diff --git a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart
@@ -4,6 +4,7 @@ import 'package:flutter_portal/flutter_portal.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
 import 'package:model/mailbox/presentation_mailbox.dart';
+import 'package:tmail_ui_user/features/base/widget/application_logo_with_text_widget.dart';
 import 'package:tmail_ui_user/features/base/widget/popup_item_no_icon_widget.dart';
 import 'package:tmail_ui_user/features/composer/presentation/composer_view_web.dart';
 import 'package:tmail_ui_user/features/email/presentation/email_view.dart';
@@ -67,13 +68,8 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView {
                         alignment: Alignment.center,
                         height: 80,
                         child: Row(children: [
-                          SloganBuilder(
-                            sizeLogo: 24,
-                            text: AppLocalizations.of(context).app_name,
-                            textAlign: TextAlign.center,
-                            textStyle: const TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),
-                            logoSVG: controller.imagePaths.icTMailLogo,
-                            onTapCallback: controller.redirectToInboxAction,
+                          ApplicationLogoWidthTextWidget(
+                            onTapAction: controller.redirectToInboxAction,
                           ),
                           Obx(() {
                             if (controller.appInformation.value != null) {