From 561972bc0df531374bf8df8fd4bd6a88a0e23243 Mon Sep 17 00:00:00 2001 From: dab246 Date: Thu, 3 Jul 2025 02:41:02 +0700 Subject: [PATCH] Apply new style Preferences part in Settings Signed-off-by: dab246 --- .../preferences/preferences_view.dart | 51 +++++++++++-------- .../widgets/setting_option_item.dart | 26 +++++----- .../widgets/setting_header_widget.dart | 40 ++++++++++----- 3 files changed, 71 insertions(+), 46 deletions(-) diff --git a/lib/features/manage_account/presentation/preferences/preferences_view.dart b/lib/features/manage_account/presentation/preferences/preferences_view.dart index 2e02d2b49..f02742563 100644 --- a/lib/features/manage_account/presentation/preferences/preferences_view.dart +++ b/lib/features/manage_account/presentation/preferences/preferences_view.dart @@ -3,9 +3,11 @@ import 'package:get/get.dart'; import 'package:tmail_ui_user/features/base/mixin/app_loader_mixin.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/base/setting_detail_view_builder.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/menu/settings_utils.dart'; +import 'package:tmail_ui_user/features/manage_account/presentation/model/account_menu_item.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/model/setting_option_type.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/preferences/preferences_controller.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/preferences/widgets/setting_option_item.dart'; +import 'package:tmail_ui_user/features/manage_account/presentation/widgets/setting_header_widget.dart'; class PreferencesView extends GetWidget with AppLoaderMixin { const PreferencesView({super.key}); @@ -41,30 +43,39 @@ class PreferencesView extends GetWidget with AppLoaderMix controller.responsiveUtils, ), width: double.infinity, - padding: SettingsUtils.getPreferencesSettingPadding( - context, - controller.responsiveUtils, - ), - child: Obx(() { - final settingOption = controller.settingOption.value; + padding: const EdgeInsets.symmetric(vertical: 30, horizontal: 22), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + if (controller.responsiveUtils.isWebDesktop(context)) + const SettingHeaderWidget( + menuItem: AccountMenuItem.preferences, + padding: EdgeInsets.only(bottom: 21), + ), + Obx(() { + final settingOption = controller.settingOption.value; - if (settingOption == null) return const SizedBox.shrink(); + if (settingOption == null) return const SizedBox.shrink(); - final settingOptionList = SettingOptionType.values.toList(); + final settingOptionList = SettingOptionType.values.toList(); - return ListView.separated( - itemCount: settingOptionList.length, - itemBuilder: (context, index) { - return SettingOptionItem( - imagePaths: controller.imagePaths, - settingOption: settingOption, - optionType: settingOptionList[index], - onTapSettingOptionAction: controller.updateStateSettingOption, + return Expanded( + child: ListView.separated( + itemCount: settingOptionList.length, + itemBuilder: (context, index) { + return SettingOptionItem( + imagePaths: controller.imagePaths, + settingOption: settingOption, + optionType: settingOptionList[index], + onTapSettingOptionAction: controller.updateStateSettingOption, + ); + }, + separatorBuilder: (_, __) => const SizedBox(height: 60), + ), ); - }, - separatorBuilder: (_, __) => const SizedBox(height: 60), - ); - }), + }), + ], + ), ), ), ), diff --git a/lib/features/manage_account/presentation/preferences/widgets/setting_option_item.dart b/lib/features/manage_account/presentation/preferences/widgets/setting_option_item.dart index 677b5b1f4..bfe582b1d 100644 --- a/lib/features/manage_account/presentation/preferences/widgets/setting_option_item.dart +++ b/lib/features/manage_account/presentation/preferences/widgets/setting_option_item.dart @@ -1,6 +1,6 @@ - -import 'package:core/presentation/constants/constants_ui.dart'; +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:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:server_settings/server_settings/tmail_server_settings.dart'; @@ -34,20 +34,22 @@ class SettingOptionItem extends StatelessWidget { children: [ Text( optionType.getTitle(appLocalizations), - style: const TextStyle( - fontFamily: ConstantsUI.fontApp, - fontSize: 15, - height: 20 / 15, - fontWeight: FontWeight.bold, - color: Colors.black, + style: ThemeUtils.textStyleInter600().copyWith( + fontSize: 14, + height: 20 / 14, + letterSpacing: 0.25, + color: AppColor.gray424244, ), ), Padding( - padding: const EdgeInsets.symmetric(vertical: 24), + padding: const EdgeInsets.symmetric(vertical: 8), child: Text( optionType.getExplanation(appLocalizations), - style: Theme.of(context).textTheme.bodySmall?.copyWith( - color: Colors.black, + style: ThemeUtils.textStyleInter400.copyWith( + fontSize: 14, + height: 21.01 / 14, + letterSpacing: -0.15, + color: AppColor.gray424244.withOpacity(0.64), ), ), ), @@ -71,7 +73,7 @@ class SettingOptionItem extends StatelessWidget { Expanded( child: Text( optionType.getToggleDescription(appLocalizations), - style: Theme.of(context).textTheme.bodySmall?.copyWith( + style: ThemeUtils.textStyleBodyBody2().copyWith( color: Colors.black, ), ), diff --git a/lib/features/manage_account/presentation/widgets/setting_header_widget.dart b/lib/features/manage_account/presentation/widgets/setting_header_widget.dart index 4f603f828..f2ecf3ba4 100644 --- a/lib/features/manage_account/presentation/widgets/setting_header_widget.dart +++ b/lib/features/manage_account/presentation/widgets/setting_header_widget.dart @@ -17,22 +17,34 @@ class SettingHeaderWidget extends StatelessWidget { @override Widget build(BuildContext context) { final appLocalizations = AppLocalizations.of(context); - return Padding( - padding: padding ?? const EdgeInsets.all(16), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - menuItem.getName(appLocalizations), - style: ThemeUtils.textStyleHeadingH6(color: Colors.black), - ), - const SizedBox(height: 8), - Text( + + final children = [ + Text( + menuItem.getName(appLocalizations), + style: ThemeUtils.textStyleInter600().copyWith( + color: Colors.black, + ), + ), + if (menuItem.getExplanation(appLocalizations).isNotEmpty) + Padding( + padding: const EdgeInsets.only(top: 8), + child: Text( menuItem.getExplanation(appLocalizations), style: ThemeUtils.textStyleBodyBody1(color: AppColor.steelGray400), ), - ], - ), + ), + ]; + + final child = children.length == 1 + ? children.first + : Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: children, + ); + + return Padding( + padding: padding ?? const EdgeInsets.all(16), + child: child, ); } -} \ No newline at end of file +}