diff --git a/app/lib/common/theme.dart b/app/lib/common/theme.dart index b49c948b..6a7cad6c 100644 --- a/app/lib/common/theme.dart +++ b/app/lib/common/theme.dart @@ -84,6 +84,7 @@ class PharMeTheme { static final iconColor = darkenColor(PharMeTheme.onSurfaceText, -0.1); static const smallSpace = 8.0; + static const defaultPagePadding = smallSpace; static const smallToMediumSpace = 12.0; static const mediumSpace = 16.0; static const mediumToLargeSpace = 24.0; diff --git a/app/lib/common/widgets/module.dart b/app/lib/common/widgets/module.dart index 72022b52..b9a33213 100644 --- a/app/lib/common/widgets/module.dart +++ b/app/lib/common/widgets/module.dart @@ -13,6 +13,7 @@ export 'headings.dart'; export 'indicators.dart'; export 'lifecycle_observer.dart'; export 'link_text_span.dart'; +export 'page_description.dart'; export 'page_indicator_explanation.dart'; export 'page_scaffold.dart'; export 'pharme_logo_page.dart'; diff --git a/app/lib/common/widgets/page_description.dart b/app/lib/common/widgets/page_description.dart new file mode 100644 index 00000000..d48393c2 --- /dev/null +++ b/app/lib/common/widgets/page_description.dart @@ -0,0 +1,18 @@ +import '../module.dart'; + +class PageDescription extends StatelessWidget { + const PageDescription(this.text); + + final String text; + + @override + Widget build(BuildContext context) { + return Padding( + padding: EdgeInsets.only( + left: PharMeTheme.smallSpace, + right: PharMeTheme.smallSpace, + bottom: PharMeTheme.smallSpace), + child: Text(text, style: PharMeTheme.textTheme.bodyMedium), + ); + } +} \ No newline at end of file diff --git a/app/lib/common/widgets/page_scaffold.dart b/app/lib/common/widgets/page_scaffold.dart index 2bc3d41b..4313d21b 100644 --- a/app/lib/common/widgets/page_scaffold.dart +++ b/app/lib/common/widgets/page_scaffold.dart @@ -1,5 +1,10 @@ import '../module.dart'; +EdgeInsets pagePadding() => EdgeInsets.only( + left: PharMeTheme.defaultPagePadding, + right: PharMeTheme.defaultPagePadding, +); + Widget buildTitle(String text) { return FittedBox( fit: BoxFit.fitWidth, @@ -52,14 +57,16 @@ Scaffold pageScaffold({ actions: actions, bottom: buildBarBottom(barBottom), ), - SliverList(delegate: SliverChildListDelegate(body)) + SliverPadding( + padding: pagePadding(), + sliver: SliverList(delegate: SliverChildListDelegate(body)), + ), ]), ); } Scaffold unscrollablePageScaffold({ required Widget body, - double? padding, String? title, String? barBottom, List? actions, @@ -83,11 +90,7 @@ Scaffold unscrollablePageScaffold({ appBar: appBar, body: SafeArea( child: Padding( - padding: EdgeInsets.only( - left: padding ?? PharMeTheme.smallSpace, - top: padding ?? PharMeTheme.smallSpace, - right: padding ?? PharMeTheme.smallSpace, - ), + padding: pagePadding(), child: body, ), ), diff --git a/app/lib/common/widgets/pharme_logo_page.dart b/app/lib/common/widgets/pharme_logo_page.dart index 72bb1324..bb8c8e40 100644 --- a/app/lib/common/widgets/pharme_logo_page.dart +++ b/app/lib/common/widgets/pharme_logo_page.dart @@ -13,34 +13,36 @@ class PharMeLogoPage extends StatelessWidget { @override Widget build(BuildContext context) { return unscrollablePageScaffold( - padding: PharMeTheme.largeSpace, - body: Column( - children: [ - Expanded( - child: Container( - alignment: Alignment.center, - child: greyscale - ? ColorFiltered( - colorFilter: ColorFilter.mode( - PharMeTheme.backgroundColor, - BlendMode.softLight, - ), - child: ColorFiltered( + body: Padding( + padding: EdgeInsets.all(PharMeTheme.mediumSpace), + child: Column( + children: [ + Expanded( + child: Container( + alignment: Alignment.center, + child: greyscale + ? ColorFiltered( colorFilter: ColorFilter.mode( PharMeTheme.backgroundColor, - BlendMode.saturation, + BlendMode.softLight, + ), + child: ColorFiltered( + colorFilter: ColorFilter.mode( + PharMeTheme.backgroundColor, + BlendMode.saturation, + ), + child: _buildLogo(context), ), - child: _buildLogo(context), - ), - ) - : _buildLogo(context), + ) + : _buildLogo(context), + ), ), + Container( + alignment: Alignment.center, + child: child ?? SizedBox.shrink(), ), - Container( - alignment: Alignment.center, - child: child ?? SizedBox.shrink(), - ), - ], + ], + ), ), ); } diff --git a/app/lib/drug_selection/pages/drug_selection.dart b/app/lib/drug_selection/pages/drug_selection.dart index 328ab0e2..0f7d2c6b 100644 --- a/app/lib/drug_selection/pages/drug_selection.dart +++ b/app/lib/drug_selection/pages/drug_selection.dart @@ -26,12 +26,11 @@ class DrugSelectionPage extends HookWidget { builder: (context, state) { return unscrollablePageScaffold( title: context.l10n.drug_selection_header, - barBottom: concludesOnboarding - ? context.l10n.drug_selection_onboarding_description - : null, - padding: PharMeTheme.mediumSpace, body: Column( children: [ + if (concludesOnboarding) PageDescription( + context.l10n.drug_selection_onboarding_description, + ), Expanded(child: _buildDrugList(context, state)), if (concludesOnboarding) _buildButton(context, state), ], diff --git a/app/lib/more/pages/more.dart b/app/lib/more/pages/more.dart index b5962d1f..325784c9 100644 --- a/app/lib/more/pages/more.dart +++ b/app/lib/more/pages/more.dart @@ -9,52 +9,55 @@ class MorePage extends StatelessWidget { Widget build(BuildContext context) { return PopScope( canPop: false, - child: pageScaffold(title: context.l10n.tab_more, body: [ - SubheaderDivider( - text: context.l10n.settings_page_account_settings, - useLine: false, - ), - _buildSettingsItem( - title: context.l10n.drug_selection_header, - onTap: () => context.router.push( - DrugSelectionRoute(concludesOnboarding: false) + child: pageScaffold( + title: context.l10n.tab_more, + body: [ + SubheaderDivider( + text: context.l10n.settings_page_account_settings, + useLine: false, ), - ), - _buildSettingsItem( - title: context.l10n.settings_page_delete_data, - onTap: () => showDialog( - context: context, - builder: (_) => DeleteDataDialog(), + _buildSettingsItem( + title: context.l10n.drug_selection_header, + onTap: () => context.router.push( + DrugSelectionRoute(concludesOnboarding: false) + ), ), - ), - SubheaderDivider( - text: context.l10n.settings_page_more, - useLine: false, - ), - _buildSettingsItem( - title: context.l10n.settings_page_onboarding, - onTap: () => context.router.push(OnboardingRoute(isRevisiting: true)), - ), - _buildSettingsItem( - title: context.l10n.settings_page_about_us, - onTap: () => context.router.push(AboutRoute()), - ), - _buildSettingsItem( - title: context.l10n.settings_page_privacy_policy, - onTap: () => context.router.push(PrivacyRoute()), - ), - _buildSettingsItem( - title: context.l10n.settings_page_terms_and_conditions, - onTap: () => context.router.push(TermsRoute()), - ), - SubheaderDivider( - text: context.l10n.settings_page_help_and_feedback, - useLine: false, - ), - _buildSettingsItem( - title: context.l10n.settings_page_contact_us, - onTap: sendEmail) - ]), + _buildSettingsItem( + title: context.l10n.settings_page_delete_data, + onTap: () => showDialog( + context: context, + builder: (_) => DeleteDataDialog(), + ), + ), + SubheaderDivider( + text: context.l10n.settings_page_more, + useLine: false, + ), + _buildSettingsItem( + title: context.l10n.settings_page_onboarding, + onTap: () => context.router.push(OnboardingRoute(isRevisiting: true)), + ), + _buildSettingsItem( + title: context.l10n.settings_page_about_us, + onTap: () => context.router.push(AboutRoute()), + ), + _buildSettingsItem( + title: context.l10n.settings_page_privacy_policy, + onTap: () => context.router.push(PrivacyRoute()), + ), + _buildSettingsItem( + title: context.l10n.settings_page_terms_and_conditions, + onTap: () => context.router.push(TermsRoute()), + ), + SubheaderDivider( + text: context.l10n.settings_page_help_and_feedback, + useLine: false, + ), + _buildSettingsItem( + title: context.l10n.settings_page_contact_us, + onTap: sendEmail) + ] + ), ); } diff --git a/app/lib/report/pages/report.dart b/app/lib/report/pages/report.dart index 463587b7..fd223e4f 100644 --- a/app/lib/report/pages/report.dart +++ b/app/lib/report/pages/report.dart @@ -32,9 +32,9 @@ class ReportPage extends StatelessWidget { canPop: false, child: unscrollablePageScaffold( title: context.l10n.tab_report, - barBottom: context.l10n.report_content_explanation, body: Column( children: [ + PageDescription(context.l10n.report_content_explanation), scrollList( userPhenotypes.map((phenotype) => GeneCard( phenotype,