applied size utils to onboarding and account created screens

Reviewed-on: #13

modules/auth/lib/src/features/onboarding/presentation/onboarding_screen.dart

@@ -7,6 +7,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';
 
 final onboardingPageControllerProvider = Provider.autoDispose<PageController>((
   ref,
@@ -57,19 +58,22 @@ class OnboardingScreen extends ConsumerWidget {
                     image: page.image,
                     title: page.title,
                     subtitle: page.subtitle,
+                    isLast: isLast,
                   );
                 },
               ),
             ),
+            SizedBox(height: SizeUtils.getByScreen(small: 36, big: 28)),
             StepIndicator(
               current: state.cardIndex + 1,
               total: onboardingPages.length,
               color: const Color(0xFF4A4A4A),
             ),
-            const SizedBox(height: 38),
+            SizedBox(height: SizeUtils.getByScreen(small: 38, big: 38)),
             Container(
               padding: const EdgeInsets.symmetric(horizontal: 24),
               width: double.infinity,
+              height: SizeUtils.getByScreen(small: 64, big: 62),
               child: TextButton(
                 onPressed: goToNext,
                 style: TextButton.styleFrom(
@@ -117,7 +121,7 @@ class OnboardingScreen extends ConsumerWidget {
                       ),
               ),
             ),
-            const SizedBox(height: 48),
+            SizedBox(height: SizeUtils.getByScreen(small: 24, big: 48)),
           ],
         ),
       ),

modules/auth/lib/src/features/onboarding/presentation/widgets/onboarding_content.dart

@@ -1,17 +1,20 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:sf_localizations/sf_localizations.dart';
+import 'package:utils/utils.dart';
 
 class OnboardingContent extends StatelessWidget {
   final String image;
   final String title;
   final String subtitle;
+  final bool isLast;
 
   const OnboardingContent({
     super.key,
     required this.image,
     required this.title,
     required this.subtitle,
+    required this.isLast,
   });
 
   @override
@@ -22,13 +25,15 @@ class OnboardingContent extends StatelessWidget {
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
           Flexible(flex: 3, child: SvgPicture.asset(image)),
-          const SizedBox(height: 48),
+          isLast
+            ? SizedBox(height: SizeUtils.getByScreen(small: 24, big: 48))
+            : SizedBox(height: SizeUtils.getByScreen(small: 48, big: 68)),
           Text(
             context.translate(title),
             textAlign: TextAlign.center,
-            style: const TextStyle(
-              fontWeight: FontWeight.w700,
-              fontSize: 28,
+            style: TextStyle(
+              fontWeight: FontWeight.w500,
+              fontSize: SizeUtils.getByScreen(small: 28, big: 28),
               height: 1.4,
               letterSpacing: 0.3,
               color: Color(0xFF4A4A4A),
@@ -38,7 +43,7 @@ class OnboardingContent extends StatelessWidget {
           Text(
             context.translate(subtitle),
             textAlign: TextAlign.center,
-            style: const TextStyle(
+            style: TextStyle(
               fontSize: 18,
               height: 1.4,
               letterSpacing: 0.3,

modules/auth/lib/src/features/sign_up/presentation/screens/account_created_screen.dart

@@ -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 AccountCreatedScreen extends ConsumerWidget {
   final NavigationContract navigationContract;
@@ -23,68 +24,68 @@ class AccountCreatedScreen extends ConsumerWidget {
       backgroundColor: theme.getColorFor(ThemeCode.backgroundPrimary),
       body: Container(
         margin: const EdgeInsets.all(30),
-        child: Center(
-          child: Column(
-            children: [
-              const Spacer(flex: 10),
-              Icon(
-                Icons.check,
-                color: theme.getColorFor(ThemeCode.buttonPrimary),
-                size: 50,
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Icon(
+              Icons.check,
+              color: theme.getColorFor(ThemeCode.buttonPrimary),
+              size: 50,
+            ),
+            const SizedBox(height: 20),
+            Text(
+              context.translate(I18n.accountCreatedTitle),
+              style: const TextStyle(
+                fontSize: 30,
+                fontWeight: FontWeight.bold,
               ),
-              const SizedBox(height: 20),
-              Text(
-                context.translate(I18n.accountCreatedTitle),
-                style: const TextStyle(
-                  fontSize: 30,
-                  fontWeight: FontWeight.bold,
-                ),
-              ),
-              const SizedBox(height: 20),
+            ),
+            const SizedBox(height: 20),
 
-              Text.rich(
-                textAlign: TextAlign.center,
-                TextSpan(
-                  text: '${context.translate(I18n.accountCreatedForLabel)}\n',
-                  children: [
-                    TextSpan(
-                      text: fullName,
-                      style: const TextStyle(fontWeight: FontWeight.bold),
-                    ),
-                  ],
-                ),
+            Text.rich(
+              textAlign: TextAlign.center,
+              TextSpan(
+                text: '${context.translate(I18n.accountCreatedForLabel)}\n',
+                style: TextStyle(fontSize: SizeUtils.getByScreen(small: 16, big: 15, xl: 14)),
+                children: [
+                  TextSpan(
+                    text: fullName,
+                    style: const TextStyle(fontWeight: FontWeight.bold),
+                  ),
+                ],
               ),
+            ),
 
-              const SizedBox(height: 16),
-              Text.rich(
-                textAlign: TextAlign.center,
-                TextSpan(
-                  text:
-                      '${context.translate(I18n.accountCreatedEmailVerificationSentLabel)}\n',
-                  children: [
-                    TextSpan(
-                      text: email,
-                      style: const TextStyle(fontWeight: FontWeight.bold),
-                    ),
-                  ],
-                ),
+            SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40)),
+            Text.rich(
+              textAlign: TextAlign.center,
+              TextSpan(
+                text:
+                  '${context.translate(I18n.accountCreatedEmailVerificationSentLabel)}\n',
+                style: TextStyle(fontSize: SizeUtils.getByScreen(small: 15, big: 15, xl: 13)),
+                children: [
+                  TextSpan(
+                    text: email,
+                    style: const TextStyle(fontWeight: FontWeight.bold),
+                  ),
+                ],
               ),
+            ),
 
-              const SizedBox(height: 20),
-              Text(
-                context.translate(I18n.accountCreatedChildSetupHint),
-                textAlign: TextAlign.center,
-              ),
+            SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40)),
+            Text(
+              context.translate(I18n.accountCreatedChildSetupHint),
+              textAlign: TextAlign.center,
+              style: TextStyle(fontSize: SizeUtils.getByScreen(small: 16, big: 15, xl: 13)),
+            ),
 
-              const SizedBox(height: 20),
-              PrimaryButton(
-                onPressed: () => navigationContract.goTo(AppRoutes.login),
-                text: context.translate(I18n.accountCreatedContinue),
-                color: theme.getColorFor(ThemeCode.buttonPrimary),
-              ),
-              const Spacer(flex: 8),
-            ],
-          ),
+            SizedBox(height: SizeUtils.getByScreen(small: 40, big: 40)),
+            PrimaryButton(
+              onPressed: () => navigationContract.goTo(AppRoutes.login),
+              text: context.translate(I18n.accountCreatedContinue),
+              color: theme.getColorFor(ThemeCode.buttonPrimary),
+            ),
+          ],
         ),
       ),
     );