diff --git a/sama_chat_client/lib/src/features/conversations_list/view/conversations_page.dart b/sama_chat_client/lib/src/features/conversations_list/view/conversations_page.dart index 04da0742..ab9a2c57 100644 --- a/sama_chat_client/lib/src/features/conversations_list/view/conversations_page.dart +++ b/sama_chat_client/lib/src/features/conversations_list/view/conversations_page.dart @@ -46,22 +46,7 @@ class HomePage extends StatelessWidget { } }, child: const ConversationsList(), - ), - floatingActionButton: state.status == SharingIntentStatus.processing - ? null - : ConnectionChecker( - child: FloatingActionButton( - // fix error https://github.com/flutter/flutter/issues/115358 - heroTag: null, - child: const Padding( - padding: EdgeInsets.only(top: 4.0), - child: Icon(Icons.add_comment_outlined, size: 32.0), - ), - onPressed: () { - context.push(groupCreateScreenPath); - }, - ), - )); + )); }); } } @@ -104,8 +89,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget { leading: Align( alignment: Alignment.centerRight, child: IconButton( - icon: - const Icon(Icons.person_outline, color: lightWhite, size: 32.0), + icon: const Icon(Icons.account_circle_outlined, + color: lightWhite, size: 32.0), tooltip: 'Profile', onPressed: () { context.push(profilePath); @@ -119,8 +104,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget { child: IconButton( onPressed: () => _openSearch(context), icon: const Icon( - Icons.search, - color: white, + Icons.edit_note_outlined, + color: lightWhite, size: 32, ), ), @@ -130,7 +115,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget { } _openSearch(BuildContext context) { - context.push(globalSearchPath); + context.push(groupCreateScreenPath); + // context.push(globalSearchPath); } @override diff --git a/sama_chat_client/lib/src/features/profile/view/profile_form.dart b/sama_chat_client/lib/src/features/profile/view/profile_form.dart index 0302248a..3da03f18 100644 --- a/sama_chat_client/lib/src/features/profile/view/profile_form.dart +++ b/sama_chat_client/lib/src/features/profile/view/profile_form.dart @@ -44,19 +44,18 @@ class AvatarNameTile extends StatelessWidget { @override Widget build(BuildContext context) { - return ListTile( + return IntrinsicWidth( + child: ListTile( titleAlignment: ListTileTitleAlignment.top, - title: Center( - child: Padding( - padding: const EdgeInsets.only(top: 8), - child: _UserAvatar(), - ), + title: Padding( + padding: const EdgeInsets.only(top: 8), + child: _UserAvatar(), ), subtitle: Padding( padding: const EdgeInsets.only(bottom: 4), child: _UserFullName(), ), - ); + )); } } @@ -72,20 +71,32 @@ class ProfileCard extends StatelessWidget { child: Card( child: Padding( padding: EdgeInsets.all(15), - child: Column( - mainAxisSize: MainAxisSize.min, + child: Stack( children: [ - ConnectionChecker(child: AvatarNameTile()), - ConnectionChecker(child: _UsernameForm()), - SizedBox(height: columnItemMargin), - ConnectionChecker(child: _PhoneForm()), - SizedBox(height: columnItemMargin), - ConnectionChecker(child: _EmailForm()), - SizedBox(height: columnItemMargin), - ConnectionChecker(child: _AccountForm()), - Expanded( - child: Align( - alignment: Alignment.bottomRight, child: _LogoutForm())) + Card( + color: paleMallow, + margin: EdgeInsets.only(top: 60), + child: Padding( + padding: EdgeInsets.only(top: 100, left: 4, right: 4), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + ConnectionChecker(child: _UsernameForm()), + SizedBox(height: columnItemMargin), + ConnectionChecker(child: _PhoneForm()), + SizedBox(height: columnItemMargin), + ConnectionChecker(child: _EmailForm()), + SizedBox(height: columnItemMargin), + ConnectionChecker(child: _AccountForm()), + ], + ), + ), + ), + Align(alignment: Alignment.bottomRight, child: _LogoutForm()), + Align( + alignment: Alignment.topCenter, + child: ConnectionChecker(child: AvatarNameTile()), + ), ], ), ), @@ -122,50 +133,48 @@ class _UserFullName extends StatelessWidget { previous.userLastname != current.userLastname && current.userLastname.isPure, builder: (context, state) { - return Align( - alignment: Alignment.center, - child: TextButton( - onPressed: () { - showDialog( - context: context, - builder: (_) { - return BlocProvider.value( - value: BlocProvider.of(context), - child: const NameDialogInput(), - ); - }); - }, - style: TextButton.styleFrom( - minimumSize: Size.zero, - tapTargetSize: MaterialTapTargetSize.shrinkWrap, - alignment: Alignment.center), - child: Column(children: [ - Text( - state.userFirstname.value.isEmpty - ? "First name" - : state.userFirstname.value, - style: TextStyle( - fontSize: 22, - fontWeight: state.userFirstname.value.isEmpty - ? FontWeight.w200 - : FontWeight.bold, - color: signalBlack), - overflow: TextOverflow.ellipsis, - ), - Text( - state.userLastname.value.isEmpty - ? "Last name" - : state.userLastname.value, - style: TextStyle( - fontSize: 18, - color: signalBlack, - fontWeight: state.userLastname.value.isEmpty - ? FontWeight.w200 - : FontWeight.normal), - overflow: TextOverflow.ellipsis, - ), - ]), - )); + return TextButton( + onPressed: () { + showDialog( + context: context, + builder: (_) { + return BlocProvider.value( + value: BlocProvider.of(context), + child: const NameDialogInput(), + ); + }); + }, + style: TextButton.styleFrom( + minimumSize: Size.zero, + tapTargetSize: MaterialTapTargetSize.shrinkWrap, + alignment: Alignment.center), + child: Column(mainAxisSize: MainAxisSize.min, children: [ + Text( + state.userFirstname.value.isEmpty + ? "First name" + : state.userFirstname.value, + style: TextStyle( + fontSize: 22, + fontWeight: state.userFirstname.value.isEmpty + ? FontWeight.w200 + : FontWeight.bold, + color: signalBlack), + overflow: TextOverflow.ellipsis, + ), + Text( + state.userLastname.value.isEmpty + ? "Last name" + : state.userLastname.value, + style: TextStyle( + fontSize: 18, + color: signalBlack, + fontWeight: state.userLastname.value.isEmpty + ? FontWeight.w200 + : FontWeight.normal), + overflow: TextOverflow.ellipsis, + ), + ]), + ); }); } } @@ -185,7 +194,7 @@ class _UsernameForm extends StatelessWidget { } class _PhoneForm extends StatelessWidget { - const _PhoneForm({super.key}); + const _PhoneForm(); @override Widget build(BuildContext context) { @@ -325,15 +334,13 @@ class _LogoutForm extends StatelessWidget { @override Widget build(BuildContext context) { - return TextButton.icon( + return ElevatedButton.icon( onPressed: () { context.read().add(AuthenticationLogoutRequested()); }, icon: const Icon(Icons.exit_to_app_outlined, color: dullGray, size: 25), style: TextButton.styleFrom( - minimumSize: Size.zero, - tapTargetSize: MaterialTapTargetSize.shrinkWrap, - alignment: Alignment.centerLeft), + backgroundColor: paleMallow, alignment: Alignment.centerLeft), label: const Text( 'Logout', style: TextStyle(fontWeight: FontWeight.w300), @@ -451,7 +458,7 @@ class InfoDialogInput extends StatelessWidget { return AlertDialog( title: const Text('Edit personal info'), actionsPadding: const EdgeInsets.only(bottom: 8), - contentPadding: const EdgeInsets.fromLTRB(16, 16, 16, 8), + contentPadding: const EdgeInsets.fromLTRB(26, 16, 16, 8), content: Column(mainAxisSize: MainAxisSize.min, children: [ Container( padding: const EdgeInsets.all(8), diff --git a/sama_chat_client/lib/src/shared/ui/colors.dart b/sama_chat_client/lib/src/shared/ui/colors.dart index fdd9e78c..e6d520fc 100644 --- a/sama_chat_client/lib/src/shared/ui/colors.dart +++ b/sama_chat_client/lib/src/shared/ui/colors.dart @@ -11,6 +11,7 @@ const Color dullGray = Color(0xFF6D6D6D); const Color signalBlack = Color(0xFF2A2A2A); const Color blackBlue = Color(0xFF1B1B1D); const Color black = Color(0xFF000000); +const Color paleMallow = Color(0xFFE6E7F8); const Color lightMallow = Color(0xFFDBDCFC); const Color slateBlue = Color(0xFF7678E5); const Color cyan = Color(0xFF00FFFF); diff --git a/sama_chat_client/lib/src/shared/ui/view/user_forms.dart b/sama_chat_client/lib/src/shared/ui/view/user_forms.dart index ae63b113..e5f4c712 100644 --- a/sama_chat_client/lib/src/shared/ui/view/user_forms.dart +++ b/sama_chat_client/lib/src/shared/ui/view/user_forms.dart @@ -14,25 +14,34 @@ class AvatarForm extends StatelessWidget { return Container( decoration: BoxDecoration( color: black, - borderRadius: BorderRadius.circular(5.0), + shape: BoxShape.circle, + border: Border.all(color: white, width: 2), + boxShadow: [ + BoxShadow( + color: black.withValues(alpha: 0.5), + spreadRadius: 3, + blurRadius: 7, + offset: const Offset(0, 3), // Controls the shadow's position + ), + ], ), - padding: const EdgeInsets.all(4.0), height: 85.0, width: 85.0, child: Center(child: () { if (avatar == null || avatar!.isEmpty) { return _defaultIcon(); } else { - return Image.network( + return ClipOval( + child: Image.network( avatar!, - height: 75.0, - width: 75.0, + height: 85.0, + width: 85.0, fit: BoxFit.cover, errorBuilder: (BuildContext context, Object exception, StackTrace? stackTrace) { return _defaultIcon(); }, - ); + )); } }())); } @@ -90,19 +99,19 @@ class UserPhoneForm extends StatelessWidget { return Ink( padding: const EdgeInsets.all(8), decoration: BoxDecoration( - color: lightWhite, + color: white, border: Border.all( color: lightWhite, ), - borderRadius: BorderRadius.circular(10), + borderRadius: BorderRadius.circular(30), ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ const Row( - crossAxisAlignment: CrossAxisAlignment.end, + crossAxisAlignment: CrossAxisAlignment.center, children: [ - Icon(Icons.local_phone_outlined, color: dullGray, size: 25), + Icon(Icons.local_phone_outlined, color: dullGray, size: 26), Text( ' Mobile phone', style: TextStyle(fontWeight: FontWeight.w300), @@ -137,7 +146,7 @@ class UserEmailForm extends StatelessWidget { border: Border.all( color: lightWhite, ), - borderRadius: BorderRadius.circular(10), + borderRadius: BorderRadius.circular(30), ), child: Column( crossAxisAlignment: CrossAxisAlignment.start,