diff --git a/apps/mobile/packages/design_system/lib/src/ui_constants.dart b/apps/mobile/packages/design_system/lib/src/ui_constants.dart index 4bce22fa..819699b1 100644 --- a/apps/mobile/packages/design_system/lib/src/ui_constants.dart +++ b/apps/mobile/packages/design_system/lib/src/ui_constants.dart @@ -5,11 +5,11 @@ class UiConstants { UiConstants._(); // --- Border Radii --- - + /// Base radius: 12px static const double radiusBase = 12.0; static final BorderRadius radiusLg = BorderRadius.circular(radiusBase); - + /// Medium radius: 6px static const double radiusMdValue = 6.0; static final BorderRadius radiusMd = BorderRadius.circular(radiusMdValue); @@ -19,12 +19,12 @@ class UiConstants { /// Extra small radius: 2px static final BorderRadius radiusXs = BorderRadius.circular(2.0); - + /// Large/Full radius static final BorderRadius radiusFull = BorderRadius.circular(999.0); // --- Spacing --- - + static const double space0 = 0.0; static const double space1 = 4.0; static const double space2 = 8.0; @@ -35,4 +35,6 @@ class UiConstants { static const double space8 = 32.0; static const double space10 = 40.0; static const double space12 = 48.0; + static const double space14 = 56.0; + static const double space16 = 64.0; } diff --git a/apps/mobile/packages/features/client/settings/lib/src/presentation/widgets/client_settings_page/settings_profile_header.dart b/apps/mobile/packages/features/client/settings/lib/src/presentation/widgets/client_settings_page/settings_profile_header.dart index 8ef63b89..b3ec10d0 100644 --- a/apps/mobile/packages/features/client/settings/lib/src/presentation/widgets/client_settings_page/settings_profile_header.dart +++ b/apps/mobile/packages/features/client/settings/lib/src/presentation/widgets/client_settings_page/settings_profile_header.dart @@ -13,64 +13,63 @@ class SettingsProfileHeader extends StatelessWidget { final labels = t.client_settings.profile; return SliverAppBar( - backgroundColor: UiColors.primary, - expandedHeight: 200, + backgroundColor: UiColors.bgSecondary, + expandedHeight: 140, pinned: true, + elevation: 0, + shape: const Border(bottom: BorderSide(color: UiColors.border, width: 1)), + leading: IconButton( + icon: const Icon(UiIcons.chevronLeft, color: UiColors.textSecondary), + onPressed: () => Modular.to.pop(), + ), flexibleSpace: FlexibleSpaceBar( background: Container( - decoration: const BoxDecoration( - gradient: LinearGradient( - colors: [UiColors.primary, Color(0xFF0047FF)], - begin: Alignment.topLeft, - end: Alignment.bottomRight, - ), - ), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, + padding: const EdgeInsets.symmetric(horizontal: UiConstants.space8), + margin: const EdgeInsets.only(top: UiConstants.space14), + child: Row( + crossAxisAlignment: CrossAxisAlignment.center, + mainAxisAlignment: MainAxisAlignment.start, + spacing: UiConstants.space4, children: [ - const SizedBox(height: UiConstants.space5 * 2), Container( - width: 80, - height: 80, + width: 64, + height: 64, decoration: BoxDecoration( shape: BoxShape.circle, - border: Border.all( - color: UiColors.white.withValues(alpha: 0.24), - width: 4, - ), + border: Border.all(color: UiColors.border, width: 2), color: UiColors.white, ), child: const Center( child: Text( 'C', style: TextStyle( - fontSize: 32, + fontSize: 24, fontWeight: FontWeight.bold, color: UiColors.primary, ), ), ), ), - const SizedBox(height: UiConstants.space3), - Text( - 'Your Company', - style: UiTypography.body1b.copyWith(color: UiColors.white), - ), - const SizedBox(height: UiConstants.space1), - Row( + Column( + crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.center, children: [ - Icon( - UiIcons.mail, - size: 14, - color: UiColors.white.withValues(alpha: 0.7), - ), - const SizedBox(width: UiConstants.space2), - Text( - 'client@example.com', - style: UiTypography.footnote1r.copyWith( - color: UiColors.white.withValues(alpha: 0.7), - ), + Text('Your Company', style: UiTypography.body1b), + const SizedBox(height: UiConstants.space1), + Row( + mainAxisAlignment: MainAxisAlignment.start, + spacing: UiConstants.space1, + children: [ + Icon( + UiIcons.mail, + size: 14, + color: UiColors.textSecondary, + ), + Text( + 'client@example.com', + style: UiTypography.footnote1r.textSecondary, + ), + ], ), ], ), @@ -78,14 +77,7 @@ class SettingsProfileHeader extends StatelessWidget { ), ), ), - leading: IconButton( - icon: const Icon(UiIcons.arrowLeft, color: UiColors.white), - onPressed: () => Modular.to.pop(), - ), - title: Text( - labels.title, - style: UiTypography.body1b.copyWith(color: UiColors.white), - ), + title: Text(labels.title, style: UiTypography.body1b), ); } }