Compare commits

...

1 Commits

Author SHA1 Message Date
4be6a30a33 applied size utils to auth module 2026-01-08 16:24:02 +01:00
15 changed files with 113 additions and 81 deletions

View File

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:navigation/navigation.dart';
import 'package:sf_localizations/sf_localizations.dart';
import 'package:utils/utils.dart';
class RequestLinkPhoneScreen extends ConsumerWidget {
final NavigationContract navigationContract;
@@ -27,19 +28,22 @@ class RequestLinkPhoneScreen extends ConsumerWidget {
Text(
context.translate(I18n.linkPhoneTitle),
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 30,
style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 30, big: 28, xl: 26),
fontWeight: FontWeight.w500,
letterSpacing: 0,
),
),
const SizedBox(height: 24),
SizedBox(height: SizeUtils.getByScreen(small: 24, big: 22, xl: 20)),
Text(
context.translate(I18n.linkPhoneSubtitle),
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 16, letterSpacing: 0),
style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 16, big: 16, xl: 14),
letterSpacing: 0
),
),
const SizedBox(height: 48),
SizedBox(height: SizeUtils.getByScreen(small: 48, big: 46, xl: 44)),
Column(
spacing: 8,
@@ -89,7 +93,7 @@ class RequestLinkPhoneScreen extends ConsumerWidget {
),
],
const SizedBox(height: 24),
SizedBox(height: SizeUtils.getByScreen(small: 10, big: 10)),
PrimaryButton(
onPressed: () async {

View File

@@ -5,6 +5,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';
class VerifyLinkPhoneCodeScreen extends ConsumerWidget {
final NavigationContract navigationContract;
@@ -34,30 +35,32 @@ class VerifyLinkPhoneCodeScreen extends ConsumerWidget {
children: [
Text(
context.translate(I18n.connect),
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 30),
style: TextStyle(fontWeight: FontWeight.bold, fontSize: SizeUtils.getByScreen(small: 30, big: 28)),
),
const SizedBox(height: 24),
Text.rich(
TextSpan(
text: context.translate(I18n.verificationCodeSentTo),
style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 18, big: 15),
),
children: [
TextSpan(
text: '${viewState.dialCode}${viewState.phoneNumber}',
style: const TextStyle(
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18,
),
),
],
),
textAlign: TextAlign.center,
),
const SizedBox(height: 48),
SizedBox(height: SizeUtils.getByScreen(small: 48, big: 42, xl: 36)),
Text(
context.translate(I18n.enterCodeHere),
style: TextStyle(fontSize: 16),
),
const SizedBox(height: 24),
SizedBox(height: SizeUtils.getByScreen(small: 24, big: 24, xl: 20)),
LinkPhoneCodeInput(
length: 6,
@@ -90,21 +93,22 @@ class VerifyLinkPhoneCodeScreen extends ConsumerWidget {
},
text: context.translate(I18n.enter),
color: theme.getColorFor(ThemeCode.buttonPrimary),
size: SizeUtils.getByScreen(small: 18, big: 17, xl: 16),
),
const SizedBox(height: 24),
Text(
context.translate(I18n.didNotReceiveIt),
style: TextStyle(
fontSize: 18,
fontSize: SizeUtils.getByScreen(small: 18, big: 17, xl: 16),
letterSpacing: 0,
height: 1.5,
height: SizeUtils.getByScreen(small: 1.5, big: 0),
),
),
const SizedBox(height: 8),
SizedBox(height: SizeUtils.getByScreen(small: 8, big: 0)),
CustomTextButton(
onPressed: () => navigationContract.goBack(),
text: context.translate(I18n.tryAgain),
size: 18,
size: SizeUtils.getByScreen(small: 18, big: 17, xl: 16),
weight: FontWeight.w500,
),
],

View File

@@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:utils/utils.dart';
class LinkPhoneCodeInput extends StatefulWidget {
const LinkPhoneCodeInput({
@@ -74,8 +75,9 @@ class _LinkPhoneCodeInputState extends State<LinkPhoneCodeInput> {
decoration: const InputDecoration(
hintText: '0',
counterText: '',
border: OutlineInputBorder(),
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(14))),
),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 20, big: 22, xl: 17)),
maxLength: 1,
onChanged: (value) => _onDigitChanged(i, value),
),

