feat: impl WelcomeScreen according to Figma design (InProgress)

- add some variables to arb files & generated translation files
- rename `WelcomePage` to `WelcomeScreen` & update where it is used
- impl `WelcomeScreen` widgets
- add `primaryLight` color to AppColors
- add some welcomeScreen Icon to project source

lib/l10n/app_en.arb

@@ -4,5 +4,8 @@
   "subtitle": "Welcome to Localization",
   "description": "You have pushed the button this many times:",
   "switch_language": "Switch language",
-  "applications": "Applications"
+  "applications": "Applications",
+  "welcome_title": "Welcome to the Future of Blockchain with Pactus!",
+  "welcome_description": "Where the future of blockchain unfolds with trust and transparency in every transaction. Join us in shaping a decentralized revolution!",
+  "start_button_text": "Get Started"
 }

lib/l10n/app_es.arb

@@ -4,5 +4,8 @@
   "subtitle": "Bienvenido a Localización",
   "description": "Has pulsado el botón tantas veces:",
   "switch_language": "Cambiar idioma",
-  "applications": "Applications"
+  "applications": "Applications",
+  "welcome_title": "Bienvenido al futuro de la cadena de bloques con Pactus!",
+  "welcome_description": "Donde el futuro de la cadena de bloques se desarrolla con confianza y transparencia en cada transacción. Únase a nosotros para dar forma a una revolución descentralizada!",
+  "start_button_text": "Empezar"
 }

lib/l10n/app_fr.arb

@@ -4,5 +4,8 @@
   "subtitle": "Bienvenue dans Localisation",
   "description": "Vous avez appuyé sur le bouton autant de fois :",
   "switch_language": "Changer de langue",
-  "applications": "Applications"
+  "applications": "Applications",
+  "welcome_title": "Bienvenue dans le futur de la Blockchain avec Pactus!",
+  "welcome_description": "Là où lavenir de la blockchain se dévoile avec confiance et transparence dans chaque transaction. Rejoignez-nous pour façonner une révolution décentralisée!",
+  "start_button_text": "Commencer"
 }

lib/src/core/common/colors/app_colors.dart

@@ -3,5 +3,6 @@ import 'package:fluent_ui/fluent_ui.dart';
 class AppColors {
   AppColors._();
   static const primaryDark = Color(0xFF242424);
+  static const primaryLight = Color(0xFFFFFFFF);
   static const splashBackground = Color(0xFF00142E);
 }

lib/src/core/router/registration_routes.dart

@@ -8,14 +8,14 @@ import 'package:gui/src/features/master_password/presentation/screen/master_pass
 import 'package:gui/src/features/password/presentation/screen/password_page.dart';
 import 'package:gui/src/features/restoration_seed/presentation/screen/restoration_seed_page.dart';
 import 'package:gui/src/features/validator_config/presentation/screen/validator_config_page.dart';
