From c8bc75d4226a988695d403f0c062dd9ced9b2029 Mon Sep 17 00:00:00 2001
From: Inex Code <inex.code@selfprivacy.org>
Date: Wed, 1 Feb 2023 00:56:19 +0300
Subject: [PATCH] fix(ui): Make onboarding screen more adaptive

---
 lib/ui/pages/onboarding/onboarding.dart | 134 +++++++++++++-----------
 1 file changed, 72 insertions(+), 62 deletions(-)

diff --git a/lib/ui/pages/onboarding/onboarding.dart b/lib/ui/pages/onboarding/onboarding.dart
index c00b4f12..0247f0eb 100644
--- a/lib/ui/pages/onboarding/onboarding.dart
+++ b/lib/ui/pages/onboarding/onboarding.dart
@@ -45,29 +45,34 @@ class _OnboardingPageState extends State<OnboardingPage> {
           maxHeight: MediaQuery.of(context).size.height,
         ),
         child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
           children: [
-            const SizedBox(height: 30),
-            Text(
-              'onboarding.page1_title'.tr(),
-              style: Theme.of(context).textTheme.headlineSmall,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page1_text'.tr(),
-              style: Theme.of(context).textTheme.bodyMedium,
-            ),
-            const SizedBox(height: 16),
-            Flexible(
-              child: Center(
-                child: Image.asset(
-                  _fileName(
-                    context: context,
-                    path: 'assets/images/onboarding',
-                    fileExtention: 'png',
-                    fileName: 'onboarding1',
+            Expanded(
+              child: ListView(
+                children: [
+                  const SizedBox(height: 30),
+                  Text(
+                    'onboarding.page1_title'.tr(),
+                    style: Theme.of(context).textTheme.headlineSmall,
                   ),
-                ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page1_text'.tr(),
+                    style: Theme.of(context).textTheme.bodyMedium,
+                  ),
+                  const SizedBox(height: 32),
+                  Flexible(
+                    child: Center(
+                      child: Image.asset(
+                        _fileName(
+                          context: context,
+                          path: 'assets/images/onboarding',
+                          fileExtention: 'png',
+                          fileName: 'onboarding1',
+                        ),
+                      ),
+                    ),
+                  ),
+                ],
               ),
             ),
             BrandButton.rised(
@@ -90,49 +95,54 @@ class _OnboardingPageState extends State<OnboardingPage> {
           maxHeight: MediaQuery.of(context).size.height,
         ),
         child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
           children: [
-            const SizedBox(height: 30),
-            Text(
-              'onboarding.page2_title'.tr(),
-              style: Theme.of(context).textTheme.headlineSmall,
+            Expanded(
+              child: ListView(
+                children: [
+                  const SizedBox(height: 30),
+                  Text(
+                    'onboarding.page2_title'.tr(),
+                    style: Theme.of(context).textTheme.headlineSmall,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_text'.tr(),
+                    style: Theme.of(context).textTheme.bodyMedium,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_server_provider_title'.tr(),
+                    style: Theme.of(context).textTheme.titleLarge,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_server_provider_text'.tr(),
+                    style: Theme.of(context).textTheme.bodyMedium,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_dns_provider_title'.tr(),
+                    style: Theme.of(context).textTheme.titleLarge,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_dns_provider_text'.tr(),
+                    style: Theme.of(context).textTheme.bodyMedium,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_backup_provider_title'.tr(),
+                    style: Theme.of(context).textTheme.titleLarge,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'onboarding.page2_backup_provider_text'.tr(),
+                    style: Theme.of(context).textTheme.bodyMedium,
+                  ),
+                  const SizedBox(height: 16),
+                ],
+              ),
             ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_text'.tr(),
-              style: Theme.of(context).textTheme.bodyMedium,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_server_provider_title'.tr(),
-              style: Theme.of(context).textTheme.titleLarge,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_server_provider_text'.tr(),
-              style: Theme.of(context).textTheme.bodyMedium,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_dns_provider_title'.tr(),
-              style: Theme.of(context).textTheme.titleLarge,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_dns_provider_text'.tr(),
-              style: Theme.of(context).textTheme.bodyMedium,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_backup_provider_title'.tr(),
-              style: Theme.of(context).textTheme.titleLarge,
-            ),
-            const SizedBox(height: 16),
-            Text(
-              'onboarding.page2_backup_provider_text'.tr(),
-              style: Theme.of(context).textTheme.bodyMedium,
-            ),
-            const SizedBox(height: 16),
             BrandButton.rised(
               onPressed: () {
                 context.read<AppSettingsCubit>().turnOffOnboarding();