View File

@@ -6,6 +6,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:navigation/navigation.dart';
import 'package:sf_localizations/sf_localizations.dart';
import 'package:utils/utils.dart';
class LoginScreen extends ConsumerWidget {
final NavigationContract navigationContract;
@@ -98,27 +99,28 @@ class LoginScreen extends ConsumerWidget {
child: AbsorbPointer(
absorbing: isLoading,
child: SingleChildScrollView(
padding: EdgeInsets.symmetric(horizontal: 24),
padding: EdgeInsets.symmetric(horizontal: SizeUtils.getByScreen(small: 24, big: 24)),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(height: SizeUtils.getByScreen(small: 0, big: 30, xl: 44)),
_Header(theme: theme),
SizedBox(height: 48),
SizedBox(height: SizeUtils.getByScreen(small: 26, big: 30, xl: 40)),
const _EmailSection(),
SizedBox(height: 24),
SizedBox(height: SizeUtils.getByScreen(small: 18, big: 24, xl: 20)),
_PasswordSection(onSubmitted: () => _onLogIn(context, ref)),
SizedBox(height: 16),
_ForgotPassword(navigationContract: navigationContract),
SizedBox(height: 30),
SizedBox(height: SizeUtils.getByScreen(small: 0, big: 24, xl: 22)),
_SignInSection(
theme: theme,
onSignIn: () => _onLogIn(context, ref),
),
SizedBox(height: 30),
SizedBox(height: SizeUtils.getByScreen(small: 30, big: 60, xl: 56)),
_OrContinueWith(theme: theme),
SizedBox(height: 24),
SizedBox(height: SizeUtils.getByScreen(small: 24, big: 24, xl: 26)),
_SocialButtons(theme: theme),
SizedBox(height: 30),
SizedBox(height: SizeUtils.getByScreen(small: 18, big: 36)),
_Footer(navigationContract: navigationContract),
],
),
@@ -140,12 +142,15 @@ class _Header extends StatelessWidget {
Icon(
Icons.check,
color: theme.getColorFor(ThemeCode.buttonPrimary),
size: 54,
size: SizeUtils.getByScreen(small: 54, big: 50, xl: 46),
),
Text(
context.translate(I18n.welcome),
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 30, big: 28, xl: 27),
fontWeight: FontWeight.w500
),
),
],
);
@@ -168,6 +173,7 @@ class _EmailSection extends ConsumerWidget {
CustomTextField(
hint: context.translate(I18n.username),
label: context.translate(I18n.username),
labelSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12),
controller: vm.emailController,
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.next,
@@ -199,6 +205,7 @@ class _PasswordSection extends ConsumerWidget {
CustomTextField(
showPassword: passwordVisible,
label: context.translate(I18n.password),
labelSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12),
hint: '********',
controller: vm.passwordController,
textInputAction: TextInputAction.done,
@@ -227,7 +234,7 @@ class _ForgotPassword extends ConsumerWidget {
onPressed: isLoading
? () {}
: () => navigationContract.pushTo(AppRoutes.recoverPassword),
size: 16,
size: SizeUtils.getByScreen(small: 16, big: 15, xl: 14),
),
);
}
@@ -265,6 +272,7 @@ class _SignInSection extends ConsumerWidget {
),
)
: null,
size: SizeUtils.getByScreen(small: 18, big: 17, xl: 16),
),
if (errorMessage.isNotEmpty)
Padding(
@@ -274,7 +282,7 @@ class _SignInSection extends ConsumerWidget {
textAlign: TextAlign.center,
style: TextStyle(
color: Theme.of(context).colorScheme.error,
fontSize: 13,
fontSize: SizeUtils.getByScreen(small: 13, big: 12, xl: 11),
),
),
),
@@ -328,7 +336,7 @@ class _SocialButtons extends ConsumerWidget {
),
),
radius: 16,
padding: 44,
padding: SizeUtils.getByScreen(small: 44, big: 40, xl: 36),
text: context.translate(I18n.google),
label: 'Google',
),
@@ -336,7 +344,7 @@ class _SocialButtons extends ConsumerWidget {
SecondaryButton(
onPressed: isLoading ? () {} : () {},
radius: 16,
padding: 44,
padding: SizeUtils.getByScreen(small: 44, big: 40, xl: 36),
icon: Icons.apple,
label: 'Apple',
),
@@ -359,20 +367,15 @@ class _Footer extends ConsumerWidget {
children: [
Text(
context.translate(I18n.dontHaveAccount),
style: const TextStyle(fontSize: 18, letterSpacing: 0),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 17, xl: 16), letterSpacing: 0, height: 0),
),
TextButton(
CustomTextButton(
onPressed: isLoading
? null
: () => navigationContract.pushTo(AppRoutes.signup),
child: Text(
context.translate(I18n.createOneNow),
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
letterSpacing: 0,
),
),
text: context.translate(I18n.createOneNow),
size: SizeUtils.getByScreen(small: 18, big: 17, xl: 16),
weight: FontWeight.w500,
),
],
);

