diff --git a/refilc/assets/fonts/FigTree/Figtree-SemiBold.ttf b/refilc/assets/fonts/FigTree/Figtree-SemiBold.ttf new file mode 100644 index 0000000..6c83802 Binary files /dev/null and b/refilc/assets/fonts/FigTree/Figtree-SemiBold.ttf differ diff --git a/refilc/assets/icons/ic_rounded.png b/refilc/assets/icons/ic_rounded.png index aced29b..a40f2b4 100644 Binary files a/refilc/assets/icons/ic_rounded.png and b/refilc/assets/icons/ic_rounded.png differ diff --git a/refilc/assets/images/showcase1.png b/refilc/assets/images/showcase1.png new file mode 100644 index 0000000..e4b6535 Binary files /dev/null and b/refilc/assets/images/showcase1.png differ diff --git a/refilc/assets/images/showcase2.png b/refilc/assets/images/showcase2.png new file mode 100644 index 0000000..0416828 Binary files /dev/null and b/refilc/assets/images/showcase2.png differ diff --git a/refilc/assets/images/showcase3.png b/refilc/assets/images/showcase3.png new file mode 100644 index 0000000..e90c17f Binary files /dev/null and b/refilc/assets/images/showcase3.png differ diff --git a/refilc/assets/images/showcase4.png b/refilc/assets/images/showcase4.png new file mode 100644 index 0000000..23e953f Binary files /dev/null and b/refilc/assets/images/showcase4.png differ diff --git a/refilc/pubspec.yaml b/refilc/pubspec.yaml index fb09458..8dd1a29 100644 --- a/refilc/pubspec.yaml +++ b/refilc/pubspec.yaml @@ -80,6 +80,7 @@ dependencies: flutter_stripe: ^10.0.0 get_it: ^7.6.7 xml: ^6.5.0 + carousel_slider: ^4.2.1 dev_dependencies: flutter_lints: ^3.0.1 @@ -101,7 +102,7 @@ flutter: - assets/images/ext_logo/ - assets/svg/menu_icons/ - assets/other/dirtywords.xml - - assets/svg/mesh_bg.svg + - assets/svg/ fonts: - family: FilcIcons @@ -154,7 +155,10 @@ flutter: - asset: assets/fonts/Montserrat/Montserrat-ThinItalic.ttf weight: 100 style: italic - + - family: FigTree + fonts: + - asset: assets/fonts/FigTree/Figtree-SemiBold.ttf + weight: 500 # - family: SpaceMono # fonts: # - asset: assets/fonts/SpaceMono/SpaceMono-Regular.ttf diff --git a/refilc_mobile_ui/lib/screens/login/login_screen.dart b/refilc_mobile_ui/lib/screens/login/login_screen.dart index 572f3dc..fa83ec4 100644 --- a/refilc_mobile_ui/lib/screens/login/login_screen.dart +++ b/refilc_mobile_ui/lib/screens/login/login_screen.dart @@ -12,6 +12,8 @@ import 'package:refilc_mobile_ui/screens/settings/privacy_view.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'login_screen.i18n.dart'; +import 'package:carousel_slider/carousel_slider.dart'; +import 'package:flutter_svg/flutter_svg.dart'; class LoginScreen extends StatefulWidget { const LoginScreen({super.key, this.back = false}); @@ -77,259 +79,278 @@ class LoginScreenState extends State { Widget build(BuildContext context) { return Scaffold( body: Container( - decoration: BoxDecoration(color: AppColors.of(context).loginBackground), + decoration: const BoxDecoration(color: Color(0xFFDAE4F7)), child: SingleChildScrollView( physics: const ClampingScrollPhysics(), controller: _scrollController, child: Container( - decoration: - BoxDecoration(color: AppColors.of(context).loginBackground), + decoration: const BoxDecoration(color: Color(0xFFDAE4F7)), width: MediaQuery.of(context).size.width, height: MediaQuery.of(context).size.height, child: SafeArea( child: Column( - mainAxisAlignment: MainAxisAlignment.center, + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Container( - alignment: Alignment.topLeft, - padding: const EdgeInsets.only(left: 16.0, top: 12.0), - child: ClipOval( - child: Material( - type: MaterialType.transparency, - child: showBack - ? BackButton( - color: AppColors.of(context).loginPrimary) - : const SizedBox(height: 48.0), - ), - ), - ), - // app icon Padding( - padding: EdgeInsets.zero, - child: Image.asset( - 'assets/icons/ic_rounded.png', - width: 50.0, - ), - ), - - // texts - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 10.0, - vertical: 12.0, - ), - child: Text( - 'reFilc', - style: TextStyle( - color: AppColors.of(context).loginPrimary, - fontSize: 28.0, - fontWeight: FontWeight.bold, - ), - ), - ), - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 10.0, - ), - child: Text( - 'login_w_kreten'.i18n, - textAlign: TextAlign.center, - style: TextStyle( - color: AppColors.of(context).loginPrimary, - fontSize: 18.0, - fontWeight: FontWeight.w500, - height: 1.2, - ), - ), - ), - - const Spacer( - flex: 2, - ), - - // inputs - Padding( - padding: const EdgeInsets.only( - left: 22.0, - right: 22.0, - top: 0.0, - ), - child: AutofillGroup( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, + padding: const EdgeInsets.only(left: 24, top: 20), + child: Row( children: [ - // username - Padding( - padding: const EdgeInsets.only(bottom: 6.0), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Expanded( - child: Text( - "username".i18n, - maxLines: 1, - style: TextStyle( - color: AppColors.of(context).loginPrimary, - fontWeight: FontWeight.w500, - fontSize: 12.0, - ), - ), - ), - Expanded( - child: Text( - "usernameHint".i18n, - maxLines: 1, - textAlign: TextAlign.right, - style: TextStyle( - color: - AppColors.of(context).loginSecondary, - fontWeight: FontWeight.w500, - fontSize: 12.0, - ), - ), - ), - ], - ), + Image.asset( + 'assets/icons/ic_rounded.png', + width: 30.0, ), - Padding( - padding: const EdgeInsets.only(bottom: 12.0), - child: LoginInput( - style: LoginInputStyle.username, - controller: usernameController, - ), - ), - - // password - Padding( - padding: const EdgeInsets.only(bottom: 6.0), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Expanded( - child: Text( - "password".i18n, - maxLines: 1, - style: TextStyle( - color: AppColors.of(context).loginPrimary, - fontWeight: FontWeight.w500, - fontSize: 12.0, - ), - ), - ), - Expanded( - child: Text( - "passwordHint".i18n, - maxLines: 1, - textAlign: TextAlign.right, - style: TextStyle( - color: - AppColors.of(context).loginSecondary, - fontWeight: FontWeight.w500, - fontSize: 12.0, - ), - ), - ), - ], - ), - ), - Padding( - padding: const EdgeInsets.only(bottom: 12.0), - child: LoginInput( - style: LoginInputStyle.password, - controller: passwordController, - ), - ), - - // school - Padding( - padding: const EdgeInsets.only(bottom: 6.0), - child: Text( - "school".i18n, - maxLines: 1, - style: TextStyle( + const SizedBox(width: 8), + Text( + 'reFilc', + style: TextStyle( color: AppColors.of(context).loginPrimary, - fontWeight: FontWeight.w500, - fontSize: 12.0, - ), - ), + fontSize: 18.0, + fontWeight: FontWeight.bold, + fontFamily: 'Montserrat'), ), - SchoolInput( - scroll: _scrollController, - controller: schoolController, + Material( + type: MaterialType.transparency, + child: showBack + ? BackButton( + color: AppColors.of(context).loginPrimary) + : const SizedBox(height: 48.0), ), ], + )), + Column( + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + const SizedBox(height: 32), + CarouselSlider( + options: CarouselOptions( + height: MediaQuery.of(context).size.height, + viewportFraction: 0.957, //math is mathing + autoPlay: true, + autoPlayInterval: const Duration(seconds: 4), + pauseAutoPlayOnTouch: true), + items: [1, 2, 3, 4].map((i) { + return Builder( + builder: (BuildContext context) { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Padding( + padding: const EdgeInsets.only(left: 24), + //TODO: fix padding + child: Text( + "welcome_title_$i".i18n, + style: TextStyle( + color: AppColors.of(context) + .loginPrimary, + fontSize: 20, + fontFamily: 'Montserrat', + fontWeight: FontWeight.w700, + height: 1.3), + ), + ), + const SizedBox(height: 20), + Text("welcome_text_$i".i18n, + style: const TextStyle( + fontFamily: 'FigTree', + fontWeight: FontWeight.w500, + fontSize: 18, + height: 1.3)), + Image.asset('assets/images/showcase$i.png') + ], + ); + }, + ); + }).toList(), ), - ), - ), + ], + ) - // login button - Padding( - padding: const EdgeInsets.only( - top: 35.0, - left: 22.0, - right: 22.0, - ), - child: Visibility( - visible: _loginState != LoginState.inProgress, - replacement: const Padding( - padding: EdgeInsets.symmetric(vertical: 6.0), - child: CircularProgressIndicator( - valueColor: - AlwaysStoppedAnimation(Colors.white), - ), - ), - child: LoginButton( - child: Text("login".i18n, - maxLines: 1, - style: const TextStyle( - fontWeight: FontWeight.bold, - fontSize: 20.0, - )), - onPressed: () => _loginAPI(context: context), - ), - ), - ), + // // inputs + // Padding( + // padding: const EdgeInsets.only( + // left: 22.0, + // right: 22.0, + // top: 0.0, + // ), + // child: AutofillGroup( + // child: Column( + // crossAxisAlignment: CrossAxisAlignment.start, + // children: [ + // // username + // Padding( + // padding: const EdgeInsets.only(bottom: 6.0), + // child: Row( + // mainAxisAlignment: MainAxisAlignment.spaceBetween, + // children: [ + // Expanded( + // child: Text( + // "username".i18n, + // maxLines: 1, + // style: TextStyle( + // color: AppColors.of(context).loginPrimary, + // fontWeight: FontWeight.w500, + // fontSize: 12.0, + // ), + // ), + // ), + // Expanded( + // child: Text( + // "usernameHint".i18n, + // maxLines: 1, + // textAlign: TextAlign.right, + // style: TextStyle( + // color: + // AppColors.of(context).loginSecondary, + // fontWeight: FontWeight.w500, + // fontSize: 12.0, + // ), + // ), + // ), + // ], + // ), + // ), + // Padding( + // padding: const EdgeInsets.only(bottom: 12.0), + // child: LoginInput( + // style: LoginInputStyle.username, + // controller: usernameController, + // ), + // ), - // error messages - if (_loginState == LoginState.missingFields || - _loginState == LoginState.invalidGrant || - _loginState == LoginState.failed) - Padding( - padding: const EdgeInsets.only( - top: 8.0, left: 12.0, right: 12.0), - child: Text( - [ - "missing_fields", - "invalid_grant", - "error" - ][_loginState.index] - .i18n, - style: const TextStyle( - color: Colors.red, - fontWeight: FontWeight.w500, - ), - textAlign: TextAlign.center, - ), - ), - const SizedBox(height: 22.0), + // // password + // Padding( + // padding: const EdgeInsets.only(bottom: 6.0), + // child: Row( + // mainAxisAlignment: MainAxisAlignment.spaceBetween, + // children: [ + // Expanded( + // child: Text( + // "password".i18n, + // maxLines: 1, + // style: TextStyle( + // color: AppColors.of(context).loginPrimary, + // fontWeight: FontWeight.w500, + // fontSize: 12.0, + // ), + // ), + // ), + // Expanded( + // child: Text( + // "passwordHint".i18n, + // maxLines: 1, + // textAlign: TextAlign.right, + // style: TextStyle( + // color: + // AppColors.of(context).loginSecondary, + // fontWeight: FontWeight.w500, + // fontSize: 12.0, + // ), + // ), + // ), + // ], + // ), + // ), + // Padding( + // padding: const EdgeInsets.only(bottom: 12.0), + // child: LoginInput( + // style: LoginInputStyle.password, + // controller: passwordController, + // ), + // ), - // privacy policy - GestureDetector( - onTap: () => PrivacyView.show(context), - child: Text( - 'privacy'.i18n, - style: TextStyle( - color: AppColors.of(context).loginSecondary, - fontWeight: FontWeight.w500, - fontSize: 14.0, - ), - ), - ), + // // school + // Padding( + // padding: const EdgeInsets.only(bottom: 6.0), + // child: Text( + // "school".i18n, + // maxLines: 1, + // style: TextStyle( + // color: AppColors.of(context).loginPrimary, + // fontWeight: FontWeight.w500, + // fontSize: 12.0, + // ), + // ), + // ), + // SchoolInput( + // scroll: _scrollController, + // controller: schoolController, + // ), + // ], + // ), + // ), + // ), - const Spacer( - flex: 1, - ), + // // login button + // Padding( + // padding: const EdgeInsets.only( + // top: 35.0, + // left: 22.0, + // right: 22.0, + // ), + // child: Visibility( + // visible: _loginState != LoginState.inProgress, + // replacement: const Padding( + // padding: EdgeInsets.symmetric(vertical: 6.0), + // child: CircularProgressIndicator( + // valueColor: + // AlwaysStoppedAnimation(Colors.white), + // ), + // ), + // child: LoginButton( + // child: Text("login".i18n, + // maxLines: 1, + // style: const TextStyle( + // fontWeight: FontWeight.bold, + // fontSize: 20.0, + // )), + // onPressed: () => _loginAPI(context: context), + // ), + // ), + // ), + + // // error messages + // if (_loginState == LoginState.missingFields || + // _loginState == LoginState.invalidGrant || + // _loginState == LoginState.failed) + // Padding( + // padding: const EdgeInsets.only( + // top: 8.0, left: 12.0, right: 12.0), + // child: Text( + // [ + // "missing_fields", + // "invalid_grant", + // "error" + // ][_loginState.index] + // .i18n, + // style: const TextStyle( + // color: Colors.red, + // fontWeight: FontWeight.w500, + // ), + // textAlign: TextAlign.center, + // ), + // ), + // const SizedBox(height: 22.0), + + // // privacy policy + // GestureDetector( + // onTap: () => PrivacyView.show(context), + // child: Text( + // 'privacy'.i18n, + // style: TextStyle( + // color: AppColors.of(context).loginSecondary, + // fontWeight: FontWeight.w500, + // fontSize: 14.0, + // ), + // ), + // ), + + // const Spacer( + // flex: 1, + // ), ], ), ), diff --git a/refilc_mobile_ui/lib/screens/login/login_screen.i18n.dart b/refilc_mobile_ui/lib/screens/login/login_screen.i18n.dart index 6f95063..da41626 100644 --- a/refilc_mobile_ui/lib/screens/login/login_screen.i18n.dart +++ b/refilc_mobile_ui/lib/screens/login/login_screen.i18n.dart @@ -19,6 +19,20 @@ extension Localization on String { "schools_error": "Failed to get schools.", "login_w_kreten": "Log in with your e-KRÉTA account to continue!", "privacy": "Privacy Policy", + "welcome_title_1": "This is your home", + "welcome_text_1": + "In the day view, you'll find everything you need: your timetable, your tasks, your assignments and your unread messages, all in one place.", + "welcome_title_2": + "You can see your deteriorating tendency in ten different ways", + "welcome_text_2": + "You will see so many statistics that 8 years of elementary maths will not be enough to comprehend it.", + "welcome_title_3": + "Follow your goals and turn maths one into maths five.", + "welcome_text_3": + "Set your target and we'll tell you how many grades you should get. You even get confetti when you reach your goal.", + "welcome_title_4": "Take as many notes as you want.", + "welcome_text_4": + "You can also organise your notes by lesson in the built-in notebook, so you can find everything in one app.", }, "hu_hu": { "username": "Felhasználónév", @@ -37,6 +51,19 @@ extension Localization on String { "login_w_kreten": "Jelentkezz be az e-KRÉTA fiókoddal a folytatáshoz!", "privacy": "Adatkezelési tájékoztató", + "welcome_title_1": "Ez a te kis otthonod", + "welcome_text_1": + "A nap nézetben mindent megtalálsz, amire éppen szükséged van: az órarended, a feladataid, a számonkéréseid és az olvasatlan üzeneteid, egy helyen.", + "welcome_title_2": "A romló tendenciádat tízféle képpen láthatod", + "welcome_text_2": + "Annyi statisztikát láthatsz, hogy a 8 általánosos matek nem lesz elég a kisilabizálására.", + "welcome_title_3": + "Kövesd a céljaidat, és legyen a matek egyesből matek ötös.", + "welcome_text_3": + "Állítsd be a célodat, és mi megmondjuk, hányas jegyet kell szerezned. Még konfetti is van a cél elérésekor.", + "welcome_title_4": "Füzetelj annyit, amennyit csak szeretnél.", + "welcome_text_4": + "A beépített jegyzetfüzetbe órák szerint is rendezheted a jegyzeteidet, így mindent megtalálsz egy appban.", }, "de_de": { "username": "Benutzername", @@ -53,6 +80,21 @@ extension Localization on String { "login_w_kreten": "Melden Sie sich mit Ihrem e-KRÉTA-Konto an, um fortzufahren!", "privacy": "Datenschutzrichtlinie", + //TODO: translate to german, waiting for translator + "welcome_title_1": "This is your home", + "welcome_text_1": + "In the day view, you'll find everything you need: your timetable, your tasks, your assignments and your unread messages, all in one place.", + "welcome_title_2": + "You can see your deteriorating tendency in ten different ways", + "welcome_text_2": + "You will see so many statistics that 8 years of elementary maths will not be enough to comprehend it.", + "welcome_title_3": + "Follow your goals and turn maths one into maths five.", + "welcome_text_3": + "Set your target and we'll tell you how many grades you should get. You even get confetti when you reach your goal.", + "welcome_title_4": "Take as many notes as you want.", + "welcome_text_4": + "You can also organise your notes by lesson in the built-in notebook, so you can find everything in one app.", }, }; diff --git a/refilc_mobile_ui/pubspec.yaml b/refilc_mobile_ui/pubspec.yaml index b7321d7..7640a9a 100644 --- a/refilc_mobile_ui/pubspec.yaml +++ b/refilc_mobile_ui/pubspec.yaml @@ -69,7 +69,8 @@ dependencies: get_it: ^7.6.7 xml: ^6.5.0 markdown: ^7.2.2 - + carousel_slider: ^4.2.1 + dev_dependencies: flutter_lints: ^3.0.1