diff --git a/assets/images/phone.svg b/assets/images/phone.svg new file mode 100644 index 00000000..1ccb7793 --- /dev/null +++ b/assets/images/phone.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/whatsapp.svg b/assets/images/whatsapp.svg new file mode 100644 index 00000000..c89923b5 --- /dev/null +++ b/assets/images/whatsapp.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/translations/ar.json b/assets/translations/ar.json index 77a718a0..48b8c13b 100644 --- a/assets/translations/ar.json +++ b/assets/translations/ar.json @@ -10,5 +10,8 @@ "myRequests" : "طلباتي", "myAssets" : "ممتلكاتي", "contactUs": "اتصل بنا", - "welcome" : "مرحبا،" + "welcome" : "مرحبا،", + "openWhatsapp" : "الإنتقال الى الواتس اب", + "callUs" : "إتصل بنا", + "liveChat" : "محادثة حية" } \ No newline at end of file diff --git a/assets/translations/en.json b/assets/translations/en.json index 22f10d65..a6c3d5ae 100644 --- a/assets/translations/en.json +++ b/assets/translations/en.json @@ -10,5 +10,8 @@ "myRequests" : "My Request", "myAssets" : "My Assets", "contactUs": "Contact Us", - "welcome" : "Welcome," + "welcome" : "Welcome,", + "openWhatsapp" : "Open WhatsApp", + "callUs" : "Call Us", + "liveChat" : "Live Chat" } \ No newline at end of file diff --git a/lib/models/enums/translation_keys.dart b/lib/models/enums/translation_keys.dart index 67d5edf5..29191979 100644 --- a/lib/models/enums/translation_keys.dart +++ b/lib/models/enums/translation_keys.dart @@ -1 +1,17 @@ -enum TranslationKeys { login, enterCredsToLogin, forgotPassword, password, username, requiredField, passwordLengthMessage, overview, myRequests, myAssets, contactUs, welcome } +enum TranslationKeys { + login, + enterCredsToLogin, + forgotPassword, + password, + username, + requiredField, + passwordLengthMessage, + overview, + myRequests, + myAssets, + contactUs, + welcome, + openWhatsapp, + liveChat, + callUs +} diff --git a/lib/new_views/app_style/app_themes.dart b/lib/new_views/app_style/app_themes.dart index a9c5d9d2..b19ac7dd 100644 --- a/lib/new_views/app_style/app_themes.dart +++ b/lib/new_views/app_style/app_themes.dart @@ -9,9 +9,7 @@ class AppThemes { indicatorColor: AppColor.primary50, scaffoldBackgroundColor: AppColor.backgroundLight, colorScheme: const ColorScheme.light(primary: AppColor.primary50, onPrimary: Colors.white, secondary: Colors.white, onSecondary: AppColor.neutral70), - floatingActionButtonTheme: const FloatingActionButtonThemeData( - backgroundColor: AppColor.backgroundDark, - ), + floatingActionButtonTheme: const FloatingActionButtonThemeData(backgroundColor: AppColor.backgroundDark), bottomNavigationBarTheme: BottomNavigationBarThemeData( type: BottomNavigationBarType.fixed, unselectedLabelStyle: ThemeData.light().textTheme.bodySmall?.copyWith(fontWeight: FontWeight.w500), @@ -21,6 +19,11 @@ class AppThemes { backgroundColor: Colors.white, ), appBarTheme: const AppBarTheme(backgroundColor: AppColor.backgroundLight, titleTextStyle: TextStyle(color: AppColor.neutral50)), + cardTheme: ThemeData.light().cardTheme.copyWith( + elevation: 3, + shadowColor: Colors.white.withOpacity(0.05), + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), + ), ); static ThemeData darkTheme = ThemeData.dark().copyWith( @@ -39,5 +42,10 @@ class AppThemes { backgroundColor: AppColor.neutral60, ), appBarTheme: const AppBarTheme(backgroundColor: AppColor.backgroundDark, titleTextStyle: TextStyle(color: AppColor.neutral30)), + cardTheme: ThemeData.dark().cardTheme.copyWith( + elevation: 3, + shadowColor: Colors.white.withOpacity(0.05), + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), + ), ); } diff --git a/lib/new_views/pages/land_page/contact_us_bottom_sheet.dart b/lib/new_views/pages/land_page/contact_us_bottom_sheet.dart new file mode 100644 index 00000000..e10d7799 --- /dev/null +++ b/lib/new_views/pages/land_page/contact_us_bottom_sheet.dart @@ -0,0 +1,97 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:test_sa/extensions/context_extension.dart'; +import 'package:test_sa/extensions/int_extensions.dart'; +import 'package:test_sa/models/enums/translation_keys.dart'; + +import '../../app_style/app_color.dart'; + +class ContactUsBottomSheet extends StatelessWidget { + const ContactUsBottomSheet({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return Container( + height: 300.toScreenHeight, + clipBehavior: Clip.antiAlias, + decoration: BoxDecoration( + color: Theme.of(context).scaffoldBackgroundColor, + borderRadius: const BorderRadius.only( + topRight: Radius.circular(30), + topLeft: Radius.circular(30), + ), + ), + padding: EdgeInsets.symmetric(horizontal: 16.toScreenWidth, vertical: 8.toScreenHeight), + child: Column( + children: [ + Container( + width: 40.toScreenWidth, + height: 5.toScreenHeight, + decoration: BoxDecoration(color: AppColor.neutral40, borderRadius: BorderRadius.circular(30)), + ), + Align( + alignment: AlignmentDirectional.centerStart, + child: Padding( + padding: EdgeInsets.symmetric(vertical: 16.toScreenHeight), + child: Text( + context.translate(TranslationKeys.contactUs), + style: Theme.of(context).textTheme.titleLarge?.copyWith(fontWeight: FontWeight.w600), + ), + ), + ), + Row( + children: [ + Expanded(child: _ContactCard(iconName: "phone", title: context.translate(TranslationKeys.callUs), subtitle: "+966 546345567")), + 16.width, + Expanded( + child: _ContactCard( + iconName: "whatsapp", + title: context.translate(TranslationKeys.liveChat), + subtitle: context.translate(TranslationKeys.openWhatsapp), + ), + ), + ], + ), + ], + ), + ); + } +} + +class _ContactCard extends StatelessWidget { + final String iconName, title, subtitle; + const _ContactCard({ + Key key, + @required this.iconName, + @required this.title, + @required this.subtitle, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + return Card( + child: Padding( + padding: EdgeInsets.all(16.toScreenWidth), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SvgPicture.asset( + "assets/images/$iconName.svg", + width: 32.toScreenWidth, + color: context.isDark ? AppColor.primary40 : AppColor.primary70, + ), + 30.height, + Text( + title, + style: Theme.of(context).textTheme.titleLarge?.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50), + ), + Text( + subtitle, + style: Theme.of(context).textTheme.bodyMedium?.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), + ), + ], + ), + ), + ); + } +} diff --git a/lib/new_views/pages/land_page/land_page.dart b/lib/new_views/pages/land_page/land_page.dart index dfdb3552..1df3ba7a 100644 --- a/lib/new_views/pages/land_page/land_page.dart +++ b/lib/new_views/pages/land_page/land_page.dart @@ -4,10 +4,13 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:test_sa/extensions/int_extensions.dart'; import 'package:test_sa/new_views/common_widgets/app_bar/home_app_bar.dart'; +import 'package:test_sa/new_views/pages/land_page/my_assets_page.dart'; +import 'package:test_sa/new_views/pages/land_page/my_requests_page.dart'; import '../../common_widgets/app_bottom_nav_bar.dart'; import '../../common_widgets/app_drawer.dart'; import '../../common_widgets/app_floating_button.dart'; +import 'contact_us_bottom_sheet.dart'; import 'dashboard_page.dart'; class LandPage extends StatefulWidget { @@ -23,9 +26,8 @@ class _LandPageState extends State { int currentPageIndex = 0; final List _pages = const [ DashboardPage(), - Text('Index 1'), - Text('Index 2'), - Text('Index 3'), + MyRequestsPage(), + MyAssetsPage(), ]; @override @@ -64,9 +66,18 @@ class _LandPageState extends State { bottomNavigationBar: AppBottomNavigationBar( selectedIndex: currentPageIndex, onPressed: (index) { - setState(() { - currentPageIndex = index; - }); + if (index == 3) { + showModalBottomSheet( + context: context, + useSafeArea: true, + backgroundColor: Colors.transparent, + builder: (context) => const ContactUsBottomSheet(), + ); + } else { + setState(() { + currentPageIndex = index; + }); + } }, ), ), diff --git a/lib/new_views/pages/land_page/my_assets_page.dart b/lib/new_views/pages/land_page/my_assets_page.dart new file mode 100644 index 00000000..cbb5f6d8 --- /dev/null +++ b/lib/new_views/pages/land_page/my_assets_page.dart @@ -0,0 +1,14 @@ +import 'package:flutter/material.dart'; + +class MyAssetsPage extends StatelessWidget { + const MyAssetsPage({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return const Scaffold( + body: Center( + child: Text("My Assets"), + ), + ); + } +} diff --git a/lib/new_views/pages/land_page/my_requests_page.dart b/lib/new_views/pages/land_page/my_requests_page.dart new file mode 100644 index 00000000..ccccada1 --- /dev/null +++ b/lib/new_views/pages/land_page/my_requests_page.dart @@ -0,0 +1,14 @@ +import 'package:flutter/material.dart'; + +class MyRequestsPage extends StatelessWidget { + const MyRequestsPage({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return const Scaffold( + body: Center( + child: Text("My Requests"), + ), + ); + } +}