View File

@@ -3,6 +3,7 @@ import 'dart:async';
import 'package:auth/src/features/login/presentation/widgets/otp_code_fields.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:utils/utils.dart';
class TwoFactorBottomSheetView extends StatelessWidget {
const TwoFactorBottomSheetView({
@@ -82,8 +83,9 @@ class TwoFactorBottomSheetView extends StatelessWidget {
if (isOtpLoading || !_isValidOtp) return;
unawaited(onVerify());
},
gap: SizeUtils.getByScreen(small: 10, big: 8, xl: 4),
),
const SizedBox(height: 20),
SizedBox(height: SizeUtils.getByScreen(small: 24, big: 38)),
PrimaryButton(
onPressed: (isOtpLoading || !_isValidOtp)
@@ -103,7 +105,7 @@ class TwoFactorBottomSheetView extends StatelessWidget {
: null,
),
const SizedBox(height: 12),
SizedBox(height: SizeUtils.getByScreen(small: 12, big: 9)),
TextButton(
onPressed: isOtpLoading ? null : onClose,

View File

@@ -58,7 +58,7 @@ class NewPasswordScreen extends ConsumerWidget {
// color: viewState.equalPasswords ? const Color(0xFF4B4B4B) : const Color.fromRGBO(239, 17, 17, 1),
),
if (!viewState.equalPasswords) ...[
SizedBox(height: 4),
SizedBox(height: SizeUtils.getByScreen(small: 8, big: 8)),
Row(
spacing: 8,
children: [
@@ -79,7 +79,7 @@ class NewPasswordScreen extends ConsumerWidget {
],
),
],
SizedBox(height: 12),
SizedBox(height: SizeUtils.getByScreen(small: 14, big: 12)),
Row(
spacing: 8,
children: [
@@ -176,7 +176,7 @@ class NewPasswordScreen extends ConsumerWidget {
],
),
SizedBox(
height: SizeUtils.getByScreen(small: 32, big: 32, xl: 24),
height: SizeUtils.getByScreen(small: 28, big: 32, xl: 24),
),
Align(
alignment: Alignment.bottomLeft,

View File

@@ -23,14 +23,14 @@ class RequestRecoveryScreen extends ConsumerWidget {
return Scaffold(
backgroundColor: theme.getColorFor(ThemeCode.backgroundPrimary),
body: Container(
margin: EdgeInsets.all(SizeUtils.getByScreen(small: 30, big: 30, xl: 20)),
margin: EdgeInsets.symmetric(horizontal: SizeUtils.getByScreen(small: 30, big: 30, xl: 20)),
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
context.translate(I18n.recoverPasswordTitle),
style: TextStyle(fontWeight: FontWeight.bold, fontSize: SizeUtils.getByScreen(small: 29, big: 29, xl: 26)),
style: TextStyle(fontWeight: FontWeight.w500, fontSize: SizeUtils.getByScreen(small: 29, big: 27, xl: 26)),
),
SizedBox(height: SizeUtils.getByScreen(small: 24, big: 32)),
Text(
@@ -38,13 +38,13 @@ class RequestRecoveryScreen extends ConsumerWidget {
textAlign: TextAlign.center,
style: TextStyle(letterSpacing: 0, fontSize: SizeUtils.getByScreen(small: 18, big: 18, xl: 16)),
),
SizedBox(height: SizeUtils.getByScreen(small: 56, big: 48)),
SizedBox(height: SizeUtils.getByScreen(small: 56, big: 52)),
CustomTextField(
label: context.translate(I18n.email),
hint: context.translate(I18n.email),
controller: viewModel.emailController,
),
SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40, xl: 28)),
SizedBox(height: SizeUtils.getByScreen(small: 36, big: 36, xl: 26)),
Align(
alignment: Alignment.bottomLeft,
child: Text(

View File

@@ -60,9 +60,9 @@ class SentScreen extends ConsumerWidget {
? context.translate(I18n.checkEmail1)
: context.translate(I18n.checkSms1),
textAlign: TextAlign.center,
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 17, big: 17, xl: 15), letterSpacing: 0),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 17, big: 17, xl: 14), letterSpacing: 0),
),
SizedBox(height: 16),
SizedBox(height: SizeUtils.getByScreen(small: 16, big: 16, xl: 14)),
Text(
viewState.recoveryFormat == "email"
? context.translate(I18n.checkEmail2)
@@ -70,7 +70,7 @@ class SentScreen extends ConsumerWidget {
textAlign: TextAlign.center,
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 14, big: 14, xl: 12), letterSpacing: 0),
),
SizedBox(height: SizeUtils.getByScreen(small: 48, big: 48, xl: 40)),
SizedBox(height: SizeUtils.getByScreen(small: 48, big: 48, xl: 38)),
Row(
children: [
Expanded(

View File

@@ -2,6 +2,7 @@ import 'package:country_code_picker/country_code_picker.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:sf_localizations/sf_localizations.dart';
import 'package:utils/utils.dart';
class SignupAddressScreen extends StatelessWidget {
const SignupAddressScreen({
@@ -145,7 +146,9 @@ class SignupAddressScreen extends StatelessWidget {
const SizedBox(height: 8),
Align(
alignment: Alignment.bottomLeft,
child: Text(birthCountryLabel, style: const TextStyle(fontSize: 14)),
child: Text(birthCountryLabel, style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
)),
),
const SizedBox(height: 8),
Row(
@@ -168,6 +171,7 @@ class SignupAddressScreen extends StatelessWidget {
CustomTextField(
label: streetLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: streetHint,
controller: streetController,
),
@@ -175,6 +179,7 @@ class SignupAddressScreen extends StatelessWidget {
CustomTextField(
label: cityLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: cityHint,
controller: cityController,
),
@@ -182,6 +187,7 @@ class SignupAddressScreen extends StatelessWidget {
CustomTextField(
label: provinceLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: provinceHint,
controller: provinceController,
),
@@ -189,6 +195,7 @@ class SignupAddressScreen extends StatelessWidget {
CustomTextField(
label: stateLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: stateHint,
controller: stateController,
),
@@ -222,6 +229,7 @@ class SignupAddressScreen extends StatelessWidget {
CustomTextField(
label: postCodeLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: postCodeHint,
keyboardType: TextInputType.number,
controller: postCodeController,

View File

@@ -2,6 +2,7 @@ import 'package:country_code_picker/country_code_picker.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:sf_localizations/sf_localizations.dart';
import 'package:utils/utils.dart';
class SignupPersonalScreen extends StatelessWidget {
final TextEditingController firstNameTextFieldController;
@@ -72,12 +73,14 @@ class SignupPersonalScreen extends StatelessWidget {
children: [
CustomTextField(
label: firstNameLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: firstNameHint,
controller: firstNameTextFieldController,
),
const SizedBox(height: 8),
CustomTextField(
label: lastNameLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: lastNameHint,
controller: lastNameTextFieldController,
),
@@ -99,6 +102,7 @@ class SignupPersonalScreen extends StatelessWidget {
Expanded(
child: CustomTextField(
label: documentNumberLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: documentNumberHint,
controller: documentNumberTextFieldController,
),
@@ -108,7 +112,9 @@ class SignupPersonalScreen extends StatelessWidget {
const SizedBox(height: 8),
Align(
alignment: Alignment.bottomLeft,
child: Text(phoneLabel, style: const TextStyle(fontSize: 14)),
child: Text(phoneLabel, style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12)
)),
),
const SizedBox(height: 8),
Row(
@@ -130,11 +136,12 @@ class SignupPersonalScreen extends StatelessWidget {
const SizedBox(height: 8),
CustomTextField(
label: emailLabel,
labelSize: SizeUtils.getByScreen(small: 14, big: 13, xl: 12),
hint: emailHint,
keyboardType: TextInputType.emailAddress,
controller: emailTextFieldController,
),
const SizedBox(height: 8),
CheckboxListTile(
value: acceptTerms,
onChanged: onAcceptTermsPressed,

View File

@@ -1,6 +1,7 @@
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:utils/utils.dart';
class FormStepLayout extends ConsumerWidget {
final int currentStep;
@@ -70,7 +71,7 @@ class FormStepLayout extends ConsumerWidget {
Text(
subtitle!,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 18),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 17)),
),
],
),

View File

@@ -1,6 +1,7 @@
import 'package:auth/src/widgets/form_error_banner.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:utils/utils.dart';
class SignUpLayout extends StatelessWidget {
final ThemePort theme;
@@ -53,24 +54,24 @@ class SignUpLayout extends StatelessWidget {
Text(
supertitle,
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 18),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 16, xl: 15)),
),
const SizedBox(height: 10),
SizedBox(height: SizeUtils.getByScreen(small: 8, big: 5)),
Text(
title,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 30,
fontWeight: FontWeight.bold,
style: TextStyle(
fontSize: SizeUtils.getByScreen(small: 30, big: 28, xl: 26),
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 16),
Text(
subtitle,
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 18),
style: TextStyle(fontSize: SizeUtils.getByScreen(small: 18, big: 17, xl: 15)),
),
const SizedBox(height: 16),
SizedBox(height: SizeUtils.getByScreen(small: 16, big: 20, xl: 36)),
Expanded(
child: SingleChildScrollView(

View File

@@ -1,7 +1,7 @@
import 'package:flutter/material.dart';
class CustomTextButton extends StatelessWidget {
final VoidCallback onPressed;
final VoidCallback? onPressed;
final String text;
final double size;
final FontWeight weight;

View File

@@ -76,18 +76,18 @@ class CustomTextFieldState extends State<CustomTextField> {
gapPadding: 16,
),
suffixIcon: widget.showPassword != null
? IconButton(
icon: Icon(
_showPassword ? Icons.visibility_off : Icons.visibility,
),
onPressed: () {
setState(() {
_showPassword = !_showPassword;
});
},
//onpressed: widget.onVisibilityChanged,
)
: null,
? IconButton(
icon: Icon(
_showPassword ? Icons.visibility_off_outlined : Icons.visibility_outlined,
),
onPressed: () {
setState(() {
_showPassword = !_showPassword;
});
},
//onpressed: widget.onVisibilityChanged,
)
: null,
),
minLines: widget.lines ?? 1,
maxLines: widget.lines ?? 1,

View File

@@ -10,7 +10,7 @@
"next": "Siguiente",
"skip": "Omitir",
"linkPhoneTitle": "¡Nos alegra mucho tenerte por aquí!",
"linkPhoneSubtitle": "Para poder entrar de forma segura, te vamos a enviar un código al teléfono",
"linkPhoneSubtitle": "Para poder entrar de forma segura,\nte vamos a enviar un código al teléfono",
"mobilePhone": "Teléfono móvil",
"phoneNumber": "Teléfono",
"selectYourCountry": "Selecciona tu país",
@@ -18,7 +18,7 @@
"connect": "Conéctate",
"verificationCodeSentTo": "Hemos enviado el código al ",
"enterCodeHere": "Introduce el código aquí",
"enter": "entrar",
"enter": "Entrar",
"didNotReceiveIt": "¿No lo has recibido?",
"tryAgain": "Volver a intentarlo",
"welcome": "¡Te damos la bienvenida!",