From 2e3681d36d8bb5c9a1359e5ff7a3b5c371ef303a Mon Sep 17 00:00:00 2001 From: aitorarana Date: Fri, 12 Dec 2025 13:42:06 +0100 Subject: [PATCH] added size utils to recoverPassword --- apps/mobile_app/lib/main.dart | 3 ++ apps/mobile_app/pubspec.yaml | 2 + .../new_password/new_password_screen.dart | 39 ++++++++++--------- .../request_recovery_screen.dart | 31 ++++++++------- .../presentation/sent/sent_screen.dart | 21 +++++----- modules/auth/pubspec.yaml | 4 +- packages/utils/lib/src/size_utils.dart | 7 +++- 7 files changed, 60 insertions(+), 47 deletions(-) diff --git a/apps/mobile_app/lib/main.dart b/apps/mobile_app/lib/main.dart index 8d3ebb5d..471095ce 100644 --- a/apps/mobile_app/lib/main.dart +++ b/apps/mobile_app/lib/main.dart @@ -9,6 +9,7 @@ import 'package:sf_app_platform/navigation/app_router.dart'; import 'package:navigation/navigation_module.dart'; import 'package:sf_infrastructure/sf_infrastructure.dart'; import 'package:sf_localizations/sf_localizations.dart'; +import 'package:utils/utils.dart'; Future main() async { WidgetsFlutterBinding.ensureInitialized(); @@ -26,6 +27,8 @@ class PlatformApp extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { + SizeUtils.init(context: context); + return MaterialApp.router( title: 'SaveFamily', theme: ThemeData( diff --git a/apps/mobile_app/pubspec.yaml b/apps/mobile_app/pubspec.yaml index 09555ae8..ec4145f2 100644 --- a/apps/mobile_app/pubspec.yaml +++ b/apps/mobile_app/pubspec.yaml @@ -59,6 +59,8 @@ dependencies: path: ../../packages/fonts sf_infrastructure: path: ../../packages/sf_infrastructure + utils: + path: ../../packages/utils #dependencies go here cupertino_icons: ^1.0.8 diff --git a/modules/auth/lib/src/features/recover_password/presentation/new_password/new_password_screen.dart b/modules/auth/lib/src/features/recover_password/presentation/new_password/new_password_screen.dart index 74e35d38..906a9c35 100644 --- a/modules/auth/lib/src/features/recover_password/presentation/new_password/new_password_screen.dart +++ b/modules/auth/lib/src/features/recover_password/presentation/new_password/new_password_screen.dart @@ -5,6 +5,7 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:get_it/get_it.dart'; import 'package:navigation/navigation.dart'; import 'package:sf_localizations/sf_localizations.dart'; +import 'package:utils/utils.dart'; class NewPasswordScreen extends ConsumerStatefulWidget { final NavigationContract navigationContract; @@ -38,20 +39,20 @@ class NewPasswordScreenState extends ConsumerState { child: SingleChildScrollView(child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ - const Text( + Text( 'Recuperar contraseña', textAlign: TextAlign.center, style: TextStyle( fontWeight: FontWeight.w500, - fontSize: 30/*SizeUtils.getByScreen(small: 30, xl: 26)*/, + fontSize: SizeUtils.getByScreen(small: 30, big: 30, xl: 26), letterSpacing: 0 ), ), - SizedBox(height: 42/*SizeUtils.getBySize(small: 42, big: 32)*/), + SizedBox(height: SizeUtils.getByScreen(small: 42, big: 32)), CustomTextField( showPassword: viewState.passwordVisible, label: 'Nueva contraseña', - labelSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/, + labelSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12), hint: '********', controller: viewModel.passwordController, onVisibilityChanged: viewModel.togglePasswordVisible, @@ -60,7 +61,7 @@ class NewPasswordScreenState extends ConsumerState { CustomTextField( showPassword: viewState.passwordVisible, label: 'Repetir contraseña', - labelSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/, + labelSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12), hint: '********', controller: viewModel.repeatedPasswordController, onVisibilityChanged: viewModel.togglePasswordVisible, @@ -98,13 +99,13 @@ class NewPasswordScreenState extends ConsumerState { ? ThemeCode.buttonPrimary : ThemeCode.buttonSecondary), ), - const Text( + Text( 'Al menos 8 caracteres', - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/) + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12)) ), ], ), - SizedBox(height: 2/*SizeUtils.getBySize(small: 2, big: 4)*/), + SizedBox(height: SizeUtils.getByScreen(small: 2, big: 4)), Row( spacing: 8, children: [ @@ -114,13 +115,13 @@ class NewPasswordScreenState extends ConsumerState { ? ThemeCode.buttonPrimary : ThemeCode.buttonSecondary), ), - const Text( + Text( 'Una mayúscula', - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/) + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12)) ), ], ), - SizedBox(height: 2/*SizeUtils.getBySize(small: 2, big: 4)*/), + SizedBox(height: SizeUtils.getByScreen(small: 2, big: 4)), Row( spacing: 8, children: [ @@ -130,13 +131,13 @@ class NewPasswordScreenState extends ConsumerState { ? ThemeCode.buttonPrimary : ThemeCode.buttonSecondary), ), - const Text( + Text( 'Un número', - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/) + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12)) ), ], ), - SizedBox(height: 2/*SizeUtils.getBySize(small: 2, big: 4)*/), + SizedBox(height: SizeUtils.getByScreen(small: 2, big: 4)), Row( spacing: 8, children: [ @@ -146,18 +147,18 @@ class NewPasswordScreenState extends ConsumerState { ? ThemeCode.buttonPrimary : ThemeCode.buttonSecondary), ), - const Text( + Text( 'Un carácter especial', - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/) + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12)) ), ], ), - SizedBox(height: 32/*SizeUtils.getByScreen(small: 32, xl: 24)*/), + SizedBox(height: SizeUtils.getByScreen(small: 32, big: 32, xl: 24)), Align( alignment: Alignment.bottomLeft, - child: const Text( + child: Text( 'Teléfono móvil', - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/, letterSpacing: 0), + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12), letterSpacing: 0), ) ), SizedBox(height: 8), diff --git a/modules/auth/lib/src/features/recover_password/presentation/request_recovery/request_recovery_screen.dart b/modules/auth/lib/src/features/recover_password/presentation/request_recovery/request_recovery_screen.dart index 27f5547d..38d01e31 100644 --- a/modules/auth/lib/src/features/recover_password/presentation/request_recovery/request_recovery_screen.dart +++ b/modules/auth/lib/src/features/recover_password/presentation/request_recovery/request_recovery_screen.dart @@ -4,6 +4,7 @@ import 'package:flutter/material.dart'; import 'package:navigation/navigation.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:sf_localizations/sf_localizations.dart'; +import 'package:utils/utils.dart'; import '../state/recover_password_view_model.dart'; @@ -22,28 +23,28 @@ class RequestRecoveryScreen extends ConsumerWidget { return Scaffold( backgroundColor: theme.getColorFor(ThemeCode.backgroundPrimary), body: Container( - margin: EdgeInsets.all(30/*SizeUtils.getByScreen(small: 30, xl: 20)*/), + margin: EdgeInsets.all(SizeUtils.getByScreen(small: 30, big: 30, xl: 20)), child: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( "Recuperar contaseña", - style: TextStyle(fontWeight: FontWeight.bold, fontSize: 26/*SizeUtils.getByScreen(small: 30, xl: 26)*/), + style: TextStyle(fontWeight: FontWeight.bold, fontSize: SizeUtils.getByScreen(small: 30, big: 30, xl: 26)), ), - SizedBox(height: 24,/*SizeUtils.getByScreen(small: 24, big: 32),*/), + SizedBox(height: SizeUtils.getByScreen(small: 24, big: 32)), Text( "Introduce tu email para enviarte un enlace de recuperación", textAlign: TextAlign.center, - style: TextStyle(letterSpacing: 0, fontSize: 16/*SizeUtils.getByScreen(small: 28, xl: 16)*/), + style: TextStyle(letterSpacing: 0, fontSize: SizeUtils.getByScreen(small: 18, big: 18, xl: 16)), ), - SizedBox(height: 56,/*SizeUtils.getByScreen(small: 56, big: 48),*/), + SizedBox(height: SizeUtils.getByScreen(small: 56, big: 48)), CustomTextField( label: "Correo electrónico", hint: "Correo electrónico", controller: viewModel.emailController, ), - SizedBox(height: 40/*SizeUtils.getByScreen(small: 40, xl: 28)*/), + SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40, xl: 28)), Align( alignment: Alignment.bottomLeft, child: Text( @@ -51,7 +52,7 @@ class RequestRecoveryScreen extends ConsumerWidget { style: TextStyle(fontSize: 14, letterSpacing: 0), ), ), - SizedBox(height: 8/*SizeUtils.getByScreen(small: 8, xl: 4)*/), + SizedBox(height: 8), Row( children: [ CountryPrefixPicker( @@ -64,7 +65,7 @@ class RequestRecoveryScreen extends ConsumerWidget { }, width: 80, ), - SizedBox(width: 10/*SizeUtils.getByScreen(small: 10, xl: 6)*/), + SizedBox(width: SizeUtils.getByScreen(small: 10, big: 10, xl: 6)), Expanded( child: CustomTextField( hint: "Teléfono", @@ -74,9 +75,9 @@ class RequestRecoveryScreen extends ConsumerWidget { ), ], ), - SizedBox(height: 40/*SizeUtils.getByScreen(small: 40, xl: 28)*/), - if (viewState.errorMessage.isNotEmpty) - ...[Text( + SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40, xl: 28)), + if (viewState.errorMessage.isNotEmpty) ...[ + Text( viewState.errorMessage, textAlign: TextAlign.center, style: const TextStyle( @@ -84,7 +85,7 @@ class RequestRecoveryScreen extends ConsumerWidget { fontSize: 12, ), ), - SizedBox(height: 40/*SizeUtils.getByScreen(small: 40, xl: 28)*/), + SizedBox(height: 40), ], Row( children: [ @@ -92,10 +93,10 @@ class RequestRecoveryScreen extends ConsumerWidget { child: SecondaryButton( onPressed: () => {Navigator.pop(context)}, text: "Volver", - size: 16/*SizeUtils.getByScreen(small: 16, xl: 14)*/, + size: SizeUtils.getByScreen(small: 16, big: 16, xl: 14), ), ), - SizedBox(width: 20/*SizeUtils.getByScreen(small: 20, xl: 10)*/), + SizedBox(width: SizeUtils.getByScreen(small: 20, big: 20, xl: 10)), Expanded( child: PrimaryButton( onPressed: () async { @@ -111,7 +112,7 @@ class RequestRecoveryScreen extends ConsumerWidget { } }, text: "Enviar", - size: 16/*SizeUtils.getByScreen(small: 16, xl: 14)*/, + size: SizeUtils.getByScreen(small: 16, big: 16, xl: 14), color: theme.getColorFor(ThemeCode.buttonSecondary), ), ), diff --git a/modules/auth/lib/src/features/recover_password/presentation/sent/sent_screen.dart b/modules/auth/lib/src/features/recover_password/presentation/sent/sent_screen.dart index 0ab57d92..cbbca3ca 100644 --- a/modules/auth/lib/src/features/recover_password/presentation/sent/sent_screen.dart +++ b/modules/auth/lib/src/features/recover_password/presentation/sent/sent_screen.dart @@ -3,6 +3,7 @@ import 'package:design_system/design_system.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:navigation/navigation.dart'; +import 'package:utils/utils.dart'; import '../state/recover_password_view_model.dart'; @@ -31,11 +32,11 @@ class SentScreen extends ConsumerWidget { textAlign: TextAlign.center, style: TextStyle( fontWeight: FontWeight.w500, - fontSize: 30/*SizeUtils.getByScreen(small: 30, xl: 26)*/, + fontSize: SizeUtils.getByScreen(small: 30, big: 30, xl: 26), letterSpacing: 0, ), ), - SizedBox(height: 48/*SizeUtils.getByScreen(small: 48, xl: 40)*/), + SizedBox(height: SizeUtils.getByScreen(small: 48, big: 48, xl: 40)), Row( mainAxisAlignment: MainAxisAlignment.center, children: [ @@ -43,22 +44,22 @@ class SentScreen extends ConsumerWidget { Icons.check, color: theme.getColorFor(ThemeCode.buttonPrimary), ), - SizedBox(width: 6/*SizeUtils.getByScreen(small: 10, xl: 6)*/), + SizedBox(width: SizeUtils.getByScreen(small: 10, big: 10, xl: 6)), Text( viewState.recoveryFormat == "email" ? "Correo enviado correctamente" : "SMS enviado correctamente", - style: TextStyle(fontSize: 18/*SizeUtils.getByScreen(small: 18, xl: 15)*/, fontWeight: FontWeight.bold), + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 18, xl: 15), fontWeight: FontWeight.bold), ), ], ), - SizedBox(height: 48/*SizeUtils.getByScreen(small: 48, xl: 40)*/), + SizedBox(height: SizeUtils.getByScreen(small: 48, big: 48, xl: 40)), Text( viewState.recoveryFormat == "email" ? "Revisa tu email y haz clic en el enlace para crear una nueva contraseña." : "Revisa tu móvil y sigue las instrucciones para crear una nueva contraseña.", textAlign: TextAlign.center, - style: TextStyle(fontSize: 18/*SizeUtils.getByScreen(small: 18, xl: 15)*/, letterSpacing: 0), + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 18, xl: 15), letterSpacing: 0), ), SizedBox(height: 16), Text( @@ -66,9 +67,9 @@ class SentScreen extends ConsumerWidget { ? "Si no recibes el correo en unos minutos, revisa tu carpeta de spam o pulsa \"Reenviar correo\"." : "Si no recibes el SMS en unos minutos, asegúrate de tener cobertura o pulsa \"Reenviar SMS \".", textAlign: TextAlign.center, - style: TextStyle(fontSize: 14/*SizeUtils.getByScreen(small: 14, xl: 12)*/, letterSpacing: 0), + style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12), letterSpacing: 0), ), - SizedBox(height: 48/*SizeUtils.getByScreen(small: 48, xl: 40)*/), + SizedBox(height: SizeUtils.getByScreen(small: 48, big: 48, xl: 40)), Row( children: [ Expanded( @@ -83,7 +84,7 @@ class SentScreen extends ConsumerWidget { text: viewState.recoveryFormat == "email" ? "Reenviar correo" : "Reenviar SMS", - size: 16/*SizeUtils.getByScreen(small: 16, xl: 14)*/, + size: SizeUtils.getByScreen(small: 16, big: 16, xl: 14), ), ), SizedBox(width: 10), @@ -95,7 +96,7 @@ class SentScreen extends ConsumerWidget { ), text: "Continuar", color: theme.getColorFor(ThemeCode.buttonSecondary), - size: 16/*SizeUtils.getByScreen(small: 16, xl: 14)*/, + size: SizeUtils.getByScreen(small: 16, big: 16, xl: 14), ), ), ], diff --git a/modules/auth/pubspec.yaml b/modules/auth/pubspec.yaml index d8ff6537..d5eff810 100644 --- a/modules/auth/pubspec.yaml +++ b/modules/auth/pubspec.yaml @@ -21,9 +21,11 @@ dependencies: navigation: path: ../../packages/navigation sf_localizations: - path: ../../packages/sf_localizations + path: ../../packages/sf_localizations sf_infrastructure: path: ../../packages/sf_infrastructure + utils: + path: ../../packages/utils #dependencies go here flutter_svg: ^2.2.1 get_it: ^9.0.5 diff --git a/packages/utils/lib/src/size_utils.dart b/packages/utils/lib/src/size_utils.dart index 576cebc0..08b0d3e5 100755 --- a/packages/utils/lib/src/size_utils.dart +++ b/packages/utils/lib/src/size_utils.dart @@ -69,7 +69,9 @@ class SizeUtils { static bool get isMediumScreen => physicalAspectRatioHeight <= 18.0; - static bool get isXLScreen => physicalAspectRatioHeight >= 20.0; + static bool get isBigScreen => physicalAspectRatioHeight <= 20.0; + + static bool get isXLScreen => physicalAspectRatioHeight >= 21.5; static Size get screenSize => Size(width, height); @@ -81,7 +83,8 @@ class SizeUtils { }) { if (isSmallerScreen) return small; if (isMediumScreen) return medium ?? small; - if (isXLScreen && xl != null) return xl; + if (isBigScreen) return big; + if (isXLScreen) return xl ?? big; return big; }