From 45f8b638c605e7b8e04517e33193cbc35fa27987 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Damian=20Moli=C5=84ski?= <47773413+damian-molinski@users.noreply.github.com> Date: Thu, 16 Jan 2025 10:48:06 +0100 Subject: [PATCH] feat(cat-voices): new overlay and dropshadow colors (#1526) * chore: make VoicesColorScheme properties not nullable * Dialog barrier and shadow colors --------- Co-authored-by: Oleksandr Prokhorenko --- .../apps/voices/lib/common/ext/space_ext.dart | 16 +- .../lib/pages/account/account_page.dart | 2 +- .../campaign_admin_tools_dialog.dart | 2 +- .../details/widgets/campaign_management.dart | 2 +- .../lib/pages/discovery/discovery_page.dart | 2 +- .../overall_spaces/brands_navigation.dart | 4 +- ...pload_seed_phrase_confirmation_dialog.dart | 2 +- .../wallet_link/account_role_dialog.dart | 2 +- .../stage/rbac_transaction_panel.dart | 2 +- .../widgets/exit_confirm_dialog.dart | 2 +- .../registration/widgets/wallet_summary.dart | 2 +- .../widgets/buttons/voices_icon_button.dart | 4 +- .../widgets/cards/campaign_stage_card.dart | 2 +- .../widgets/cards/funded_proposal_card.dart | 2 +- .../lib/widgets/cards/role_chooser_card.dart | 2 +- .../voices/lib/widgets/chips/voices_chip.dart | 2 +- .../containers/roles_summary_container.dart | 2 +- .../workspace_text_tile_container.dart | 2 +- .../lib/widgets/dropdown/voices_dropdown.dart | 2 +- .../widgets/indicators/voices_indicator.dart | 8 +- .../widgets/modals/voices_desktop_dialog.dart | 2 +- .../modals/voices_upload_file_dialog.dart | 6 +- .../widgets/pickers/voices_time_picker.dart | 2 +- .../widgets/text_field/seed_phrase_field.dart | 2 +- .../voices_date_time_text_field.dart | 2 +- .../widgets/text_field/voices_text_field.dart | 4 +- .../lib/widgets/tiles/selectable_tile.dart | 2 +- .../lib/widgets/toggles/voices_checkbox.dart | 2 +- .../theme_extensions/voices_color_scheme.dart | 374 ++++++++++-------- .../lib/src/themes/catalyst.dart | 13 +- .../lib/src/themes/widgets/buttons_theme.dart | 8 +- .../lib/src/themes/widgets/toggles_theme.dart | 8 +- .../themes/widgets/voices_dialog_theme.dart | 16 + .../voices_input_decoration_theme.dart | 6 +- .../lib/examples/voices_avatar_example.dart | 2 +- .../lib/examples/voices_badge_example.dart | 2 +- .../lib/examples/voices_modals_example.dart | 2 +- 37 files changed, 278 insertions(+), 239 deletions(-) create mode 100644 catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_dialog_theme.dart diff --git a/catalyst_voices/apps/voices/lib/common/ext/space_ext.dart b/catalyst_voices/apps/voices/lib/common/ext/space_ext.dart index b71cfe26f93..c399cc5c4ea 100644 --- a/catalyst_voices/apps/voices/lib/common/ext/space_ext.dart +++ b/catalyst_voices/apps/voices/lib/common/ext/space_ext.dart @@ -41,19 +41,19 @@ extension SpaceExt on Space { Color backgroundColor(BuildContext context) => switch (this) { Space.discovery => - Theme.of(context).colors.iconsSecondary!.withOpacity(0.16), + Theme.of(context).colors.iconsSecondary.withOpacity(0.16), Space.workspace => Theme.of(context).colorScheme.primaryContainer, - Space.voting => Theme.of(context).colors.warningContainer!, + Space.voting => Theme.of(context).colors.warningContainer, Space.fundedProjects => - Theme.of(context).colors.iconsSecondary!.withOpacity(0.16), - Space.treasury => Theme.of(context).colors.successContainer!, + Theme.of(context).colors.iconsSecondary.withOpacity(0.16), + Space.treasury => Theme.of(context).colors.successContainer, }; Color foregroundColor(BuildContext context) => switch (this) { - Space.discovery => Theme.of(context).colors.iconsSecondary!, + Space.discovery => Theme.of(context).colors.iconsSecondary, Space.workspace => Theme.of(context).colorScheme.primary, - Space.voting => Theme.of(context).colors.iconsWarning!, - Space.fundedProjects => Theme.of(context).colors.iconsSecondary!, - Space.treasury => Theme.of(context).colors.iconsSuccess!, + Space.voting => Theme.of(context).colors.iconsWarning, + Space.fundedProjects => Theme.of(context).colors.iconsSecondary, + Space.treasury => Theme.of(context).colors.iconsSuccess, }; } diff --git a/catalyst_voices/apps/voices/lib/pages/account/account_page.dart b/catalyst_voices/apps/voices/lib/pages/account/account_page.dart index c288bbfaaf8..8862b4f0794 100644 --- a/catalyst_voices/apps/voices/lib/pages/account/account_page.dart +++ b/catalyst_voices/apps/voices/lib/pages/account/account_page.dart @@ -120,7 +120,7 @@ class _KeychainCard extends StatelessWidget { Radius.circular(16), ), border: Border.all( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, width: 1, ), color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv1White, diff --git a/catalyst_voices/apps/voices/lib/pages/campaign/admin_tools/campaign_admin_tools_dialog.dart b/catalyst_voices/apps/voices/lib/pages/campaign/admin_tools/campaign_admin_tools_dialog.dart index c83dd1977db..634a1671534 100644 --- a/catalyst_voices/apps/voices/lib/pages/campaign/admin_tools/campaign_admin_tools_dialog.dart +++ b/catalyst_voices/apps/voices/lib/pages/campaign/admin_tools/campaign_admin_tools_dialog.dart @@ -163,7 +163,7 @@ class CampaignAdminToolsDialog extends StatelessWidget { color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv1White, borderRadius: BorderRadius.circular(16), border: Border.all( - color: Theme.of(context).colors.onSurfaceNeutral012!, + color: Theme.of(context).colors.onSurfaceNeutral012, width: 1, ), ), diff --git a/catalyst_voices/apps/voices/lib/pages/campaign/details/widgets/campaign_management.dart b/catalyst_voices/apps/voices/lib/pages/campaign/details/widgets/campaign_management.dart index 0e1b9463dde..3ca93482df5 100644 --- a/catalyst_voices/apps/voices/lib/pages/campaign/details/widgets/campaign_management.dart +++ b/catalyst_voices/apps/voices/lib/pages/campaign/details/widgets/campaign_management.dart @@ -82,7 +82,7 @@ class _CampaignStatusIndicator extends StatelessWidget { decoration: BoxDecoration( color: currentStatus == campaignStatus ? theme.colors.success - : theme.colors.onSurfaceNeutral012?.withOpacity(.12), + : theme.colors.onSurfaceNeutral012.withOpacity(.12), borderRadius: BorderRadius.circular(8), ), child: Padding( diff --git a/catalyst_voices/apps/voices/lib/pages/discovery/discovery_page.dart b/catalyst_voices/apps/voices/lib/pages/discovery/discovery_page.dart index b4db9d6f1ec..ece5d20da1e 100644 --- a/catalyst_voices/apps/voices/lib/pages/discovery/discovery_page.dart +++ b/catalyst_voices/apps/voices/lib/pages/discovery/discovery_page.dart @@ -112,7 +112,7 @@ class _Segment extends StatelessWidget { child: Container( decoration: BoxDecoration( color: theme.colors.elevationsOnSurfaceNeutralLv1White, - border: Border.all(color: theme.colors.outlineBorderVariant!), + border: Border.all(color: theme.colors.outlineBorderVariant), borderRadius: BorderRadius.circular(12), ), padding: const EdgeInsets.all(16), diff --git a/catalyst_voices/apps/voices/lib/pages/overall_spaces/brands_navigation.dart b/catalyst_voices/apps/voices/lib/pages/overall_spaces/brands_navigation.dart index 72082995827..40373a17d76 100644 --- a/catalyst_voices/apps/voices/lib/pages/overall_spaces/brands_navigation.dart +++ b/catalyst_voices/apps/voices/lib/pages/overall_spaces/brands_navigation.dart @@ -166,7 +166,7 @@ final class _BackgroundColor implements WidgetStateProperty { @override Color? resolve(Set states) { if (states.contains(WidgetState.selected)) { - return colors.onSurfacePrimaryContainer?.withOpacity(0.12); + return colors.onSurfacePrimaryContainer.withOpacity(0.12); } return Colors.transparent; @@ -181,7 +181,7 @@ final class _ForegroundColor implements WidgetStateProperty { @override Color? resolve(Set states) { if (states.contains(WidgetState.disabled)) { - return colors.textOnPrimaryLevel0?.withOpacity(0.3); + return colors.textOnPrimaryLevel0.withOpacity(0.3); } return colors.textOnPrimaryLevel0; diff --git a/catalyst_voices/apps/voices/lib/pages/registration/upload_seed_phrase_confirmation_dialog.dart b/catalyst_voices/apps/voices/lib/pages/registration/upload_seed_phrase_confirmation_dialog.dart index d5fec619e9e..e3cb38e26d4 100644 --- a/catalyst_voices/apps/voices/lib/pages/registration/upload_seed_phrase_confirmation_dialog.dart +++ b/catalyst_voices/apps/voices/lib/pages/registration/upload_seed_phrase_confirmation_dialog.dart @@ -34,7 +34,7 @@ class UploadSeedPhraseConfirmationDialog extends StatelessWidget { color: Theme.of(context).colors.iconsError, ), border: Border.all( - color: Theme.of(context).colors.iconsError!, + color: Theme.of(context).colors.iconsError, width: 3, ), ), diff --git a/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/account_role_dialog.dart b/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/account_role_dialog.dart index 1b670d444ec..270bba61c30 100644 --- a/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/account_role_dialog.dart +++ b/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/account_role_dialog.dart @@ -134,7 +134,7 @@ class _InfoContainer extends StatelessWidget { color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv1White, borderRadius: BorderRadius.circular(10), border: Border.all( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), ), child: child, diff --git a/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/stage/rbac_transaction_panel.dart b/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/stage/rbac_transaction_panel.dart index 11e4598ee23..c3c0f25358d 100644 --- a/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/stage/rbac_transaction_panel.dart +++ b/catalyst_voices/apps/voices/lib/pages/registration/wallet_link/stage/rbac_transaction_panel.dart @@ -166,7 +166,7 @@ class _Summary extends StatelessWidget { borderRadius: BorderRadius.circular(8), border: Border.all( width: 1.5, - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), ), child: Column( diff --git a/catalyst_voices/apps/voices/lib/pages/registration/widgets/exit_confirm_dialog.dart b/catalyst_voices/apps/voices/lib/pages/registration/widgets/exit_confirm_dialog.dart index 95d0948a673..e952ba0bd53 100644 --- a/catalyst_voices/apps/voices/lib/pages/registration/widgets/exit_confirm_dialog.dart +++ b/catalyst_voices/apps/voices/lib/pages/registration/widgets/exit_confirm_dialog.dart @@ -80,7 +80,7 @@ class _WarningIcon extends StatelessWidget { @override Widget build(BuildContext context) { final theme = Theme.of(context); - final color = theme.colors.iconsError!; + final color = theme.colors.iconsError; return VoicesAvatar( border: Border.all( diff --git a/catalyst_voices/apps/voices/lib/pages/registration/widgets/wallet_summary.dart b/catalyst_voices/apps/voices/lib/pages/registration/widgets/wallet_summary.dart index 59006f07430..a17839ef699 100644 --- a/catalyst_voices/apps/voices/lib/pages/registration/widgets/wallet_summary.dart +++ b/catalyst_voices/apps/voices/lib/pages/registration/widgets/wallet_summary.dart @@ -27,7 +27,7 @@ class WalletSummary extends StatelessWidget { borderRadius: BorderRadius.circular(8), border: Border.all( width: 1.5, - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), ), child: Column( diff --git a/catalyst_voices/apps/voices/lib/widgets/buttons/voices_icon_button.dart b/catalyst_voices/apps/voices/lib/widgets/buttons/voices_icon_button.dart index 9476318b3ff..e1ee79eb71a 100644 --- a/catalyst_voices/apps/voices/lib/widgets/buttons/voices_icon_button.dart +++ b/catalyst_voices/apps/voices/lib/widgets/buttons/voices_icon_button.dart @@ -93,10 +93,10 @@ class VoicesIconButton extends StatelessWidget { side: WidgetStateProperty.resolveWith( (states) { if (states.contains(WidgetState.disabled)) { - return BorderSide(color: colors.onSurfaceNeutral012!); + return BorderSide(color: colors.onSurfaceNeutral012); } - return BorderSide(color: colors.outlineBorderVariant!); + return BorderSide(color: colors.outlineBorderVariant); }, ), ), diff --git a/catalyst_voices/apps/voices/lib/widgets/cards/campaign_stage_card.dart b/catalyst_voices/apps/voices/lib/widgets/cards/campaign_stage_card.dart index c1aae85b85c..8e2014cb738 100644 --- a/catalyst_voices/apps/voices/lib/widgets/cards/campaign_stage_card.dart +++ b/catalyst_voices/apps/voices/lib/widgets/cards/campaign_stage_card.dart @@ -22,7 +22,7 @@ class CampaignStageCard extends StatelessWidget { decoration: BoxDecoration( color: theme.colors.elevationsOnSurfaceNeutralLv1White, border: Border.all( - color: theme.colors.outlineBorderVariant!, + color: theme.colors.outlineBorderVariant, ), borderRadius: BorderRadius.circular(20), ), diff --git a/catalyst_voices/apps/voices/lib/widgets/cards/funded_proposal_card.dart b/catalyst_voices/apps/voices/lib/widgets/cards/funded_proposal_card.dart index aed06e0da37..12d82b8a204 100644 --- a/catalyst_voices/apps/voices/lib/widgets/cards/funded_proposal_card.dart +++ b/catalyst_voices/apps/voices/lib/widgets/cards/funded_proposal_card.dart @@ -195,7 +195,7 @@ class _FundsAndComments extends StatelessWidget { return Container( padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6), decoration: BoxDecoration( - color: Theme.of(context).colors.success?.withOpacity(0.08), + color: Theme.of(context).colors.success.withOpacity(0.08), borderRadius: BorderRadius.circular(8), ), child: Row( diff --git a/catalyst_voices/apps/voices/lib/widgets/cards/role_chooser_card.dart b/catalyst_voices/apps/voices/lib/widgets/cards/role_chooser_card.dart index 611222ddc44..d848be69b46 100644 --- a/catalyst_voices/apps/voices/lib/widgets/cards/role_chooser_card.dart +++ b/catalyst_voices/apps/voices/lib/widgets/cards/role_chooser_card.dart @@ -54,7 +54,7 @@ class RoleChooserCard extends StatelessWidget { ? null : BoxDecoration( border: Border.all( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, width: 1, ), borderRadius: BorderRadius.circular(8), diff --git a/catalyst_voices/apps/voices/lib/widgets/chips/voices_chip.dart b/catalyst_voices/apps/voices/lib/widgets/chips/voices_chip.dart index 02c09d73b00..5a7f3177d72 100644 --- a/catalyst_voices/apps/voices/lib/widgets/chips/voices_chip.dart +++ b/catalyst_voices/apps/voices/lib/widgets/chips/voices_chip.dart @@ -70,7 +70,7 @@ class VoicesChip extends StatelessWidget { border: backgroundColor != null ? null : Border.all( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), borderRadius: borderRadius, ), diff --git a/catalyst_voices/apps/voices/lib/widgets/containers/roles_summary_container.dart b/catalyst_voices/apps/voices/lib/widgets/containers/roles_summary_container.dart index 10f243ac1c9..340ed363559 100644 --- a/catalyst_voices/apps/voices/lib/widgets/containers/roles_summary_container.dart +++ b/catalyst_voices/apps/voices/lib/widgets/containers/roles_summary_container.dart @@ -26,7 +26,7 @@ class RolesSummaryContainer extends StatelessWidget { return DecoratedBox( decoration: BoxDecoration( border: Border.all( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, width: 1.5, ), borderRadius: BorderRadius.circular(8), diff --git a/catalyst_voices/apps/voices/lib/widgets/containers/workspace_text_tile_container.dart b/catalyst_voices/apps/voices/lib/widgets/containers/workspace_text_tile_container.dart index 4af7621277e..45379141fcd 100644 --- a/catalyst_voices/apps/voices/lib/widgets/containers/workspace_text_tile_container.dart +++ b/catalyst_voices/apps/voices/lib/widgets/containers/workspace_text_tile_container.dart @@ -33,7 +33,7 @@ class WorkspaceTextTileContainer extends StatelessWidget { ), boxShadow: [ BoxShadow( - color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv0!, + color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv0, offset: const Offset(0, 1), blurRadius: 4, ), diff --git a/catalyst_voices/apps/voices/lib/widgets/dropdown/voices_dropdown.dart b/catalyst_voices/apps/voices/lib/widgets/dropdown/voices_dropdown.dart index 9805a2b0700..3a0739c9233 100644 --- a/catalyst_voices/apps/voices/lib/widgets/dropdown/voices_dropdown.dart +++ b/catalyst_voices/apps/voices/lib/widgets/dropdown/voices_dropdown.dart @@ -127,7 +127,7 @@ class SingleSelectDropdown extends StatelessWidget { OutlineInputBorder _border(BuildContext context) => OutlineInputBorder( borderSide: BorderSide( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), ); } diff --git a/catalyst_voices/apps/voices/lib/widgets/indicators/voices_indicator.dart b/catalyst_voices/apps/voices/lib/widgets/indicators/voices_indicator.dart index e1dbcacaf02..7cc4c761a2b 100644 --- a/catalyst_voices/apps/voices/lib/widgets/indicators/voices_indicator.dart +++ b/catalyst_voices/apps/voices/lib/widgets/indicators/voices_indicator.dart @@ -9,9 +9,9 @@ enum VoicesIndicatorType { Color _iconColor(BuildContext context) { return switch (this) { - VoicesIndicatorType.normal => Theme.of(context).colors.iconsForeground!, - VoicesIndicatorType.error => Theme.of(context).colors.iconsError!, - VoicesIndicatorType.success => Theme.of(context).colors.iconsSuccess!, + VoicesIndicatorType.normal => Theme.of(context).colors.iconsForeground, + VoicesIndicatorType.error => Theme.of(context).colors.iconsError, + VoicesIndicatorType.success => Theme.of(context).colors.iconsSuccess, }; } } @@ -38,7 +38,7 @@ class VoicesIndicator extends StatelessWidget { padding: const EdgeInsets.symmetric(vertical: 6, horizontal: 16), decoration: BoxDecoration( border: Border.all( - color: theme.colors.outlineBorderVariant!, + color: theme.colors.outlineBorderVariant, width: 1, ), borderRadius: BorderRadius.circular(8), diff --git a/catalyst_voices/apps/voices/lib/widgets/modals/voices_desktop_dialog.dart b/catalyst_voices/apps/voices/lib/widgets/modals/voices_desktop_dialog.dart index e76cdeb296f..0f00cc9b304 100644 --- a/catalyst_voices/apps/voices/lib/widgets/modals/voices_desktop_dialog.dart +++ b/catalyst_voices/apps/voices/lib/widgets/modals/voices_desktop_dialog.dart @@ -122,7 +122,7 @@ class _VoicesDesktopDialog extends StatelessWidget { ? RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), side: BorderSide( - color: Theme.of(context).colors.outlineBorderVariant!, + color: Theme.of(context).colors.outlineBorderVariant, ), ) : Theme.of(context).dialogTheme.shape, diff --git a/catalyst_voices/apps/voices/lib/widgets/modals/voices_upload_file_dialog.dart b/catalyst_voices/apps/voices/lib/widgets/modals/voices_upload_file_dialog.dart index 3d6ccc2073b..4d9644995c1 100644 --- a/catalyst_voices/apps/voices/lib/widgets/modals/voices_upload_file_dialog.dart +++ b/catalyst_voices/apps/voices/lib/widgets/modals/voices_upload_file_dialog.dart @@ -174,7 +174,7 @@ class _InfoContainer extends StatelessWidget { decoration: BoxDecoration( borderRadius: BorderRadius.circular(12), border: Border.all( - color: Theme.of(context).colors.iconsPrimary!, + color: Theme.of(context).colors.iconsPrimary, ), ), child: Row( @@ -243,7 +243,7 @@ class _UploadContainerState extends State<_UploadContainer> { borderType: BorderType.RRect, radius: const Radius.circular(12), dashPattern: const [8, 6], - color: Theme.of(context).colors.iconsPrimary!, + color: Theme.of(context).colors.iconsPrimary, child: Stack( children: [ // We allow drag&drop only on web @@ -303,7 +303,7 @@ class _UploadContainerState extends State<_UploadContainer> { decoration: BoxDecoration( shape: BoxShape.circle, border: Border.all( - color: Theme.of(context).colors.iconsPrimary!, + color: Theme.of(context).colors.iconsPrimary, width: 3, ), ), diff --git a/catalyst_voices/apps/voices/lib/widgets/pickers/voices_time_picker.dart b/catalyst_voices/apps/voices/lib/widgets/pickers/voices_time_picker.dart index 36c79ccaf4e..4c85a5df8c0 100644 --- a/catalyst_voices/apps/voices/lib/widgets/pickers/voices_time_picker.dart +++ b/catalyst_voices/apps/voices/lib/widgets/pickers/voices_time_picker.dart @@ -119,7 +119,7 @@ class _TimeText extends StatelessWidget { child: ColoredBox( color: !isSelected ? Colors.transparent - : Theme.of(context).colors.onSurfaceNeutral08!, + : Theme.of(context).colors.onSurfaceNeutral08, child: Padding( key: key, padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16), diff --git a/catalyst_voices/apps/voices/lib/widgets/text_field/seed_phrase_field.dart b/catalyst_voices/apps/voices/lib/widgets/text_field/seed_phrase_field.dart index 22319666c03..7c0150f79d8 100644 --- a/catalyst_voices/apps/voices/lib/widgets/text_field/seed_phrase_field.dart +++ b/catalyst_voices/apps/voices/lib/widgets/text_field/seed_phrase_field.dart @@ -92,7 +92,7 @@ class _SeedPhraseFieldState extends State { child: DecoratedBox( decoration: BoxDecoration( border: Border.all( - color: theme.colors.outlineBorder!, + color: theme.colors.outlineBorder, width: 1.5, ), borderRadius: BorderRadius.circular(12), diff --git a/catalyst_voices/apps/voices/lib/widgets/text_field/voices_date_time_text_field.dart b/catalyst_voices/apps/voices/lib/widgets/text_field/voices_date_time_text_field.dart index b1ad08e0a86..0fcca9cead6 100644 --- a/catalyst_voices/apps/voices/lib/widgets/text_field/voices_date_time_text_field.dart +++ b/catalyst_voices/apps/voices/lib/widgets/text_field/voices_date_time_text_field.dart @@ -38,7 +38,7 @@ class VoicesDateTimeTextField extends StatelessWidget { final borderSide = !dimBorder ? BorderSide( - color: theme.colors.outlineBorderVariant!, + color: theme.colors.outlineBorderVariant, width: 0.75, ) : BorderSide( diff --git a/catalyst_voices/apps/voices/lib/widgets/text_field/voices_text_field.dart b/catalyst_voices/apps/voices/lib/widgets/text_field/voices_text_field.dart index 61171b04800..cbba4f8a13e 100644 --- a/catalyst_voices/apps/voices/lib/widgets/text_field/voices_text_field.dart +++ b/catalyst_voices/apps/voices/lib/widgets/text_field/voices_text_field.dart @@ -467,9 +467,9 @@ class _VoicesTextFieldState extends State { case VoicesTextFieldStatus.none: return orDefault; case VoicesTextFieldStatus.success: - return Theme.of(context).colors.success!; + return Theme.of(context).colors.success; case VoicesTextFieldStatus.warning: - return Theme.of(context).colors.warning!; + return Theme.of(context).colors.warning; case VoicesTextFieldStatus.error: return Theme.of(context).colorScheme.error; } diff --git a/catalyst_voices/apps/voices/lib/widgets/tiles/selectable_tile.dart b/catalyst_voices/apps/voices/lib/widgets/tiles/selectable_tile.dart index e4f6d023633..e293842c7de 100644 --- a/catalyst_voices/apps/voices/lib/widgets/tiles/selectable_tile.dart +++ b/catalyst_voices/apps/voices/lib/widgets/tiles/selectable_tile.dart @@ -23,7 +23,7 @@ class SelectableTile extends StatelessWidget { borderRadius: _borderRadius(isSelected), boxShadow: [ BoxShadow( - color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv0!, + color: Theme.of(context).colors.elevationsOnSurfaceNeutralLv0, offset: const Offset(0, 1), blurRadius: 4, ), diff --git a/catalyst_voices/apps/voices/lib/widgets/toggles/voices_checkbox.dart b/catalyst_voices/apps/voices/lib/widgets/toggles/voices_checkbox.dart index 0138d3465ba..36d165c6801 100644 --- a/catalyst_voices/apps/voices/lib/widgets/toggles/voices_checkbox.dart +++ b/catalyst_voices/apps/voices/lib/widgets/toggles/voices_checkbox.dart @@ -59,7 +59,7 @@ class VoicesCheckbox extends StatelessWidget { side: isDisabled ? BorderSide( width: 2, - color: Theme.of(context).colors.onSurfaceNeutral012!, + color: Theme.of(context).colors.onSurfaceNeutral012, ) : null, ), diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/theme_extensions/voices_color_scheme.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/theme_extensions/voices_color_scheme.dart index ffb7218eba6..0724bf7f5e3 100644 --- a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/theme_extensions/voices_color_scheme.dart +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/theme_extensions/voices_color_scheme.dart @@ -7,64 +7,66 @@ import 'package:flutter/material.dart'; /// attributes that can be used in the Voices application to ensure consistency. @immutable class VoicesColorScheme extends ThemeExtension { - final Color? textPrimary; - final Color? textOnPrimary; - final Color? textOnPrimaryLevel0; - final Color? textOnPrimaryLevel1; - final Color? textOnPrimaryWhite; - final Color? textOnPrimaryContainer; - final Color? textDisabled; - final Color? success; - final Color? onSuccess; - final Color? successContainer; - final Color? onSuccessContainer; - final Color? warning; - final Color? onWarning; - final Color? warningContainer; - final Color? onWarningContainer; - final Color? onSurfaceNeutral08; - final Color? onSurfaceNeutral012; - final Color? onSurfaceNeutral016; - final Color? onSurfaceNeutralOpaqueLv0; - final Color? onSurfaceNeutralOpaqueLv1; - final Color? onSurfaceNeutralOpaqueLv2; - final Color? onSurfacePrimaryContainer; - final Color? onSurfacePrimary08; - final Color? onSurfacePrimary012; - final Color? onSurfacePrimary016; - final Color? onSurfaceSecondary08; - final Color? onSurfaceSecondary012; - final Color? onSurfaceSecondary016; - final Color? onSurfaceError08; - final Color? onSurfaceError012; - final Color? onSurfaceError016; - final Color? iconsForeground; - final Color? iconsBackground; - final Color? iconsBackgroundVariant; - final Color? iconsOnImage; - final Color? iconsDisabled; - final Color? iconsPrimary; - final Color? iconsSecondary; - final Color? iconsSuccess; - final Color? iconsWarning; - final Color? iconsError; - final Color? avatarsPrimary; - final Color? avatarsSecondary; - final Color? avatarsSuccess; - final Color? avatarsWarning; - final Color? avatarsError; - final Color? elevationsOnSurfaceNeutralLv0; - final Color? elevationsOnSurfaceNeutralLv1Grey; - final Color? elevationsOnSurfaceNeutralLv1White; - final Color? elevationsOnSurfaceNeutralLv2; - final Color? outlineBorder; - final Color? outlineBorderVariant; - final Color? primary98; - final Color? primaryContainer; - final Color? onPrimaryContainer; - final Color? onErrorVariant; - final Color? errorContainer; - final Color? onErrorContainer; + final Color textPrimary; + final Color textOnPrimary; + final Color textOnPrimaryLevel0; + final Color textOnPrimaryLevel1; + final Color textOnPrimaryWhite; + final Color textOnPrimaryContainer; + final Color textDisabled; + final Color success; + final Color onSuccess; + final Color successContainer; + final Color onSuccessContainer; + final Color warning; + final Color onWarning; + final Color warningContainer; + final Color onWarningContainer; + final Color onSurfaceNeutral08; + final Color onSurfaceNeutral012; + final Color onSurfaceNeutral016; + final Color onSurfaceNeutralOpaqueLv0; + final Color onSurfaceNeutralOpaqueLv1; + final Color onSurfaceNeutralOpaqueLv2; + final Color onSurfacePrimaryContainer; + final Color onSurfacePrimary08; + final Color onSurfacePrimary012; + final Color onSurfacePrimary016; + final Color onSurfaceSecondary08; + final Color onSurfaceSecondary012; + final Color onSurfaceSecondary016; + final Color onSurfaceError08; + final Color onSurfaceError012; + final Color onSurfaceError016; + final Color iconsForeground; + final Color iconsBackground; + final Color iconsBackgroundVariant; + final Color iconsOnImage; + final Color iconsDisabled; + final Color iconsPrimary; + final Color iconsSecondary; + final Color iconsSuccess; + final Color iconsWarning; + final Color iconsError; + final Color avatarsPrimary; + final Color avatarsSecondary; + final Color avatarsSuccess; + final Color avatarsWarning; + final Color avatarsError; + final Color elevationsOnSurfaceNeutralLv0; + final Color elevationsOnSurfaceNeutralLv1Grey; + final Color elevationsOnSurfaceNeutralLv1White; + final Color elevationsOnSurfaceNeutralLv2; + final Color outlineBorder; + final Color outlineBorderVariant; + final Color primary98; + final Color primaryContainer; + final Color onPrimaryContainer; + final Color onErrorVariant; + final Color errorContainer; + final Color onErrorContainer; + final Color overlay; + final Color dropShadow; const VoicesColorScheme({ required this.textPrimary, @@ -125,68 +127,72 @@ class VoicesColorScheme extends ThemeExtension { required this.onErrorVariant, required this.errorContainer, required this.onErrorContainer, + required this.overlay, + required this.dropShadow, }); @visibleForTesting const VoicesColorScheme.optional({ - this.textPrimary, - this.textOnPrimary, - this.textOnPrimaryLevel0, - this.textOnPrimaryLevel1, - this.textOnPrimaryWhite, - this.textOnPrimaryContainer, - this.textDisabled, - this.success, - this.onSuccess, - this.successContainer, - this.onSuccessContainer, - this.warning, - this.onWarning, - this.warningContainer, - this.onWarningContainer, - this.onSurfaceNeutral08, - this.onSurfaceNeutral012, - this.onSurfaceNeutral016, - this.onSurfacePrimaryContainer, - this.onSurfacePrimary08, - this.onSurfacePrimary012, - this.onSurfacePrimary016, - this.onSurfaceNeutralOpaqueLv0, - this.onSurfaceNeutralOpaqueLv1, - this.onSurfaceNeutralOpaqueLv2, - this.onSurfaceSecondary08, - this.onSurfaceSecondary012, - this.onSurfaceSecondary016, - this.onSurfaceError08, - this.onSurfaceError012, - this.onSurfaceError016, - this.iconsForeground, - this.iconsBackground, - this.iconsBackgroundVariant, - this.iconsOnImage, - this.iconsDisabled, - this.iconsPrimary, - this.iconsSecondary, - this.iconsSuccess, - this.iconsWarning, - this.iconsError, - this.avatarsPrimary, - this.avatarsSecondary, - this.avatarsSuccess, - this.avatarsWarning, - this.avatarsError, - this.elevationsOnSurfaceNeutralLv0, - this.elevationsOnSurfaceNeutralLv1Grey, - this.elevationsOnSurfaceNeutralLv1White, - this.elevationsOnSurfaceNeutralLv2, - this.outlineBorder, - this.outlineBorderVariant, - this.primary98, - this.primaryContainer, - this.onPrimaryContainer, - this.onErrorVariant, - this.errorContainer, - this.onErrorContainer, + this.textPrimary = Colors.black, + this.textOnPrimary = Colors.black, + this.textOnPrimaryLevel0 = Colors.black, + this.textOnPrimaryLevel1 = Colors.black, + this.textOnPrimaryWhite = Colors.black, + this.textOnPrimaryContainer = Colors.black, + this.textDisabled = Colors.black, + this.success = Colors.black, + this.onSuccess = Colors.black, + this.successContainer = Colors.black, + this.onSuccessContainer = Colors.black, + this.warning = Colors.black, + this.onWarning = Colors.black, + this.warningContainer = Colors.black, + this.onWarningContainer = Colors.black, + this.onSurfaceNeutral08 = Colors.black, + this.onSurfaceNeutral012 = Colors.black, + this.onSurfaceNeutral016 = Colors.black, + this.onSurfacePrimaryContainer = Colors.black, + this.onSurfacePrimary08 = Colors.black, + this.onSurfacePrimary012 = Colors.black, + this.onSurfacePrimary016 = Colors.black, + this.onSurfaceNeutralOpaqueLv0 = Colors.black, + this.onSurfaceNeutralOpaqueLv1 = Colors.black, + this.onSurfaceNeutralOpaqueLv2 = Colors.black, + this.onSurfaceSecondary08 = Colors.black, + this.onSurfaceSecondary012 = Colors.black, + this.onSurfaceSecondary016 = Colors.black, + this.onSurfaceError08 = Colors.black, + this.onSurfaceError012 = Colors.black, + this.onSurfaceError016 = Colors.black, + this.iconsForeground = Colors.black, + this.iconsBackground = Colors.black, + this.iconsBackgroundVariant = Colors.black, + this.iconsOnImage = Colors.black, + this.iconsDisabled = Colors.black, + this.iconsPrimary = Colors.black, + this.iconsSecondary = Colors.black, + this.iconsSuccess = Colors.black, + this.iconsWarning = Colors.black, + this.iconsError = Colors.black, + this.avatarsPrimary = Colors.black, + this.avatarsSecondary = Colors.black, + this.avatarsSuccess = Colors.black, + this.avatarsWarning = Colors.black, + this.avatarsError = Colors.black, + this.elevationsOnSurfaceNeutralLv0 = Colors.black, + this.elevationsOnSurfaceNeutralLv1Grey = Colors.black, + this.elevationsOnSurfaceNeutralLv1White = Colors.black, + this.elevationsOnSurfaceNeutralLv2 = Colors.black, + this.outlineBorder = Colors.black, + this.outlineBorderVariant = Colors.black, + this.primary98 = Colors.black, + this.primaryContainer = Colors.black, + this.onPrimaryContainer = Colors.black, + this.onErrorVariant = Colors.black, + this.errorContainer = Colors.black, + this.onErrorContainer = Colors.black, + this.overlay = Colors.black, + this.dropShadow = Colors.black, }); @override @@ -249,6 +255,8 @@ class VoicesColorScheme extends ThemeExtension { Color? onErrorVariant, Color? errorContainer, Color? onErrorContainer, + Color? overlay, + Color? dropShadow, }) { return VoicesColorScheme( textPrimary: textPrimary ?? this.textPrimary, @@ -321,6 +329,8 @@ class VoicesColorScheme extends ThemeExtension { onErrorVariant: onErrorVariant ?? this.onErrorVariant, errorContainer: errorContainer ?? this.errorContainer, onErrorContainer: onErrorContainer ?? this.onErrorContainer, + overlay: overlay ?? this.overlay, + dropShadow: dropShadow ?? this.dropShadow, ); } @@ -333,128 +343,142 @@ class VoicesColorScheme extends ThemeExtension { return this; } return VoicesColorScheme( - textPrimary: Color.lerp(textPrimary, other.textPrimary, t), - textOnPrimary: Color.lerp(textOnPrimary, other.textOnPrimary, t), + textPrimary: Color.lerp(textPrimary, other.textPrimary, t)!, + textOnPrimary: Color.lerp(textOnPrimary, other.textOnPrimary, t)!, textOnPrimaryLevel0: Color.lerp( textOnPrimaryLevel0, other.textOnPrimaryLevel0, t, - ), + )!, textOnPrimaryLevel1: Color.lerp( textOnPrimaryLevel1, other.textOnPrimaryLevel1, t, - ), + )!, textOnPrimaryWhite: Color.lerp( textOnPrimaryWhite, other.textOnPrimaryWhite, t, - ), + )!, textOnPrimaryContainer: Color.lerp( textOnPrimaryContainer, other.textOnPrimaryContainer, t, - ), - textDisabled: Color.lerp(textDisabled, other.textDisabled, t), - success: Color.lerp(success, other.success, t), - onSuccess: Color.lerp(onSuccess, other.onSuccess, t), - successContainer: Color.lerp(successContainer, other.successContainer, t), - onSuccessContainer: - Color.lerp(onSuccessContainer, other.onSuccessContainer, t), - warning: Color.lerp(warning, other.warning, t), - onWarning: Color.lerp(onWarning, other.onWarning, t), - warningContainer: Color.lerp(warningContainer, other.warningContainer, t), + )!, + textDisabled: Color.lerp(textDisabled, other.textDisabled, t)!, + success: Color.lerp(success, other.success, t)!, + onSuccess: Color.lerp(onSuccess, other.onSuccess, t)!, + successContainer: Color.lerp( + successContainer, + other.successContainer, + t, + )!, + onSuccessContainer: Color.lerp( + onSuccessContainer, + other.onSuccessContainer, + t, + )!, + warning: Color.lerp(warning, other.warning, t)!, + onWarning: Color.lerp(onWarning, other.onWarning, t)!, + warningContainer: + Color.lerp(warningContainer, other.warningContainer, t)!, onWarningContainer: - Color.lerp(onWarningContainer, other.onWarningContainer, t), + Color.lerp(onWarningContainer, other.onWarningContainer, t)!, onSurfaceNeutral08: - Color.lerp(onSurfaceNeutral08, other.onSurfaceNeutral08, t), + Color.lerp(onSurfaceNeutral08, other.onSurfaceNeutral08, t)!, onSurfaceNeutral012: - Color.lerp(onSurfaceNeutral012, other.onSurfaceNeutral012, t), + Color.lerp(onSurfaceNeutral012, other.onSurfaceNeutral012, t)!, onSurfaceNeutral016: - Color.lerp(onSurfaceNeutral016, other.onSurfaceNeutral016, t), + Color.lerp(onSurfaceNeutral016, other.onSurfaceNeutral016, t)!, onSurfaceNeutralOpaqueLv0: Color.lerp( onSurfaceNeutralOpaqueLv0, other.onSurfaceNeutralOpaqueLv0, t, - ), + )!, onSurfaceNeutralOpaqueLv1: Color.lerp( onSurfaceNeutralOpaqueLv1, other.onSurfaceNeutralOpaqueLv1, t, - ), + )!, onSurfaceNeutralOpaqueLv2: Color.lerp( onSurfaceNeutralOpaqueLv2, other.onSurfaceNeutralOpaqueLv2, t, - ), + )!, onSurfacePrimaryContainer: Color.lerp( onSurfacePrimaryContainer, other.onSurfacePrimaryContainer, t, - ), + )!, onSurfacePrimary08: - Color.lerp(onSurfacePrimary08, other.onSurfacePrimary08, t), + Color.lerp(onSurfacePrimary08, other.onSurfacePrimary08, t)!, onSurfacePrimary012: - Color.lerp(onSurfacePrimary012, other.onSurfacePrimary012, t), + Color.lerp(onSurfacePrimary012, other.onSurfacePrimary012, t)!, onSurfacePrimary016: - Color.lerp(onSurfacePrimary016, other.onSurfacePrimary016, t), + Color.lerp(onSurfacePrimary016, other.onSurfacePrimary016, t)!, onSurfaceSecondary08: - Color.lerp(onSurfaceSecondary08, other.onSurfaceSecondary08, t), + Color.lerp(onSurfaceSecondary08, other.onSurfaceSecondary08, t)!, onSurfaceSecondary012: - Color.lerp(onSurfaceSecondary012, other.onSurfaceSecondary012, t), + Color.lerp(onSurfaceSecondary012, other.onSurfaceSecondary012, t)!, onSurfaceSecondary016: - Color.lerp(onSurfaceSecondary016, other.onSurfaceSecondary016, t), - onSurfaceError08: Color.lerp(onSurfaceError08, other.onSurfaceError08, t), + Color.lerp(onSurfaceSecondary016, other.onSurfaceSecondary016, t)!, + onSurfaceError08: + Color.lerp(onSurfaceError08, other.onSurfaceError08, t)!, onSurfaceError012: - Color.lerp(onSurfaceError012, other.onSurfaceError012, t), + Color.lerp(onSurfaceError012, other.onSurfaceError012, t)!, onSurfaceError016: - Color.lerp(onSurfaceError016, other.onSurfaceError016, t), - iconsForeground: Color.lerp(iconsForeground, other.iconsForeground, t), - iconsBackground: Color.lerp(iconsBackground, other.iconsBackground, t), + Color.lerp(onSurfaceError016, other.onSurfaceError016, t)!, + iconsForeground: Color.lerp(iconsForeground, other.iconsForeground, t)!, + iconsBackground: Color.lerp(iconsBackground, other.iconsBackground, t)!, iconsBackgroundVariant: - Color.lerp(iconsBackgroundVariant, other.iconsBackgroundVariant, t), - iconsOnImage: Color.lerp(iconsOnImage, other.iconsOnImage, t), - iconsDisabled: Color.lerp(iconsDisabled, other.iconsDisabled, t), - iconsPrimary: Color.lerp(iconsPrimary, other.iconsPrimary, t), - iconsSecondary: Color.lerp(iconsSecondary, other.iconsSecondary, t), - iconsSuccess: Color.lerp(iconsSuccess, other.iconsSuccess, t), - iconsWarning: Color.lerp(iconsWarning, other.iconsWarning, t), - iconsError: Color.lerp(iconsError, other.iconsError, t), - avatarsPrimary: Color.lerp(avatarsPrimary, other.avatarsPrimary, t), - avatarsSecondary: Color.lerp(avatarsSecondary, other.avatarsSecondary, t), - avatarsSuccess: Color.lerp(avatarsSuccess, other.avatarsSuccess, t), - avatarsWarning: Color.lerp(avatarsWarning, other.avatarsWarning, t), - avatarsError: Color.lerp(avatarsError, other.avatarsError, t), + Color.lerp(iconsBackgroundVariant, other.iconsBackgroundVariant, t)!, + iconsOnImage: Color.lerp(iconsOnImage, other.iconsOnImage, t)!, + iconsDisabled: Color.lerp(iconsDisabled, other.iconsDisabled, t)!, + iconsPrimary: Color.lerp(iconsPrimary, other.iconsPrimary, t)!, + iconsSecondary: Color.lerp(iconsSecondary, other.iconsSecondary, t)!, + iconsSuccess: Color.lerp(iconsSuccess, other.iconsSuccess, t)!, + iconsWarning: Color.lerp(iconsWarning, other.iconsWarning, t)!, + iconsError: Color.lerp(iconsError, other.iconsError, t)!, + avatarsPrimary: Color.lerp(avatarsPrimary, other.avatarsPrimary, t)!, + avatarsSecondary: + Color.lerp(avatarsSecondary, other.avatarsSecondary, t)!, + avatarsSuccess: Color.lerp(avatarsSuccess, other.avatarsSuccess, t)!, + avatarsWarning: Color.lerp(avatarsWarning, other.avatarsWarning, t)!, + avatarsError: Color.lerp(avatarsError, other.avatarsError, t)!, elevationsOnSurfaceNeutralLv0: Color.lerp( elevationsOnSurfaceNeutralLv0, other.elevationsOnSurfaceNeutralLv0, t, - ), + )!, elevationsOnSurfaceNeutralLv1Grey: Color.lerp( elevationsOnSurfaceNeutralLv1Grey, other.elevationsOnSurfaceNeutralLv1Grey, t, - ), + )!, elevationsOnSurfaceNeutralLv1White: Color.lerp( elevationsOnSurfaceNeutralLv1White, other.elevationsOnSurfaceNeutralLv1White, t, - ), + )!, elevationsOnSurfaceNeutralLv2: Color.lerp( elevationsOnSurfaceNeutralLv2, other.elevationsOnSurfaceNeutralLv2, t, - ), - outlineBorder: Color.lerp(outlineBorder, other.outlineBorder, t), + )!, + outlineBorder: Color.lerp(outlineBorder, other.outlineBorder, t)!, outlineBorderVariant: - Color.lerp(outlineBorderVariant, other.outlineBorderVariant, t), - primary98: Color.lerp(primary98, other.primary98, t), - primaryContainer: Color.lerp(primaryContainer, other.primaryContainer, t), + Color.lerp(outlineBorderVariant, other.outlineBorderVariant, t)!, + primary98: Color.lerp(primary98, other.primary98, t)!, + primaryContainer: + Color.lerp(primaryContainer, other.primaryContainer, t)!, onPrimaryContainer: - Color.lerp(onPrimaryContainer, other.onPrimaryContainer, t), - onErrorVariant: Color.lerp(onErrorVariant, other.onErrorVariant, t), - errorContainer: Color.lerp(errorContainer, other.errorContainer, t), - onErrorContainer: Color.lerp(onErrorContainer, other.onErrorContainer, t), + Color.lerp(onPrimaryContainer, other.onPrimaryContainer, t)!, + onErrorVariant: Color.lerp(onErrorVariant, other.onErrorVariant, t)!, + errorContainer: Color.lerp(errorContainer, other.errorContainer, t)!, + onErrorContainer: + Color.lerp(onErrorContainer, other.onErrorContainer, t)!, + overlay: Color.lerp(overlay, other.overlay, t)!, + dropShadow: Color.lerp(dropShadow, other.dropShadow, t)!, ); } } diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/catalyst.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/catalyst.dart index c2eebc5dbf7..3a01026e09b 100644 --- a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/catalyst.dart +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/catalyst.dart @@ -4,6 +4,7 @@ import 'package:catalyst_voices_brands/src/theme_extensions/brand_assets.dart'; import 'package:catalyst_voices_brands/src/theme_extensions/voices_color_scheme.dart'; import 'package:catalyst_voices_brands/src/themes/widgets/buttons_theme.dart'; import 'package:catalyst_voices_brands/src/themes/widgets/toggles_theme.dart'; +import 'package:catalyst_voices_brands/src/themes/widgets/voices_dialog_theme.dart'; import 'package:catalyst_voices_brands/src/themes/widgets/voices_input_decoration_theme.dart'; import 'package:flutter/material.dart'; import 'package:google_fonts/google_fonts.dart'; @@ -85,6 +86,8 @@ const VoicesColorScheme darkVoicesColorScheme = VoicesColorScheme( onErrorVariant: VoicesColors.darkOnErrorVariant, errorContainer: VoicesColors.darkErrorContainer, onErrorContainer: VoicesColors.darkOnErrorContainer, + overlay: Color(0xA610141C), + dropShadow: Color(0xA610141C), ); const ColorScheme lightColorScheme = ColorScheme.light( @@ -167,6 +170,8 @@ const VoicesColorScheme lightVoicesColorScheme = VoicesColorScheme( onErrorVariant: VoicesColors.lightOnErrorVariant, errorContainer: VoicesColors.lightErrorContainer, onErrorContainer: VoicesColors.lightOnErrorContainer, + overlay: Color(0x9904080F), + dropShadow: Color(0x9904080F), ); /// [ThemeData] for the `catalyst` brand. @@ -315,13 +320,7 @@ ThemeData _buildThemeData( drawerTheme: DrawerThemeData( backgroundColor: voicesColorScheme.onSurfaceNeutralOpaqueLv0, ), - dialogTheme: DialogTheme( - // N10-38 - barrierColor: const Color(0x212A3D61), - shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)), - clipBehavior: Clip.hardEdge, - backgroundColor: voicesColorScheme.elevationsOnSurfaceNeutralLv1White, - ), + dialogTheme: VoicesDialogTheme(colors: voicesColorScheme), listTileTheme: ListTileThemeData( shape: const StadiumBorder(), minTileHeight: 56, diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/buttons_theme.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/buttons_theme.dart index 5b6f7c2a3a3..52a03e9693a 100644 --- a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/buttons_theme.dart +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/buttons_theme.dart @@ -26,14 +26,14 @@ extension ButtonsThemeExt on ThemeData { side: WidgetStateProperty.resolveWith( (states) { if (states.contains(WidgetState.disabled)) { - return BorderSide(color: colors.onSurfaceNeutral012!); + return BorderSide(color: colors.onSurfaceNeutral012); } if (states.contains(WidgetState.focused)) { return BorderSide(color: colorScheme.primary); } - return BorderSide(color: colors.outlineBorder!); + return BorderSide(color: colors.outlineBorder); }, ), ).merge(_buildBaseButtonStyle(textTheme)), @@ -72,10 +72,10 @@ extension ButtonsThemeExt on ThemeData { side: WidgetStateProperty.resolveWith( (states) { if (states.contains(WidgetState.disabled)) { - return BorderSide(color: colors.iconsDisabled!); + return BorderSide(color: colors.iconsDisabled); } - return BorderSide(color: colors.outlineBorder!); + return BorderSide(color: colors.outlineBorder); }, ), iconSize: const WidgetStatePropertyAll(18), diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/toggles_theme.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/toggles_theme.dart index 949b7231d5d..d5326ae4e67 100644 --- a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/toggles_theme.dart +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/toggles_theme.dart @@ -12,7 +12,7 @@ extension TogglesTheme on ThemeData { fillColor: WidgetStateProperty.resolveWith( (states) { if (states.contains(WidgetState.disabled)) { - return colors.iconsDisabled?.withOpacity(0.32); + return colors.iconsDisabled.withOpacity(0.32); } if (states.contains(WidgetState.selected)) { @@ -78,7 +78,7 @@ extension TogglesTheme on ThemeData { (states) { if (states.contains(WidgetState.disabled)) { return BorderSide( - color: colors.onSurfaceNeutral012!, + color: colors.onSurfaceNeutral012, width: 2, ); } @@ -98,7 +98,7 @@ extension TogglesTheme on ThemeData { } return BorderSide( - color: colors.outlineBorder!, + color: colors.outlineBorder, width: 2, ); }, @@ -114,7 +114,7 @@ extension TogglesTheme on ThemeData { return colorScheme.primary; } - return colors.outlineBorderVariant?.withOpacity(0.38); + return colors.outlineBorderVariant.withOpacity(0.38); }, ), trackOutlineColor: WidgetStateProperty.resolveWith( diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_dialog_theme.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_dialog_theme.dart new file mode 100644 index 00000000000..c62033a0e55 --- /dev/null +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_dialog_theme.dart @@ -0,0 +1,16 @@ +import 'package:catalyst_voices_brands/catalyst_voices_brands.dart'; +import 'package:flutter/material.dart'; + +class VoicesDialogTheme extends DialogTheme { + VoicesDialogTheme({ + required VoicesColorScheme colors, + }) : super( + barrierColor: colors.overlay, + shadowColor: colors.dropShadow, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(12), + ), + clipBehavior: Clip.hardEdge, + backgroundColor: colors.elevationsOnSurfaceNeutralLv1White, + ); +} diff --git a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_input_decoration_theme.dart b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_input_decoration_theme.dart index c7a76100da3..b5409d1adb0 100644 --- a/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_input_decoration_theme.dart +++ b/catalyst_voices/packages/internal/catalyst_voices_brands/lib/src/themes/widgets/voices_input_decoration_theme.dart @@ -32,7 +32,7 @@ class _Border extends MaterialStateOutlineInputBorder { if (states.contains(WidgetState.disabled)) { return OutlineInputBorder( borderSide: BorderSide( - color: colors.outlineBorder!, + color: colors.outlineBorder, width: 1, ), borderRadius: BorderRadius.circular(4), @@ -42,7 +42,7 @@ class _Border extends MaterialStateOutlineInputBorder { if (states.contains(WidgetState.error)) { return OutlineInputBorder( borderSide: BorderSide( - color: colors.iconsError!, + color: colors.iconsError, width: 2, ), borderRadius: BorderRadius.circular(4), @@ -61,7 +61,7 @@ class _Border extends MaterialStateOutlineInputBorder { return OutlineInputBorder( borderSide: BorderSide( - color: colors.outlineBorderVariant!, + color: colors.outlineBorderVariant, width: 1, ), borderRadius: BorderRadius.circular(4), diff --git a/catalyst_voices/utilities/uikit_example/lib/examples/voices_avatar_example.dart b/catalyst_voices/utilities/uikit_example/lib/examples/voices_avatar_example.dart index 5c1c42ae9a1..4f3ae128b4a 100644 --- a/catalyst_voices/utilities/uikit_example/lib/examples/voices_avatar_example.dart +++ b/catalyst_voices/utilities/uikit_example/lib/examples/voices_avatar_example.dart @@ -38,7 +38,7 @@ class VoicesAvatarExample extends StatelessWidget { icon: VoicesAssets.icons.lightBulb.buildIcon(), foregroundColor: Theme.of(context).colors.iconsSecondary, backgroundColor: - Theme.of(context).colors.iconsSecondary?.withOpacity(0.16), + Theme.of(context).colors.iconsSecondary.withOpacity(0.16), ), VoicesAvatar( icon: Image.asset(UiKitAssets.images.robotAvatar.path), diff --git a/catalyst_voices/utilities/uikit_example/lib/examples/voices_badge_example.dart b/catalyst_voices/utilities/uikit_example/lib/examples/voices_badge_example.dart index 3fd662d88d1..54297a54bb2 100644 --- a/catalyst_voices/utilities/uikit_example/lib/examples/voices_badge_example.dart +++ b/catalyst_voices/utilities/uikit_example/lib/examples/voices_badge_example.dart @@ -10,7 +10,7 @@ class VoicesBadgeExample extends StatelessWidget { Widget build(BuildContext context) { final colors = [ Theme.of(context).colorScheme.error, - Theme.of(context).colors.success!, + Theme.of(context).colors.success, ]; return Scaffold( diff --git a/catalyst_voices/utilities/uikit_example/lib/examples/voices_modals_example.dart b/catalyst_voices/utilities/uikit_example/lib/examples/voices_modals_example.dart index 9d6286621e8..c3bd20de3ea 100644 --- a/catalyst_voices/utilities/uikit_example/lib/examples/voices_modals_example.dart +++ b/catalyst_voices/utilities/uikit_example/lib/examples/voices_modals_example.dart @@ -68,7 +68,7 @@ class VoicesModalsExample extends StatelessWidget { color: Theme.of(context).colors.iconsError, ), border: Border.all( - color: Theme.of(context).colors.iconsError!, + color: Theme.of(context).colors.iconsError, width: 3, ), ),