-import 'package:gui/src/features/welcome/presentation/screen/welcome_page.dart';
+import 'package:gui/src/features/welcome/presentation/screen/welcome_screen.dart';
 import 'route_name.dart';
 
 final List<GoRoute> registrationRoutes = [
   GoRoute(
     path: AppRoute.welcome.fullPath,
     name: AppRoute.welcome.name,
-    builder: (context, state) => const WelcomePage(),
+    builder: (context, state) => const WelcomeScreen(),
     routes: [
       GoRoute(
         path: AppRoute.initializeMode.path,

lib/src/core/utils/gen/localization/codegen_loader.dart

@@ -32,20 +32,35 @@ class CodegenLoader {
     'description': 'You have pushed the button this many times:',
     'switch_language': 'Switch language',
     'applications': 'Applications',
+    'welcome_title': 'Welcome to the Future of Blockchain with Pactus!',
+    'welcome_description': 'Where the future of blockchain unfolds with trust'
+        ' and transparency in every transaction. Join us in shaping'
+        ' a decentralized revolution!',
+    'start_button_text': 'Get Started',
   };
   static const Map<String, dynamic> frFR = {
     'title': 'Bonjour le monde  !',
     'subtitle': 'Bienvenue dans Localisation',
     'description': 'Vous avez appuyé sur le bouton autant de fois :',
     'switch_language': 'Changer de langue',
     'applications': 'Applications',
+    'welcome_title': 'Bienvenue dans le futur de la Blockchain avec Pactus!',
+    'welcome_description': 'Là où lavenir de la blockchain se dévoile avec'
+        ' confiance et transparence dans chaque transaction. Rejoignez-nous'
+        ' pour façonner une révolution décentralisée!',
+    'start_button_text': 'Commencer',
   };
   static const Map<String, dynamic> esES = {
     'title': '¡Hola, Mundo  !',
     'subtitle': 'Bienvenido a Localización',
     'description': 'Has pulsado el botón tantas veces:',
     'switch_language': 'Cambiar idioma',
     'applications': 'Applications',
+    'welcome_title': 'Bienvenido al futuro de la cadena de bloques con Pactus!',
+    'welcome_description': 'Donde el futuro de la cadena de bloques'
+        ' se desarrolla con confianza y transparencia en cada transacción.'
+        ' Únase a nosotros para dar forma a una revolución descentralizada!',
+    'start_button_text': 'Empezar',
   };
 
   static const Map<String, Map<String, dynamic>> mapLocales = {

lib/src/core/utils/gen/localization/locale_keys.dart

@@ -5,4 +5,7 @@ abstract class LocaleKeys {
   static const String description = 'description';
   static const String switch_language = 'switch_language';
   static const String applications = 'applications';
+  static const String welcome_title = 'welcome_title';
+  static const String welcome_description = 'welcome_description';
+  static const String start_button_text = 'start_button_text';
 }

lib/src/features/welcome/presentation/screen/welcome_screen.dart

@@ -0,0 +1,74 @@
+import 'package:fluent_ui/fluent_ui.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:gap/gap.dart';
+import 'package:go_router/go_router.dart';
+import 'package:gui/src/core/common/colors/app_colors.dart';
+import 'package:gui/src/core/router/route_name.dart';
+import 'package:gui/src/core/utils/assets/assets.gen.dart';
+import 'package:gui/src/core/utils/gen/localization/locale_keys.dart';
+import 'package:gui/src/features/main/language/core/localization_extension.dart';
+import 'package:pactus_gui_widgetbook/app_styles.dart';
+///to-do #68: add components for this screen after designing process complete
+/// by Pouria
+class WelcomeScreen extends StatelessWidget {
+  const WelcomeScreen({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return NavigationView(
+      content: SingleChildScrollView(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            const Gap(70),
+            SvgPicture.asset(
+              Assets.icons.icWelcomePactus,
+              width: 668,
+              height: 459,
+            ),
+            const Gap(40),
+            Text(
+              context.tr(LocaleKeys.welcome_title),
+              style: InterTextStyles.bodyBold.copyWith(
+                color: AppColors.primaryDark,
+              ),
+            ),
+            const Gap(16),
+            Text(
+              context.tr(LocaleKeys.welcome_description),
+              style: InterTextStyles.smallRegular.copyWith(
+                color: AppColors.primaryDark,
+              ),
+              softWrap: true,textAlign: TextAlign.center,
+            ),
+            const Gap(16),
+            Button(
+              style: ButtonStyle(
+                padding: WidgetStateProperty.all<EdgeInsetsDirectional?>(
+                    EdgeInsetsDirectional.symmetric
+                      (horizontal: 24,vertical: 4),
+                ),
+                backgroundColor: WidgetStateProperty.all(Color(0xFF0066B4)),
+                shape: WidgetStateProperty.all(
+                  RoundedRectangleBorder(
+                    borderRadius: BorderRadius.circular(4),
+                  ),
+                ),
+              ),
+              onPressed: () {
+                context.goNamed(AppRoute.initializeMode.name);
+              },
+              child: Text(
+                context.tr(LocaleKeys.start_button_text),
+                style: InterTextStyles.bodyBold.copyWith(
+                  color: AppColors.primaryLight,
+                ),
+              ),
+            ),
+            const Gap(50),
+          ],
+        ),
+      ),
+    );
+  }
+}