From bc0a70ad2530f967b0b10f61d75936cccedd5946 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Tue, 29 Jun 2021 16:12:51 +0200 Subject: [PATCH] rename colors --- .../example/lib/tutorial-part-3.dart | 4 +- .../example/lib/tutorial-part-6.dart | 4 +- .../lib/src/attachment/attachment_title.dart | 2 +- .../attachment_upload_state_builder.dart | 10 +- .../lib/src/attachment/attachment_widget.dart | 8 +- .../lib/src/attachment/file_attachment.dart | 25 +- .../lib/src/attachment/giphy_attachment.dart | 31 +-- .../lib/src/attachment/image_attachment.dart | 4 +- .../lib/src/attachment_actions_modal.dart | 24 +- .../lib/src/back_button.dart | 2 +- .../lib/src/channel_bottom_sheet.dart | 16 +- .../lib/src/channel_image.dart | 12 +- .../lib/src/channel_info.dart | 2 +- .../lib/src/channel_list_header.dart | 6 +- .../lib/src/channel_list_view.dart | 32 +-- .../lib/src/date_divider.dart | 2 +- .../lib/src/deleted_message.dart | 4 +- .../lib/src/group_image.dart | 4 +- .../lib/src/image_footer.dart | 13 +- .../lib/src/image_header.dart | 4 +- .../lib/src/info_tile.dart | 4 +- .../lib/src/media_list_view.dart | 11 +- .../lib/src/mention_tile.dart | 4 +- .../lib/src/message_actions_modal.dart | 18 +- .../lib/src/message_input.dart | 129 +++++----- .../lib/src/message_list_view.dart | 16 +- .../lib/src/message_reactions_modal.dart | 4 +- .../lib/src/message_search_list_view.dart | 6 +- .../lib/src/message_widget.dart | 18 +- .../lib/src/option_list_tile.dart | 4 +- .../lib/src/quoted_message_widget.dart | 4 +- .../lib/src/reaction_bubble.dart | 4 +- .../lib/src/reaction_picker.dart | 2 +- .../lib/src/sending_indicator.dart | 2 +- .../lib/src/stream_chat.dart | 4 +- .../lib/src/stream_chat_theme.dart | 231 +++++++++--------- .../lib/src/swipeable.dart | 5 +- .../lib/src/system_message.dart | 2 +- .../lib/src/upload_progress_indicator.dart | 2 +- .../lib/src/url_attachment.dart | 4 +- .../lib/src/user_avatar.dart | 8 +- .../lib/src/user_item.dart | 6 +- .../lib/src/user_list_view.dart | 8 +- .../stream_chat_flutter/lib/src/utils.dart | 17 +- .../lib/src/video_thumbnail_image.dart | 4 +- .../example/lib/main.dart | 8 +- 46 files changed, 379 insertions(+), 355 deletions(-) diff --git a/packages/stream_chat_flutter/example/lib/tutorial-part-3.dart b/packages/stream_chat_flutter/example/lib/tutorial-part-3.dart index fc55f6d9..6789a69d 100644 --- a/packages/stream_chat_flutter/example/lib/tutorial-part-3.dart +++ b/packages/stream_chat_flutter/example/lib/tutorial-part-3.dart @@ -101,12 +101,12 @@ class ChannelListPage extends StatelessWidget { StreamChatTheme.of(context).channelPreviewTheme.title!.copyWith( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(opacity), ), ), subtitle: Text(subtitle), - trailing: channel.state!.unreadCount! > 0 + trailing: channel.state!.unreadCount > 0 ? CircleAvatar( radius: 10, child: Text(channel.state!.unreadCount.toString()), diff --git a/packages/stream_chat_flutter/example/lib/tutorial-part-6.dart b/packages/stream_chat_flutter/example/lib/tutorial-part-6.dart index c49ffaf1..e4f5b8a5 100644 --- a/packages/stream_chat_flutter/example/lib/tutorial-part-6.dart +++ b/packages/stream_chat_flutter/example/lib/tutorial-part-6.dart @@ -50,9 +50,9 @@ class MyApp extends StatelessWidget { ), ), otherMessageTheme: MessageTheme( - messageBackgroundColor: colorTheme.black, + messageBackgroundColor: colorTheme.textHighEmphasis, messageText: TextStyle( - color: colorTheme.white, + color: colorTheme.barsBg, ), avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(8), diff --git a/packages/stream_chat_flutter/lib/src/attachment/attachment_title.dart b/packages/stream_chat_flutter/lib/src/attachment/attachment_title.dart index ba369e5d..b068a8f9 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/attachment_title.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/attachment_title.dart @@ -35,7 +35,7 @@ class AttachmentTitle extends StatelessWidget { attachment.title!, overflow: TextOverflow.ellipsis, style: messageTheme.messageText?.copyWith( - color: StreamChatTheme.of(context).colorTheme.accentBlue, + color: StreamChatTheme.of(context).colorTheme.accentPrimary, fontWeight: FontWeight.bold, ), ), diff --git a/packages/stream_chat_flutter/lib/src/attachment/attachment_upload_state_builder.dart b/packages/stream_chat_flutter/lib/src/attachment/attachment_upload_state_builder.dart index 825def58..b1b29c4c 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/attachment_upload_state_builder.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/attachment_upload_state_builder.dart @@ -129,7 +129,7 @@ class _PreparingState extends StatelessWidget { alignment: Alignment.topRight, child: _IconButton( icon: StreamSvgIcon.close( - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, ), onPressed: () => channel.cancelAttachmentUpload(attachmentId), ), @@ -169,7 +169,7 @@ class _InProgressState extends StatelessWidget { alignment: Alignment.topRight, child: _IconButton( icon: StreamSvgIcon.close( - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, ), onPressed: () => channel.cancelAttachmentUpload(attachmentId), ), @@ -208,7 +208,7 @@ class _FailedState extends StatelessWidget { children: [ _IconButton( icon: StreamSvgIcon.retry( - color: theme.colorTheme.white, + color: theme.colorTheme.barsBg, ), onPressed: () { channel.retryAttachmentUpload(messageId, attachmentId); @@ -228,7 +228,7 @@ class _FailedState extends StatelessWidget { child: Text( 'UPLOAD ERROR', style: theme.textTheme.footnote.copyWith( - color: theme.colorTheme.white, + color: theme.colorTheme.barsBg, ), ), ), @@ -247,7 +247,7 @@ class _SuccessState extends StatelessWidget { backgroundColor: StreamChatTheme.of(context).colorTheme.overlayDark, maxRadius: 12, child: StreamSvgIcon.check( - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, ), ), ); diff --git a/packages/stream_chat_flutter/lib/src/attachment/attachment_widget.dart b/packages/stream_chat_flutter/lib/src/attachment/attachment_widget.dart index ee79d959..e92087b5 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/attachment_widget.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/attachment_widget.dart @@ -75,12 +75,14 @@ class AttachmentError extends StatelessWidget { child: Container( width: size?.width, height: size?.height, - color: - StreamChatTheme.of(context).colorTheme.accentRed.withOpacity(.1), + color: StreamChatTheme.of(context) + .colorTheme + .accentError + .withOpacity(.1), child: Center( child: Icon( Icons.error_outline, - color: StreamChatTheme.of(context).colorTheme.black, + color: StreamChatTheme.of(context).colorTheme.textHighEmphasis, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/attachment/file_attachment.dart b/packages/stream_chat_flutter/lib/src/attachment/file_attachment.dart index 7ec5fb04..99c3ec40 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/file_attachment.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/file_attachment.dart @@ -54,10 +54,10 @@ class FileAttachment extends AttachmentWidget { width: size?.width ?? 100, height: 56, decoration: BoxDecoration( - color: colorTheme.white, + color: colorTheme.barsBg, borderRadius: BorderRadius.circular(12), border: Border.all( - color: colorTheme.greyWhisper, + color: colorTheme.borders, ), ), child: Row( @@ -141,8 +141,8 @@ class FileAttachment extends AttachmentWidget { final colorTheme = StreamChatTheme.of(context).colorTheme; return Shimmer.fromColors( - baseColor: colorTheme.greyGainsboro, - highlightColor: colorTheme.whiteSmoke, + baseColor: colorTheme.disabled, + highlightColor: colorTheme.inputBg, child: image, ); }, @@ -217,7 +217,7 @@ class FileAttachment extends AttachmentWidget { preparing: () => Padding( padding: const EdgeInsets.all(8), child: _buildButton( - icon: StreamSvgIcon.close(color: theme.colorTheme.white), + icon: StreamSvgIcon.close(color: theme.colorTheme.barsBg), fillColor: theme.colorTheme.overlayDark, onPressed: () => channel.cancelAttachmentUpload(attachmentId), ), @@ -225,7 +225,7 @@ class FileAttachment extends AttachmentWidget { inProgress: (_, __) => Padding( padding: const EdgeInsets.all(8), child: _buildButton( - icon: StreamSvgIcon.close(color: theme.colorTheme.white), + icon: StreamSvgIcon.close(color: theme.colorTheme.barsBg), fillColor: theme.colorTheme.overlayDark, onPressed: () => channel.cancelAttachmentUpload(attachmentId), ), @@ -233,15 +233,15 @@ class FileAttachment extends AttachmentWidget { success: () => Padding( padding: const EdgeInsets.all(8), child: CircleAvatar( - backgroundColor: theme.colorTheme.accentBlue, + backgroundColor: theme.colorTheme.accentPrimary, maxRadius: 12, - child: StreamSvgIcon.check(color: theme.colorTheme.white), + child: StreamSvgIcon.check(color: theme.colorTheme.barsBg), ), ), failed: (_) => Padding( padding: const EdgeInsets.all(8), child: _buildButton( - icon: StreamSvgIcon.retry(color: theme.colorTheme.white), + icon: StreamSvgIcon.retry(color: theme.colorTheme.barsBg), fillColor: theme.colorTheme.overlayDark, onPressed: () => channel.retryAttachmentUpload( message.id, @@ -253,7 +253,8 @@ class FileAttachment extends AttachmentWidget { if (message.status == MessageSendingStatus.sent) { trailingWidget = IconButton( - icon: StreamSvgIcon.cloudDownload(color: theme.colorTheme.black), + icon: StreamSvgIcon.cloudDownload( + color: theme.colorTheme.textHighEmphasis), visualDensity: VisualDensity.compact, splashRadius: 16, onPressed: () { @@ -272,7 +273,7 @@ class FileAttachment extends AttachmentWidget { final theme = StreamChatTheme.of(context); final size = attachment.file?.size ?? attachment.extraData['file_size']; final textStyle = theme.textTheme.footnote.copyWith( - color: theme.colorTheme.grey, + color: theme.colorTheme.textLowEmphasis, ); return attachment.uploadState.when( preparing: () => Text(fileSize(size), style: textStyle), @@ -282,7 +283,7 @@ class FileAttachment extends AttachmentWidget { showBackground: false, padding: EdgeInsets.zero, textStyle: textStyle, - progressIndicatorColor: theme.colorTheme.accentBlue, + progressIndicatorColor: theme.colorTheme.accentPrimary, ), success: () => Text(fileSize(size), style: textStyle), failed: (_) => Text('UPLOAD ERROR', style: textStyle), diff --git a/packages/stream_chat_flutter/lib/src/attachment/giphy_attachment.dart b/packages/stream_chat_flutter/lib/src/attachment/giphy_attachment.dart index 1572061e..f14abffc 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/giphy_attachment.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/giphy_attachment.dart @@ -51,7 +51,7 @@ class GiphyAttachment extends AttachmentWidget { mainAxisSize: MainAxisSize.min, children: [ Card( - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, elevation: 2, clipBehavior: Clip.hardEdge, shape: const RoundedRectangleBorder( @@ -83,7 +83,7 @@ class GiphyAttachment extends AttachmentWidget { style: TextStyle( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.5), ), overflow: TextOverflow.ellipsis, @@ -117,7 +117,7 @@ class GiphyAttachment extends AttachmentWidget { Container( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.2), width: double.infinity, height: 0.5, @@ -141,7 +141,7 @@ class GiphyAttachment extends AttachmentWidget { .copyWith( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.5), ), ), @@ -152,7 +152,7 @@ class GiphyAttachment extends AttachmentWidget { width: 0.5, color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.2), height: 50, ), @@ -173,7 +173,7 @@ class GiphyAttachment extends AttachmentWidget { .copyWith( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.5), ), maxLines: 1, @@ -185,7 +185,7 @@ class GiphyAttachment extends AttachmentWidget { width: 0.5, color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.2), height: 50, ), @@ -203,7 +203,7 @@ class GiphyAttachment extends AttachmentWidget { style: TextStyle( color: StreamChatTheme.of(context) .colorTheme - .accentBlue, + .accentPrimary, fontWeight: FontWeight.bold, ), ), @@ -226,7 +226,7 @@ class GiphyAttachment extends AttachmentWidget { StreamSvgIcon.eye( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.5), size: 16, ), @@ -241,7 +241,7 @@ class GiphyAttachment extends AttachmentWidget { .copyWith( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(0.5)), ), ], @@ -306,8 +306,8 @@ class GiphyAttachment extends AttachmentWidget { final colorTheme = StreamChatTheme.of(context).colorTheme; return Shimmer.fromColors( - baseColor: colorTheme.greyGainsboro, - highlightColor: colorTheme.whiteSmoke, + baseColor: colorTheme.disabled, + highlightColor: colorTheme.inputBg, child: image, ); }, @@ -322,7 +322,7 @@ class GiphyAttachment extends AttachmentWidget { child: Material( color: StreamChatTheme.of(context) .colorTheme - .black + .textHighEmphasis .withOpacity(.5), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), @@ -335,13 +335,14 @@ class GiphyAttachment extends AttachmentWidget { child: Row( children: [ StreamSvgIcon.lightning( - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, size: 16, ), Text( 'GIPHY', style: TextStyle( - color: StreamChatTheme.of(context).colorTheme.white, + color: + StreamChatTheme.of(context).colorTheme.barsBg, fontWeight: FontWeight.bold, fontSize: 11, ), diff --git a/packages/stream_chat_flutter/lib/src/attachment/image_attachment.dart b/packages/stream_chat_flutter/lib/src/attachment/image_attachment.dart index c677435a..20174567 100644 --- a/packages/stream_chat_flutter/lib/src/attachment/image_attachment.dart +++ b/packages/stream_chat_flutter/lib/src/attachment/image_attachment.dart @@ -103,8 +103,8 @@ class ImageAttachment extends AttachmentWidget { ); final colorTheme = StreamChatTheme.of(context).colorTheme; return Shimmer.fromColors( - baseColor: colorTheme.greyGainsboro, - highlightColor: colorTheme.whiteSmoke, + baseColor: colorTheme.disabled, + highlightColor: colorTheme.inputBg, child: image, ); }, diff --git a/packages/stream_chat_flutter/lib/src/attachment_actions_modal.dart b/packages/stream_chat_flutter/lib/src/attachment_actions_modal.dart index 363fac45..ea189b91 100644 --- a/packages/stream_chat_flutter/lib/src/attachment_actions_modal.dart +++ b/packages/stream_chat_flutter/lib/src/attachment_actions_modal.dart @@ -72,7 +72,7 @@ class AttachmentActionsModal extends StatelessWidget { 'Reply', StreamSvgIcon.iconCurveLineLeftUp( size: 24, - color: theme.colorTheme.grey, + color: theme.colorTheme.textLowEmphasis, ), () { Navigator.pop(context, ReturnActionType.reply); @@ -83,7 +83,7 @@ class AttachmentActionsModal extends StatelessWidget { 'Show in Chat', StreamSvgIcon.eye( size: 24, - color: theme.colorTheme.black, + color: theme.colorTheme.textHighEmphasis, ), onShowMessage, ), @@ -93,7 +93,7 @@ class AttachmentActionsModal extends StatelessWidget { 'Save ${message.attachments[currentIndex].type == 'video' ? 'Video' : 'Image'}', StreamSvgIcon.iconSave( size: 24, - color: theme.colorTheme.grey, + color: theme.colorTheme.textLowEmphasis, ), () { final attachment = message.attachments[currentIndex]; @@ -144,7 +144,7 @@ class AttachmentActionsModal extends StatelessWidget { 'Delete', StreamSvgIcon.delete( size: 24, - color: theme.colorTheme.accentRed, + color: theme.colorTheme.accentError, ), () { final channel = StreamChannel.of(context).channel; @@ -165,7 +165,7 @@ class AttachmentActionsModal extends StatelessWidget { ..maybePop(); } }, - color: theme.colorTheme.accentRed, + color: theme.colorTheme.accentError, ), ] .map((e) => Align( @@ -175,7 +175,7 @@ class AttachmentActionsModal extends StatelessWidget { .insertBetween( Container( height: 1, - color: theme.colorTheme.greyWhisper, + color: theme.colorTheme.borders, ), ), ), @@ -196,7 +196,7 @@ class AttachmentActionsModal extends StatelessWidget { }) => Material( key: key, - color: StreamChatTheme.of(context).colorTheme.white, + color: StreamChatTheme.of(context).colorTheme.barsBg, child: InkWell( onTap: onTap, child: Padding( @@ -241,7 +241,7 @@ class AttachmentActionsModal extends StatelessWidget { width: 182, decoration: BoxDecoration( borderRadius: BorderRadius.circular(16), - color: theme.colorTheme.white, + color: theme.colorTheme.barsBg, ), child: Center( child: progress == null @@ -249,7 +249,7 @@ class AttachmentActionsModal extends StatelessWidget { height: 100, width: 100, child: StreamSvgIcon.error( - color: theme.colorTheme.greyGainsboro, + color: theme.colorTheme.disabled, ), ) : progress.toProgressIndicatorValue == 1.0 @@ -258,7 +258,7 @@ class AttachmentActionsModal extends StatelessWidget { height: 160, width: 160, child: StreamSvgIcon.check( - color: theme.colorTheme.greyGainsboro, + color: theme.colorTheme.disabled, ), ) : SizedBox( @@ -271,14 +271,14 @@ class AttachmentActionsModal extends StatelessWidget { value: progress.toProgressIndicatorValue, strokeWidth: 8, valueColor: AlwaysStoppedAnimation( - theme.colorTheme.accentBlue, + theme.colorTheme.accentPrimary, ), ), Center( child: Text( '${progress.toPercentage}%', style: theme.textTheme.headline.copyWith( - color: theme.colorTheme.grey, + color: theme.colorTheme.textLowEmphasis, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/back_button.dart b/packages/stream_chat_flutter/lib/src/back_button.dart index e8fe7e31..6bd3e0cc 100644 --- a/packages/stream_chat_flutter/lib/src/back_button.dart +++ b/packages/stream_chat_flutter/lib/src/back_button.dart @@ -44,7 +44,7 @@ class StreamBackButton extends StatelessWidget { padding: const EdgeInsets.all(14), child: StreamSvgIcon.left( size: 24, - color: StreamChatTheme.of(context).colorTheme.black, + color: StreamChatTheme.of(context).colorTheme.textHighEmphasis, ), ), if (showUnreads) diff --git a/packages/stream_chat_flutter/lib/src/channel_bottom_sheet.dart b/packages/stream_chat_flutter/lib/src/channel_bottom_sheet.dart index eaabb7e2..368bfbd8 100644 --- a/packages/stream_chat_flutter/lib/src/channel_bottom_sheet.dart +++ b/packages/stream_chat_flutter/lib/src/channel_bottom_sheet.dart @@ -32,7 +32,7 @@ class _ChannelBottomSheetState extends State { final isOwner = userAsMember.role == 'owner'; return Material( - color: _streamChatThemeData.colorTheme.white, + color: _streamChatThemeData.colorTheme.barsBg, clipBehavior: Clip.antiAlias, shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( @@ -146,7 +146,7 @@ class _ChannelBottomSheetState extends State { leading: Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: StreamSvgIcon.user( - color: _streamChatThemeData.colorTheme.grey, + color: _streamChatThemeData.colorTheme.textLowEmphasis, ), ), title: 'View Info', @@ -157,7 +157,7 @@ class _ChannelBottomSheetState extends State { leading: Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: StreamSvgIcon.userRemove( - color: _streamChatThemeData.colorTheme.grey, + color: _streamChatThemeData.colorTheme.textLowEmphasis, ), ), title: 'Leave Group', @@ -176,11 +176,11 @@ class _ChannelBottomSheetState extends State { leading: Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: StreamSvgIcon.delete( - color: _streamChatThemeData.colorTheme.accentRed, + color: _streamChatThemeData.colorTheme.accentError, ), ), title: 'Delete Conversation', - titleColor: _streamChatThemeData.colorTheme.accentRed, + titleColor: _streamChatThemeData.colorTheme.accentError, onTap: () async { setState(() { _showActions = false; @@ -195,7 +195,7 @@ class _ChannelBottomSheetState extends State { leading: Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: StreamSvgIcon.closeSmall( - color: _streamChatThemeData.colorTheme.grey, + color: _streamChatThemeData.colorTheme.textLowEmphasis, ), ), title: 'Cancel', @@ -224,7 +224,7 @@ class _ChannelBottomSheetState extends State { question: 'Are you sure you want to delete this conversation?', cancelText: 'CANCEL', icon: StreamSvgIcon.delete( - color: _streamChatThemeData.colorTheme.accentRed, + color: _streamChatThemeData.colorTheme.accentError, ), ); final channel = _streamChannelState.channel; @@ -242,7 +242,7 @@ class _ChannelBottomSheetState extends State { question: 'Are you sure you want to leave this conversation?', cancelText: 'CANCEL', icon: StreamSvgIcon.userRemove( - color: _streamChatThemeData.colorTheme.accentRed, + color: _streamChatThemeData.colorTheme.accentError, ), ); if (res == true) { diff --git a/packages/stream_chat_flutter/lib/src/channel_image.dart b/packages/stream_chat_flutter/lib/src/channel_image.dart index d3e028ee..9ac07033 100644 --- a/packages/stream_chat_flutter/lib/src/channel_image.dart +++ b/packages/stream_chat_flutter/lib/src/channel_image.dart @@ -110,8 +110,8 @@ class ChannelImage extends StatelessWidget { .channelPreviewTheme.avatarTheme?.constraints, onTap: onTap != null ? (_) => onTap!() : null, selected: selected, - selectionColor: - selectionColor ?? chatThemeData.colorTheme.accentBlue, + selectionColor: selectionColor ?? + chatThemeData.colorTheme.accentPrimary, selectionThickness: selectionThickness, )); } else { @@ -132,7 +132,7 @@ class ChannelImage extends StatelessWidget { onTap: onTap, selected: selected, selectionColor: - selectionColor ?? chatThemeData.colorTheme.accentBlue, + selectionColor ?? chatThemeData.colorTheme.accentPrimary, selectionThickness: selectionThickness, ); } @@ -144,7 +144,7 @@ class ChannelImage extends StatelessWidget { constraints: constraints ?? chatThemeData.channelPreviewTheme.avatarTheme?.constraints, decoration: BoxDecoration( - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ), child: Stack( alignment: Alignment.center, @@ -157,7 +157,7 @@ class ChannelImage extends StatelessWidget { child: Text( data.containsKey('name') ? data['name'][0] : '', style: TextStyle( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, fontWeight: FontWeight.bold, ), ), @@ -189,7 +189,7 @@ class ChannelImage extends StatelessWidget { child: Container( constraints: constraints ?? chatThemeData.ownMessageTheme.avatarTheme?.constraints, - color: selectionColor ?? chatThemeData.colorTheme.accentBlue, + color: selectionColor ?? chatThemeData.colorTheme.accentPrimary, child: Padding( padding: EdgeInsets.all(selectionThickness), child: child, diff --git a/packages/stream_chat_flutter/lib/src/channel_info.dart b/packages/stream_chat_flutter/lib/src/channel_info.dart index 07920b95..3be26ec8 100644 --- a/packages/stream_chat_flutter/lib/src/channel_info.dart +++ b/packages/stream_chat_flutter/lib/src/channel_info.dart @@ -143,7 +143,7 @@ class ChannelInfo extends StatelessWidget { child: Text( 'Try Again', style: textStyle?.copyWith( - color: StreamChatTheme.of(context).colorTheme.accentBlue, + color: StreamChatTheme.of(context).colorTheme.accentPrimary, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/channel_list_header.dart b/packages/stream_chat_flutter/lib/src/channel_list_header.dart index 5a4275a6..0db31f80 100644 --- a/packages/stream_chat_flutter/lib/src/channel_list_header.dart +++ b/packages/stream_chat_flutter/lib/src/channel_list_header.dart @@ -154,7 +154,7 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget { Color? color; switch (status) { case ConnectionStatus.connected: - color = chatThemeData.colorTheme.accentBlue; + color = chatThemeData.colorTheme.accentPrimary; break; case ConnectionStatus.connecting: color = Colors.grey; @@ -209,7 +209,7 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget { return Text( 'Stream Chat', style: chatThemeData.textTheme.headlineBold.copyWith( - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, ), ); } @@ -262,7 +262,7 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget { style: chatThemeData.channelListHeaderTheme.title?.copyWith( fontSize: 16, fontWeight: FontWeight.bold, - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/channel_list_view.dart b/packages/stream_chat_flutter/lib/src/channel_list_view.dart index b14e0b75..316d7513 100644 --- a/packages/stream_chat_flutter/lib/src/channel_list_view.dart +++ b/packages/stream_chat_flutter/lib/src/channel_list_view.dart @@ -290,7 +290,7 @@ class _ChannelListViewState extends State { padding: const EdgeInsets.all(8), child: StreamSvgIcon.message( size: 136, - color: chatThemeData.colorTheme.greyGainsboro, + color: chatThemeData.colorTheme.disabled, ), ), Padding( @@ -309,7 +309,7 @@ class _ChannelListViewState extends State { 'How about sending your first message to a friend?', textAlign: TextAlign.center, style: chatThemeData.textTheme.body.copyWith( - color: chatThemeData.colorTheme.grey, + color: chatThemeData.colorTheme.textLowEmphasis, ), ), ), @@ -327,7 +327,7 @@ class _ChannelListViewState extends State { child: Text( 'Start a chat', style: chatThemeData.textTheme.bodyBold.copyWith( - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ), ), ), @@ -362,8 +362,8 @@ class _ChannelListViewState extends State { final chatThemeData = StreamChatTheme.of(context); if (widget.crossAxisCount > 1) { return Shimmer.fromColors( - baseColor: chatThemeData.colorTheme.greyGainsboro, - highlightColor: chatThemeData.colorTheme.whiteSmoke, + baseColor: chatThemeData.colorTheme.disabled, + highlightColor: chatThemeData.colorTheme.inputBg, child: Column( children: [ const SizedBox(height: 4), @@ -391,12 +391,12 @@ class _ChannelListViewState extends State { ); } else { return Shimmer.fromColors( - baseColor: chatThemeData.colorTheme.greyGainsboro, - highlightColor: chatThemeData.colorTheme.whiteSmoke, + baseColor: chatThemeData.colorTheme.disabled, + highlightColor: chatThemeData.colorTheme.inputBg, child: ListTile( leading: Container( decoration: BoxDecoration( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, shape: BoxShape.circle, ), constraints: const BoxConstraints.tightFor( @@ -412,7 +412,7 @@ class _ChannelListViewState extends State { alignment: Alignment.centerLeft, child: Container( decoration: BoxDecoration( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, borderRadius: BorderRadius.circular(11), ), constraints: const BoxConstraints.tightFor( @@ -429,7 +429,7 @@ class _ChannelListViewState extends State { alignment: Alignment.centerLeft, child: Container( decoration: BoxDecoration( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, borderRadius: BorderRadius.circular(11), ), constraints: const BoxConstraints.expand( @@ -441,7 +441,7 @@ class _ChannelListViewState extends State { Container( margin: const EdgeInsets.only(left: 16), decoration: BoxDecoration( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, borderRadius: BorderRadius.circular(11), ), constraints: const BoxConstraints.tightFor( @@ -488,7 +488,7 @@ class _ChannelListViewState extends State { final channelsBloc = ChannelsBloc.of(context); final onTap = _getChannelTap(context); final chatThemeData = StreamChatTheme.of(context); - final backgroundColor = chatThemeData.colorTheme.whiteSmoke; + final backgroundColor = chatThemeData.colorTheme.inputBg; if (i < channels.length) { final channel = channels[i]; @@ -549,7 +549,7 @@ class _ChannelListViewState extends State { IconSlideAction( color: backgroundColor, iconWidget: StreamSvgIcon.delete( - color: chatThemeData.colorTheme.accentRed, + color: chatThemeData.colorTheme.accentError, ), onTap: widget.onDeletePressed != null ? () { @@ -565,7 +565,7 @@ class _ChannelListViewState extends State { 'Are you sure you want to delete this conversation?', cancelText: 'CANCEL', icon: StreamSvgIcon.delete( - color: chatThemeData.colorTheme.accentRed, + color: chatThemeData.colorTheme.accentError, ), ); if (res == true) { @@ -576,7 +576,7 @@ class _ChannelListViewState extends State { ], child: DecoratedBox( decoration: BoxDecoration( - color: chatThemeData.colorTheme.whiteSnow, + color: chatThemeData.colorTheme.appBg, ), child: widget.channelPreviewBuilder?.call(context, channel) ?? ChannelPreview( @@ -664,7 +664,7 @@ class _ChannelListViewState extends State { errorBuilder: (context, err) => Container( color: StreamChatTheme.of(context) .colorTheme - .accentRed + .accentError .withOpacity(.2), child: const Padding( padding: EdgeInsets.symmetric(vertical: 16), diff --git a/packages/stream_chat_flutter/lib/src/date_divider.dart b/packages/stream_chat_flutter/lib/src/date_divider.dart index 185683be..8fff2ade 100644 --- a/packages/stream_chat_flutter/lib/src/date_divider.dart +++ b/packages/stream_chat_flutter/lib/src/date_divider.dart @@ -55,7 +55,7 @@ class DateDivider extends StatelessWidget { child: Text( dayInfo, style: chatThemeData.textTheme.footnote.copyWith( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/deleted_message.dart b/packages/stream_chat_flutter/lib/src/deleted_message.dart index 9a4e0ae2..011b0c72 100644 --- a/packages/stream_chat_flutter/lib/src/deleted_message.dart +++ b/packages/stream_chat_flutter/lib/src/deleted_message.dart @@ -39,8 +39,8 @@ class DeletedMessage extends StatelessWidget { side: borderSide ?? BorderSide( color: Theme.of(context).brightness == Brightness.dark - ? chatThemeData.colorTheme.white.withAlpha(24) - : chatThemeData.colorTheme.black.withAlpha(24), + ? chatThemeData.colorTheme.barsBg.withAlpha(24) + : chatThemeData.colorTheme.textHighEmphasis.withAlpha(24), ), ), child: Padding( diff --git a/packages/stream_chat_flutter/lib/src/group_image.dart b/packages/stream_chat_flutter/lib/src/group_image.dart index c6778a91..3513bda2 100644 --- a/packages/stream_chat_flutter/lib/src/group_image.dart +++ b/packages/stream_chat_flutter/lib/src/group_image.dart @@ -51,7 +51,7 @@ class GroupImage extends StatelessWidget { constraints: constraints ?? streamChatTheme.ownMessageTheme.avatarTheme?.constraints, decoration: BoxDecoration( - color: streamChatTheme.colorTheme.accentBlue, + color: streamChatTheme.colorTheme.accentPrimary, ), child: Flex( direction: Axis.vertical, @@ -119,7 +119,7 @@ class GroupImage extends StatelessWidget { BorderRadius.zero) + BorderRadius.circular(selectionThickness), child: Container( - color: selectionColor ?? streamChatTheme.colorTheme.accentBlue, + color: selectionColor ?? streamChatTheme.colorTheme.accentPrimary, height: 64, width: 64, child: Padding( diff --git a/packages/stream_chat_flutter/lib/src/image_footer.dart b/packages/stream_chat_flutter/lib/src/image_footer.dart index 0a6571cc..4b32afd8 100644 --- a/packages/stream_chat_flutter/lib/src/image_footer.dart +++ b/packages/stream_chat_flutter/lib/src/image_footer.dart @@ -88,7 +88,7 @@ class _ImageFooterState extends State { context: context, removeTop: true, child: BottomAppBar( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ @@ -100,7 +100,7 @@ class _ImageFooterState extends State { IconButton( icon: StreamSvgIcon.iconShare( size: 24, - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, ), onPressed: () async { final attachment = @@ -144,7 +144,7 @@ class _ImageFooterState extends State { ), IconButton( icon: StreamSvgIcon.iconGrid( - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, ), onPressed: () => _showPhotosModal(context), ), @@ -160,7 +160,7 @@ class _ImageFooterState extends State { showModalBottomSheet( context: context, barrierColor: chatThemeData.colorTheme.overlay, - backgroundColor: chatThemeData.colorTheme.white, + backgroundColor: chatThemeData.colorTheme.barsBg, isScrollControlled: true, shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( @@ -199,7 +199,7 @@ class _ImageFooterState extends State { alignment: Alignment.centerRight, child: IconButton( icon: StreamSvgIcon.close( - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, ), onPressed: () => Navigator.maybePop(context), ), @@ -262,7 +262,8 @@ class _ImageFooterState extends State { boxShadow: [ BoxShadow( blurRadius: 8, - color: chatThemeData.colorTheme.black + color: chatThemeData + .colorTheme.textHighEmphasis .withOpacity(0.3), ), ], diff --git a/packages/stream_chat_flutter/lib/src/image_header.dart b/packages/stream_chat_flutter/lib/src/image_header.dart index 3d156b16..92f4fa10 100644 --- a/packages/stream_chat_flutter/lib/src/image_header.dart +++ b/packages/stream_chat_flutter/lib/src/image_header.dart @@ -59,7 +59,7 @@ class ImageHeader extends StatelessWidget implements PreferredSizeWidget { leading: showBackButton ? IconButton( icon: StreamSvgIcon.close( - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, size: 24, ), onPressed: onBackPressed, @@ -70,7 +70,7 @@ class ImageHeader extends StatelessWidget implements PreferredSizeWidget { if (message.type != 'ephemeral') IconButton( icon: StreamSvgIcon.iconMenuPoint( - color: chatThemeData.colorTheme.black, + color: chatThemeData.colorTheme.textHighEmphasis, ), onPressed: () { _showMessageActionModalBottomSheet(context); diff --git a/packages/stream_chat_flutter/lib/src/info_tile.dart b/packages/stream_chat_flutter/lib/src/info_tile.dart index 1e935942..965d4fed 100644 --- a/packages/stream_chat_flutter/lib/src/info_tile.dart +++ b/packages/stream_chat_flutter/lib/src/info_tile.dart @@ -46,8 +46,8 @@ class InfoTile extends StatelessWidget { childAnchor: childAnchor ?? Alignment.bottomCenter, portal: Container( height: 25, - color: - backgroundColor ?? chatThemeData.colorTheme.grey.withOpacity(0.9), + color: backgroundColor ?? + chatThemeData.colorTheme.textLowEmphasis.withOpacity(0.9), child: Center( child: Text( message, diff --git a/packages/stream_chat_flutter/lib/src/media_list_view.dart b/packages/stream_chat_flutter/lib/src/media_list_view.dart index fe0070f9..77359f8b 100644 --- a/packages/stream_chat_flutter/lib/src/media_list_view.dart +++ b/packages/stream_chat_flutter/lib/src/media_list_view.dart @@ -90,8 +90,8 @@ class _MediaListViewState extends State { ? 1.0 : 0.0, child: Container( - color: - chatThemeData.colorTheme.black.withOpacity(0.5), + color: chatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.5), alignment: Alignment.topRight, padding: const EdgeInsets.only( top: 8, @@ -99,10 +99,11 @@ class _MediaListViewState extends State { ), child: CircleAvatar( radius: 12, - backgroundColor: chatThemeData.colorTheme.white, + backgroundColor: chatThemeData.colorTheme.barsBg, child: StreamSvgIcon.check( size: 24, - color: chatThemeData.colorTheme.black, + color: + chatThemeData.colorTheme.textHighEmphasis, ), ), ), @@ -124,7 +125,7 @@ class _MediaListViewState extends State { child: Text( media.videoDuration.format(), style: TextStyle( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/mention_tile.dart b/packages/stream_chat_flutter/lib/src/mention_tile.dart index 99b4b962..d9469215 100644 --- a/packages/stream_chat_flutter/lib/src/mention_tile.dart +++ b/packages/stream_chat_flutter/lib/src/mention_tile.dart @@ -76,7 +76,7 @@ class MentionTile extends StatelessWidget { maxLines: 1, overflow: TextOverflow.ellipsis, style: chatThemeData.textTheme.footnoteBold.copyWith( - color: chatThemeData.colorTheme.grey, + color: chatThemeData.colorTheme.textLowEmphasis, ), ), ], @@ -90,7 +90,7 @@ class MentionTile extends StatelessWidget { left: 8, ), child: StreamSvgIcon.mentions( - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ), ), ], diff --git a/packages/stream_chat_flutter/lib/src/message_actions_modal.dart b/packages/stream_chat_flutter/lib/src/message_actions_modal.dart index 296b1e59..3e653187 100644 --- a/packages/stream_chat_flutter/lib/src/message_actions_modal.dart +++ b/packages/stream_chat_flutter/lib/src/message_actions_modal.dart @@ -165,7 +165,7 @@ class _MessageActionsModalState extends State { child: SizedBox( width: mediaQueryData.size.width * 0.75, child: Material( - color: streamChatThemeData.colorTheme.whiteSnow, + color: streamChatThemeData.colorTheme.appBg, clipBehavior: Clip.hardEdge, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(16), @@ -197,7 +197,7 @@ class _MessageActionsModalState extends State { ].insertBetween( Container( height: 1, - color: streamChatThemeData.colorTheme.greyWhisper, + color: streamChatThemeData.colorTheme.borders, ), ), ), @@ -270,7 +270,7 @@ class _MessageActionsModalState extends State { context, title: 'Flag Message', icon: StreamSvgIcon.flag( - color: streamChatThemeData.colorTheme.accentRed, + color: streamChatThemeData.colorTheme.accentError, size: 24, ), question: @@ -287,7 +287,7 @@ class _MessageActionsModalState extends State { await showInfoDialog( context, icon: StreamSvgIcon.flag( - color: theme.colorTheme.accentRed, + color: theme.colorTheme.accentError, size: 24, ), details: 'The message has been reported to a moderator.', @@ -300,7 +300,7 @@ class _MessageActionsModalState extends State { await showInfoDialog( context, icon: StreamSvgIcon.flag( - color: theme.colorTheme.accentRed, + color: theme.colorTheme.accentError, size: 24, ), details: 'The message has been reported to a moderator.', @@ -337,7 +337,7 @@ class _MessageActionsModalState extends State { context, title: 'Delete message', icon: StreamSvgIcon.flag( - color: StreamChatTheme.of(context).colorTheme.accentRed, + color: StreamChatTheme.of(context).colorTheme.accentError, size: 24, ), question: 'Are you sure you want to permanently delete this\nmessage?', @@ -363,7 +363,7 @@ class _MessageActionsModalState extends State { showInfoDialog( context, icon: StreamSvgIcon.error( - color: StreamChatTheme.of(context).colorTheme.accentRed, + color: StreamChatTheme.of(context).colorTheme.accentError, size: 24, ), details: 'The operation couldn\'t be completed.', @@ -540,7 +540,7 @@ class _MessageActionsModalState extends State { child: Row( children: [ StreamSvgIcon.circleUp( - color: streamChatThemeData.colorTheme.accentBlue, + color: streamChatThemeData.colorTheme.accentPrimary, ), const SizedBox(width: 16), Text( @@ -585,7 +585,7 @@ class _MessageActionsModalState extends State { Padding( padding: const EdgeInsets.all(8), child: StreamSvgIcon.edit( - color: streamChatThemeData.colorTheme.greyGainsboro, + color: streamChatThemeData.colorTheme.disabled, ), ), const Text( diff --git a/packages/stream_chat_flutter/lib/src/message_input.dart b/packages/stream_chat_flutter/lib/src/message_input.dart index 39211116..a0ff93cf 100644 --- a/packages/stream_chat_flutter/lib/src/message_input.dart +++ b/packages/stream_chat_flutter/lib/src/message_input.dart @@ -334,7 +334,7 @@ class MessageInputState extends State { Padding( padding: const EdgeInsets.all(8), child: StreamSvgIcon.reply( - color: _streamChatTheme.colorTheme.greyGainsboro, + color: _streamChatTheme.colorTheme.disabled, ), ), const Text( @@ -401,7 +401,8 @@ class MessageInputState extends State { border: _sendAsDm ? null : Border.all( - color: _streamChatTheme.colorTheme.black.withOpacity(.5), + color: _streamChatTheme.colorTheme.textHighEmphasis + .withOpacity(.5), width: 2, ), borderRadius: BorderRadius.circular(3), @@ -410,8 +411,8 @@ class MessageInputState extends State { child: Material( borderRadius: BorderRadius.circular(3), color: _sendAsDm - ? _streamChatTheme.colorTheme.accentBlue - : _streamChatTheme.colorTheme.white, + ? _streamChatTheme.colorTheme.accentPrimary + : _streamChatTheme.colorTheme.barsBg, child: InkWell( onTap: () { setState(() { @@ -426,7 +427,7 @@ class MessageInputState extends State { : CrossFadeState.showSecond, firstChild: StreamSvgIcon.check( size: 16, - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, ), secondChild: const SizedBox( height: 16, @@ -442,7 +443,8 @@ class MessageInputState extends State { child: Text( 'Also send as direct message', style: _streamChatTheme.textTheme.footnote.copyWith( - color: _streamChatTheme.colorTheme.black.withOpacity(0.5), + color: _streamChatTheme.colorTheme.textHighEmphasis + .withOpacity(0.5), ), ), ), @@ -582,7 +584,7 @@ class MessageInputState extends State { isDense: true, hintText: _getHint(), hintStyle: _streamChatTheme.messageInputTheme.inputTextStyle!.copyWith( - color: _streamChatTheme.colorTheme.grey, + color: _streamChatTheme.colorTheme.textLowEmphasis, ), border: const OutlineInputBorder( borderSide: BorderSide( @@ -620,7 +622,7 @@ class MessageInputState extends State { constraints: BoxConstraints.tight(const Size(64, 24)), decoration: BoxDecoration( borderRadius: BorderRadius.circular(12), - color: _streamChatTheme.colorTheme.accentBlue, + color: _streamChatTheme.colorTheme.accentPrimary, ), alignment: Alignment.center, child: Row( @@ -834,12 +836,12 @@ class MessageInputState extends State { shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(8), ), - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, clipBehavior: Clip.hardEdge, child: Container( constraints: BoxConstraints.loose(const Size.fromHeight(400)), decoration: BoxDecoration( - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, borderRadius: BorderRadius.circular(8)), child: ListView( padding: const EdgeInsets.all(0), @@ -855,14 +857,14 @@ class MessageInputState extends State { horizontal: 8, ), child: StreamSvgIcon.lightning( - color: _streamChatTheme.colorTheme.accentBlue, + color: _streamChatTheme.colorTheme.accentPrimary, ), ), Text( 'Instant Commands', style: TextStyle( - color: - _streamChatTheme.colorTheme.black.withOpacity(.5), + color: _streamChatTheme.colorTheme.textHighEmphasis + .withOpacity(.5), ), ) ], @@ -902,7 +904,7 @@ class MessageInputState extends State { color: _streamChatTheme // ignore: lines_longer_than_80_chars .colorTheme - .grey, + .textLowEmphasis, ), ), ], @@ -946,24 +948,29 @@ class MessageInputState extends State { switch (index) { case 0: return _attachments.isEmpty - ? streamChatThemeData.colorTheme.accentBlue + ? streamChatThemeData.colorTheme.accentPrimary : (!_attachmentContainsFile - ? streamChatThemeData.colorTheme.accentBlue - : streamChatThemeData.colorTheme.black.withOpacity(0.2)); + ? streamChatThemeData.colorTheme.accentPrimary + : streamChatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.2)); case 1: return _attachmentContainsFile - ? streamChatThemeData.colorTheme.accentBlue + ? streamChatThemeData.colorTheme.accentPrimary : (_attachments.isEmpty - ? streamChatThemeData.colorTheme.black.withOpacity(0.5) - : streamChatThemeData.colorTheme.black.withOpacity(0.2)); + ? streamChatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.5) + : streamChatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.2)); case 2: return _attachmentContainsFile && _attachments.isNotEmpty - ? streamChatThemeData.colorTheme.black.withOpacity(0.2) - : streamChatThemeData.colorTheme.black.withOpacity(0.5); + ? streamChatThemeData.colorTheme.textHighEmphasis.withOpacity(0.2) + : streamChatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.5); case 3: return _attachmentContainsFile && _attachments.isNotEmpty - ? streamChatThemeData.colorTheme.black.withOpacity(0.2) - : streamChatThemeData.colorTheme.black.withOpacity(0.5); + ? streamChatThemeData.colorTheme.textHighEmphasis.withOpacity(0.2) + : streamChatThemeData.colorTheme.textHighEmphasis + .withOpacity(0.5); default: return Colors.black; } @@ -973,7 +980,7 @@ class MessageInputState extends State { duration: const Duration(milliseconds: 300), height: _openFilePickerSection ? _filePickerSize : 0, child: Material( - color: _streamChatTheme.colorTheme.whiteSmoke, + color: _streamChatTheme.colorTheme.inputBg, child: Column( mainAxisSize: MainAxisSize.min, children: [ @@ -1036,7 +1043,7 @@ class MessageInputState extends State { }, child: DecoratedBox( decoration: BoxDecoration( - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, borderRadius: const BorderRadius.only( topLeft: Radius.circular(16), topRight: Radius.circular(16), @@ -1052,7 +1059,7 @@ class MessageInputState extends State { height: 4, child: DecoratedBox( decoration: BoxDecoration( - color: _streamChatTheme.colorTheme.whiteSmoke, + color: _streamChatTheme.colorTheme.inputBg, borderRadius: BorderRadius.circular(4), ), ), @@ -1066,7 +1073,7 @@ class MessageInputState extends State { Expanded( child: DecoratedBox( decoration: BoxDecoration( - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, borderRadius: BorderRadius.circular(8), ), child: _PickerWidget( @@ -1153,7 +1160,7 @@ class MessageInputState extends State { ); case 'ban': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.iconUserDelete( size: 16, @@ -1162,7 +1169,7 @@ class MessageInputState extends State { ); case 'flag': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.flag( size: 14, @@ -1171,7 +1178,7 @@ class MessageInputState extends State { ); case 'imgur': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: ClipOval( child: StreamSvgIcon.imgur( @@ -1181,7 +1188,7 @@ class MessageInputState extends State { ); case 'mute': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.mute( size: 16, @@ -1190,7 +1197,7 @@ class MessageInputState extends State { ); case 'unban': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.userAdd( size: 16, @@ -1199,7 +1206,7 @@ class MessageInputState extends State { ); case 'unmute': return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.volumeUp( size: 16, @@ -1208,7 +1215,7 @@ class MessageInputState extends State { ); default: return CircleAvatar( - backgroundColor: _streamChatTheme.colorTheme.accentBlue, + backgroundColor: _streamChatTheme.colorTheme.accentPrimary, radius: 12, child: StreamSvgIcon.lightning( size: 16, @@ -1248,7 +1255,7 @@ class MessageInputState extends State { final child = Card( margin: const EdgeInsets.all(8), elevation: 2, - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(8), ), @@ -1256,7 +1263,7 @@ class MessageInputState extends State { child: Container( constraints: BoxConstraints.loose(const Size.fromHeight(240)), decoration: BoxDecoration( - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, ), child: FutureBuilder>( future: queryMembers ?? Future.value(members), @@ -1272,7 +1279,7 @@ class MessageInputState extends State { .where((it) => it.user != null) .map( (m) => Material( - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, child: InkWell( onTap: () { if (m.user != null) { @@ -1359,7 +1366,7 @@ class MessageInputState extends State { child: Card( margin: const EdgeInsets.all(8), elevation: 2, - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(8), ), @@ -1374,7 +1381,7 @@ class MessageInputState extends State { offset: Offset(0, -4), ), ], - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, ), child: ListView.builder( padding: const EdgeInsets.all(0), @@ -1390,15 +1397,16 @@ class MessageInputState extends State { padding: const EdgeInsets.symmetric(horizontal: 8), child: StreamSvgIcon.smile( - color: - _streamChatTheme.colorTheme.accentBlue, + color: _streamChatTheme + .colorTheme.accentPrimary, ), ), Flexible( child: Text( 'Emoji matching "$query"', style: TextStyle( - color: _streamChatTheme.colorTheme.black + color: _streamChatTheme + .colorTheme.textHighEmphasis .withOpacity(.5), ), ), @@ -1570,11 +1578,12 @@ class MessageInputState extends State { onPressed: () { setState(() => _attachments.remove(attachment.id)); }, - fillColor: _streamChatTheme.colorTheme.black.withOpacity(.5), + fillColor: + _streamChatTheme.colorTheme.textHighEmphasis.withOpacity(.5), child: Center( child: StreamSvgIcon.close( size: 24, - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, ), ), ), @@ -1609,8 +1618,8 @@ class MessageInputState extends State { errorWidget: (_, obj, trace) => getFileTypeImage(attachment.extraData['other'] as String?), placeholder: (context, _) => Shimmer.fromColors( - baseColor: _streamChatTheme.colorTheme.greyGainsboro, - highlightColor: _streamChatTheme.colorTheme.whiteSmoke, + baseColor: _streamChatTheme.colorTheme.disabled, + highlightColor: _streamChatTheme.colorTheme.inputBg, child: Image.asset( 'images/placeholder.png', fit: BoxFit.cover, @@ -1651,7 +1660,7 @@ class MessageInputState extends State { return IconButton( icon: StreamSvgIcon.lightning( color: s.isNotEmpty - ? _streamChatTheme.colorTheme.greyGainsboro + ? _streamChatTheme.colorTheme.disabled : (_commandsOverlay != null ? _streamChatTheme.messageInputTheme.actionButtonColor : _streamChatTheme.messageInputTheme.actionButtonIdleColor), @@ -2058,7 +2067,7 @@ class MessageInputState extends State { void _showErrorAlert(String description) { showModalBottomSheet( - backgroundColor: _streamChatTheme.colorTheme.white, + backgroundColor: _streamChatTheme.colorTheme.barsBg, context: context, shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( @@ -2072,7 +2081,7 @@ class MessageInputState extends State { height: 26, ), StreamSvgIcon.error( - color: _streamChatTheme.colorTheme.accentRed, + color: _streamChatTheme.colorTheme.accentError, size: 24, ), const SizedBox( @@ -2096,7 +2105,8 @@ class MessageInputState extends State { height: 36, ), Container( - color: _streamChatTheme.colorTheme.black.withOpacity(.08), + color: + _streamChatTheme.colorTheme.textHighEmphasis.withOpacity(.08), height: 1, ), Row( @@ -2108,8 +2118,8 @@ class MessageInputState extends State { }, child: Text( 'OK', - style: _streamChatTheme.textTheme.bodyBold - .copyWith(color: _streamChatTheme.colorTheme.accentBlue), + style: _streamChatTheme.textTheme.bodyBold.copyWith( + color: _streamChatTheme.colorTheme.accentPrimary), ), ), ], @@ -2250,12 +2260,12 @@ class __PickerWidgetState extends State<_PickerWidget> { }, child: Container( constraints: const BoxConstraints.expand(), - color: widget.streamChatTheme.colorTheme.whiteSmoke, + color: widget.streamChatTheme.colorTheme.inputBg, alignment: Alignment.center, child: Text( 'Add more files', style: TextStyle( - color: widget.streamChatTheme.colorTheme.accentBlue, + color: widget.streamChatTheme.colorTheme.accentPrimary, fontWeight: FontWeight.bold, ), ), @@ -2273,7 +2283,7 @@ class __PickerWidgetState extends State<_PickerWidget> { PhotoManager.openSetting(); }, child: Container( - color: widget.streamChatTheme.colorTheme.whiteSmoke, + color: widget.streamChatTheme.colorTheme.inputBg, child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.stretch, @@ -2282,13 +2292,14 @@ class __PickerWidgetState extends State<_PickerWidget> { 'svgs/icon_picture_empty_state.svg', package: 'stream_chat_flutter', height: 140, - color: widget.streamChatTheme.colorTheme.greyGainsboro, + color: widget.streamChatTheme.colorTheme.disabled, ), Text( // ignore: lines_longer_than_80_chars 'Please enable access to your photos \nand videos so you can share them with friends.', style: widget.streamChatTheme.textTheme.body.copyWith( - color: widget.streamChatTheme.colorTheme.grey), + color: + widget.streamChatTheme.colorTheme.textLowEmphasis), textAlign: TextAlign.center, ), const SizedBox(height: 6), @@ -2296,7 +2307,7 @@ class __PickerWidgetState extends State<_PickerWidget> { child: Text( 'Allow access to your gallery', style: widget.streamChatTheme.textTheme.bodyBold.copyWith( - color: widget.streamChatTheme.colorTheme.accentBlue, + color: widget.streamChatTheme.colorTheme.accentPrimary, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/message_list_view.dart b/packages/stream_chat_flutter/lib/src/message_list_view.dart index e6bf7a17..6e61612b 100644 --- a/packages/stream_chat_flutter/lib/src/message_list_view.dart +++ b/packages/stream_chat_flutter/lib/src/message_list_view.dart @@ -368,7 +368,8 @@ class _MessageListViewState extends State { child: Text( 'No chats here yet...', style: _streamTheme.textTheme.footnote.copyWith( - color: _streamTheme.colorTheme.black.withOpacity(.5)), + color: _streamTheme.colorTheme.textHighEmphasis + .withOpacity(.5)), ), ), messageListBuilder: widget.messageListBuilder ?? @@ -380,7 +381,8 @@ class _MessageListViewState extends State { child: Text( 'Something went wrong', style: _streamTheme.textTheme.footnote.copyWith( - color: _streamTheme.colorTheme.black.withOpacity(.5)), + color: _streamTheme.colorTheme.textHighEmphasis + .withOpacity(.5)), ), ), ); @@ -710,7 +712,7 @@ class _MessageListViewState extends State { clipBehavior: Clip.none, children: [ FloatingActionButton( - backgroundColor: _streamTheme.colorTheme.white, + backgroundColor: _streamTheme.colorTheme.barsBg, onPressed: () { if (unreadCount > 0) { streamChannel!.channel.markRead(); @@ -729,7 +731,7 @@ class _MessageListViewState extends State { } }, child: StreamSvgIcon.down( - color: _streamTheme.colorTheme.black, + color: _streamTheme.colorTheme.textHighEmphasis, ), ), if (showUnreadCount) @@ -1106,7 +1108,7 @@ class _MessageListViewState extends State { widget.onMessageSwiped?.call(message); }, backgroundIcon: StreamSvgIcon.reply( - color: _streamTheme.colorTheme.accentBlue, + color: _streamTheme.colorTheme.accentPrimary, ), child: child, ), @@ -1122,7 +1124,7 @@ class _MessageListViewState extends State { child = TweenAnimationBuilder( tween: ColorTween( begin: highlightColor, - end: colorTheme.white.withOpacity(0), + end: colorTheme.barsBg.withOpacity(0), ), duration: const Duration(seconds: 3), onEnd: () => initialMessageHighlightComplete = true, @@ -1252,7 +1254,7 @@ class _LoadingIndicator extends StatelessWidget { stream: stream, initialData: false, errorBuilder: (context, error) => Container( - color: streamTheme.colorTheme.accentRed.withOpacity(.2), + color: streamTheme.colorTheme.accentError.withOpacity(.2), child: const Center( child: Text('Error loading messages'), ), diff --git a/packages/stream_chat_flutter/lib/src/message_reactions_modal.dart b/packages/stream_chat_flutter/lib/src/message_reactions_modal.dart index 0292a05a..3d9a907e 100644 --- a/packages/stream_chat_flutter/lib/src/message_reactions_modal.dart +++ b/packages/stream_chat_flutter/lib/src/message_reactions_modal.dart @@ -142,7 +142,7 @@ class MessageReactionsModal extends StatelessWidget { Widget _buildReactionCard(BuildContext context, User? user) { final chatThemeData = StreamChatTheme.of(context); return Card( - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, clipBehavior: Clip.hardEdge, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(16), @@ -224,7 +224,7 @@ class MessageReactionsModal extends StatelessWidget { messageTheme.reactionsBorderColor ?? Colors.transparent, backgroundColor: messageTheme.reactionsBackgroundColor ?? Colors.transparent, - maskColor: chatThemeData.colorTheme.white, + maskColor: chatThemeData.colorTheme.barsBg, tailCirclesSpacing: 1, highlightOwnReactions: false, ), diff --git a/packages/stream_chat_flutter/lib/src/message_search_list_view.dart b/packages/stream_chat_flutter/lib/src/message_search_list_view.dart index 1a67702f..f364d0f2 100644 --- a/packages/stream_chat_flutter/lib/src/message_search_list_view.dart +++ b/packages/stream_chat_flutter/lib/src/message_search_list_view.dart @@ -199,7 +199,7 @@ class _MessageSearchListViewState extends State { Widget _separatorBuilder(BuildContext context, int index) => Container( height: 1, - color: StreamChatTheme.of(context).colorTheme.greyWhisper, + color: StreamChatTheme.of(context).colorTheme.borders, ); Widget _listItemBuilder( @@ -224,7 +224,7 @@ class _MessageSearchListViewState extends State { return Container( color: StreamChatTheme.of(context) .colorTheme - .accentRed + .accentError .withOpacity(.2), child: const Padding( padding: EdgeInsets.symmetric(vertical: 16), @@ -294,7 +294,7 @@ class _MessageSearchListViewState extends State { child: Text( '${items.length} results', style: TextStyle( - color: chatThemeData.colorTheme.grey, + color: chatThemeData.colorTheme.textLowEmphasis, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/message_widget.dart b/packages/stream_chat_flutter/lib/src/message_widget.dart index 7c95bf0a..c9dfd9d4 100644 --- a/packages/stream_chat_flutter/lib/src/message_widget.dart +++ b/packages/stream_chat_flutter/lib/src/message_widget.dart @@ -222,7 +222,7 @@ class MessageWidget extends StatefulWidget { final border = RoundedRectangleBorder( side: attachmentBorderSide ?? BorderSide( - color: StreamChatTheme.of(context).colorTheme.greyWhisper, + color: StreamChatTheme.of(context).colorTheme.borders, ), borderRadius: attachmentBorderRadiusGeometry ?? BorderRadius.zero, ); @@ -749,7 +749,7 @@ class _MessageWidgetState extends State child: CustomPaint( painter: ReactionBubblePainter( _streamChatTheme - .colorTheme.white, + .colorTheme.barsBg, Colors.transparent, Colors.transparent, tailCirclesSpace: 1, @@ -835,14 +835,14 @@ class _MessageWidgetState extends State mainAxisSize: MainAxisSize.min, children: [ StreamSvgIcon.eye( - color: chatThemeData.colorTheme.grey, + color: chatThemeData.colorTheme.textLowEmphasis, size: 16, ), const SizedBox(width: 8), Text( 'Only visible to you', style: chatThemeData.textTheme.footnote - .copyWith(color: chatThemeData.colorTheme.grey), + .copyWith(color: chatThemeData.colorTheme.textLowEmphasis), ), ], ); @@ -1218,7 +1218,7 @@ class _MessageWidgetState extends State Text( widget.readList!.length.toString(), style: style.copyWith( - color: _streamChatTheme.colorTheme.accentBlue, + color: _streamChatTheme.colorTheme.accentPrimary, ), ), const SizedBox(width: 2), @@ -1292,7 +1292,7 @@ class _MessageWidgetState extends State Text( 'Pinned by ${pinnedByMe ? 'You' : pinnedBy.name}', style: TextStyle( - color: _streamChatTheme.colorTheme.grey, + color: _streamChatTheme.colorTheme.textLowEmphasis, fontSize: 13, fontWeight: FontWeight.w400, ), @@ -1310,7 +1310,7 @@ class _MessageWidgetState extends State } if (hasUrlAttachments) { - return _streamChatTheme.colorTheme.blueAlice; + return _streamChatTheme.colorTheme.linkBg; } if (isOnlyEmoji) { @@ -1366,7 +1366,7 @@ class _ThreadParticipants extends StatelessWidget { child: Container( decoration: BoxDecoration( shape: BoxShape.circle, - color: _streamChatTheme.colorTheme.white, + color: _streamChatTheme.colorTheme.barsBg, ), padding: const EdgeInsets.all(1), child: UserAvatar( @@ -1395,7 +1395,7 @@ class _ThreadReplyPainter extends CustomPainter { @override void paint(Canvas canvas, Size size) { final paint = Paint() - ..color = color ?? StreamChatTheme.of(context!).colorTheme.greyGainsboro + ..color = color ?? StreamChatTheme.of(context!).colorTheme.disabled ..style = PaintingStyle.stroke ..strokeWidth = 1 ..strokeCap = StrokeCap.round; diff --git a/packages/stream_chat_flutter/lib/src/option_list_tile.dart b/packages/stream_chat_flutter/lib/src/option_list_tile.dart index 10ae1b5f..16bf9e97 100644 --- a/packages/stream_chat_flutter/lib/src/option_list_tile.dart +++ b/packages/stream_chat_flutter/lib/src/option_list_tile.dart @@ -46,11 +46,11 @@ class OptionListTile extends StatelessWidget { return Column( children: [ Container( - color: separatorColor ?? chatThemeData.colorTheme.greyGainsboro, + color: separatorColor ?? chatThemeData.colorTheme.disabled, height: 1, ), Material( - color: tileColor ?? chatThemeData.colorTheme.white, + color: tileColor ?? chatThemeData.colorTheme.barsBg, child: SizedBox( height: 63, child: InkWell( diff --git a/packages/stream_chat_flutter/lib/src/quoted_message_widget.dart b/packages/stream_chat_flutter/lib/src/quoted_message_widget.dart index 43620640..22ca4d4c 100644 --- a/packages/stream_chat_flutter/lib/src/quoted_message_widget.dart +++ b/packages/stream_chat_flutter/lib/src/quoted_message_widget.dart @@ -154,7 +154,7 @@ class QuotedMessageWidget extends StatelessWidget { color: _getBackgroundColor(context), border: showBorder ? Border.all( - color: StreamChatTheme.of(context).colorTheme.greyGainsboro, + color: StreamChatTheme.of(context).colorTheme.disabled, ) : null, borderRadius: BorderRadius.only( @@ -280,7 +280,7 @@ class QuotedMessageWidget extends StatelessWidget { Color? _getBackgroundColor(BuildContext context) { if (_containsScrapeUrl) { - return StreamChatTheme.of(context).colorTheme.blueAlice; + return StreamChatTheme.of(context).colorTheme.linkBg; } return messageTheme.messageBackgroundColor; } diff --git a/packages/stream_chat_flutter/lib/src/reaction_bubble.dart b/packages/stream_chat_flutter/lib/src/reaction_bubble.dart index a3b2052f..9e279344 100644 --- a/packages/stream_chat_flutter/lib/src/reaction_bubble.dart +++ b/packages/stream_chat_flutter/lib/src/reaction_bubble.dart @@ -141,8 +141,8 @@ class ReactionBubble extends StatelessWidget { Icons.help_outline_rounded, size: 16, color: (!highlightOwnReactions || reaction.user?.id == userId) - ? chatThemeData.colorTheme.accentBlue - : chatThemeData.colorTheme.black.withOpacity(.5), + ? chatThemeData.colorTheme.accentPrimary + : chatThemeData.colorTheme.textHighEmphasis.withOpacity(.5), ), ); } diff --git a/packages/stream_chat_flutter/lib/src/reaction_picker.dart b/packages/stream_chat_flutter/lib/src/reaction_picker.dart index 5101cbb7..3e1e5e50 100644 --- a/packages/stream_chat_flutter/lib/src/reaction_picker.dart +++ b/packages/stream_chat_flutter/lib/src/reaction_picker.dart @@ -49,7 +49,7 @@ class _ReactionPickerState extends State final child = Material( borderRadius: BorderRadius.circular(24), - color: chatThemeData.colorTheme.white, + color: chatThemeData.colorTheme.barsBg, clipBehavior: Clip.hardEdge, child: Padding( padding: const EdgeInsets.symmetric( diff --git a/packages/stream_chat_flutter/lib/src/sending_indicator.dart b/packages/stream_chat_flutter/lib/src/sending_indicator.dart index 88560432..7f44e5b8 100644 --- a/packages/stream_chat_flutter/lib/src/sending_indicator.dart +++ b/packages/stream_chat_flutter/lib/src/sending_indicator.dart @@ -25,7 +25,7 @@ class SendingIndicator extends StatelessWidget { if (isMessageRead) { return StreamSvgIcon.checkAll( size: size, - color: StreamChatTheme.of(context).colorTheme.accentBlue, + color: StreamChatTheme.of(context).colorTheme.accentPrimary, ); } if (message.status == MessageSendingStatus.sent) { diff --git a/packages/stream_chat_flutter/lib/src/stream_chat.dart b/packages/stream_chat_flutter/lib/src/stream_chat.dart index 64acae98..c050d8cb 100644 --- a/packages/stream_chat_flutter/lib/src/stream_chat.dart +++ b/packages/stream_chat_flutter/lib/src/stream_chat.dart @@ -101,8 +101,8 @@ class StreamChatState extends State { return Theme( data: materialTheme.copyWith( primaryIconTheme: streamTheme.primaryIconTheme, - accentColor: streamTheme.colorTheme.accentBlue, - scaffoldBackgroundColor: streamTheme.colorTheme.white, + accentColor: streamTheme.colorTheme.accentPrimary, + scaffoldBackgroundColor: streamTheme.colorTheme.barsBg, ), child: StreamChatCore( client: client, diff --git a/packages/stream_chat_flutter/lib/src/stream_chat_theme.dart b/packages/stream_chat_flutter/lib/src/stream_chat_theme.dart index 91ed2537..72b04a80 100644 --- a/packages/stream_chat_flutter/lib/src/stream_chat_theme.dart +++ b/packages/stream_chat_flutter/lib/src/stream_chat_theme.dart @@ -114,7 +114,7 @@ class StreamChatThemeData { final defaultTheme = StreamChatThemeData(brightness: theme.brightness); final customizedTheme = StreamChatThemeData.fromColorAndTextTheme( defaultTheme.colorTheme.copyWith( - accentBlue: theme.accentColor, + accentPrimary: theme.accentColor, ), defaultTheme.textTheme, ); @@ -216,8 +216,9 @@ class StreamChatThemeData { ColorTheme colorTheme, TextTheme textTheme, ) { - final accentColor = colorTheme.accentBlue; - final iconTheme = IconThemeData(color: colorTheme.black.withOpacity(.5)); + final accentColor = colorTheme.accentPrimary; + final iconTheme = + IconThemeData(color: colorTheme.textHighEmphasis.withOpacity(.5)); return StreamChatThemeData.raw( textTheme: textTheme, colorTheme: colorTheme, @@ -231,7 +232,7 @@ class StreamChatThemeData { ), ), channelPreviewTheme: ChannelPreviewTheme( - unreadCounterColor: colorTheme.accentRed, + unreadCounterColor: colorTheme.accentError, avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), constraints: const BoxConstraints.tightFor( @@ -244,7 +245,7 @@ class StreamChatThemeData { color: const Color(0xff7A7A7A), ), lastMessageAt: textTheme.footnote.copyWith( - color: colorTheme.black.withOpacity(.5), + color: colorTheme.textHighEmphasis.withOpacity(.5), ), indicatorIconSize: 16, ), @@ -256,7 +257,7 @@ class StreamChatThemeData { width: 40, ), ), - color: colorTheme.white, + color: colorTheme.barsBg, title: textTheme.headlineBold, ), channelTheme: ChannelTheme( @@ -268,7 +269,7 @@ class StreamChatThemeData { width: 40, ), ), - color: colorTheme.white, + color: colorTheme.barsBg, title: textTheme.headlineBold, subtitle: textTheme.footnote.copyWith( color: const Color(0xff7A7A7A), @@ -276,15 +277,17 @@ class StreamChatThemeData { ), ), ownMessageTheme: MessageTheme( - messageAuthor: textTheme.footnote.copyWith(color: colorTheme.grey), + messageAuthor: + textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis), messageText: textTheme.body, - createdAt: textTheme.footnote.copyWith(color: colorTheme.grey), + createdAt: + textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis), replies: textTheme.footnoteBold.copyWith(color: accentColor), - messageBackgroundColor: colorTheme.greyGainsboro, - reactionsBackgroundColor: colorTheme.white, - reactionsBorderColor: colorTheme.greyWhisper, - reactionsMaskColor: colorTheme.whiteSnow, - messageBorderColor: colorTheme.greyGainsboro, + messageBackgroundColor: colorTheme.disabled, + reactionsBackgroundColor: colorTheme.barsBg, + reactionsBorderColor: colorTheme.borders, + reactionsMaskColor: colorTheme.appBg, + messageBorderColor: colorTheme.disabled, avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), constraints: const BoxConstraints.tightFor( @@ -297,18 +300,20 @@ class StreamChatThemeData { ), ), otherMessageTheme: MessageTheme( - reactionsBackgroundColor: colorTheme.greyGainsboro, - reactionsBorderColor: colorTheme.white, - reactionsMaskColor: colorTheme.whiteSnow, + reactionsBackgroundColor: colorTheme.disabled, + reactionsBorderColor: colorTheme.barsBg, + reactionsMaskColor: colorTheme.appBg, messageText: textTheme.body, - createdAt: textTheme.footnote.copyWith(color: colorTheme.grey), - messageAuthor: textTheme.footnote.copyWith(color: colorTheme.grey), + createdAt: + textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis), + messageAuthor: + textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis), replies: textTheme.footnoteBold.copyWith(color: accentColor), messageLinks: TextStyle( color: accentColor, ), - messageBackgroundColor: colorTheme.white, - messageBorderColor: colorTheme.greyWhisper, + messageBackgroundColor: colorTheme.barsBg, + messageBorderColor: colorTheme.borders, avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), constraints: const BoxConstraints.tightFor( @@ -320,23 +325,23 @@ class StreamChatThemeData { messageInputTheme: MessageInputTheme( borderRadius: BorderRadius.circular(20), sendAnimationDuration: const Duration(milliseconds: 300), - actionButtonColor: colorTheme.accentBlue, - actionButtonIdleColor: colorTheme.grey, - expandButtonColor: colorTheme.accentBlue, - sendButtonColor: colorTheme.accentBlue, - sendButtonIdleColor: colorTheme.greyGainsboro, - inputBackground: colorTheme.white, + actionButtonColor: colorTheme.accentPrimary, + actionButtonIdleColor: colorTheme.textLowEmphasis, + expandButtonColor: colorTheme.accentPrimary, + sendButtonColor: colorTheme.accentPrimary, + sendButtonIdleColor: colorTheme.disabled, + inputBackground: colorTheme.barsBg, inputTextStyle: textTheme.body, idleBorderGradient: LinearGradient( colors: [ - colorTheme.greyGainsboro, - colorTheme.greyGainsboro, + colorTheme.disabled, + colorTheme.disabled, ], ), activeBorderGradient: LinearGradient( colors: [ - colorTheme.greyGainsboro, - colorTheme.greyGainsboro, + colorTheme.disabled, + colorTheme.disabled, ], ), ), @@ -347,7 +352,7 @@ class StreamChatThemeData { final theme = StreamChatTheme.of(context); return StreamSvgIcon.loveReaction( color: highlighted - ? theme.colorTheme.accentBlue + ? theme.colorTheme.accentPrimary : theme.primaryIconTheme.color!.withOpacity(.5), size: size, ); @@ -359,7 +364,7 @@ class StreamChatThemeData { final theme = StreamChatTheme.of(context); return StreamSvgIcon.thumbsUpReaction( color: highlighted - ? theme.colorTheme.accentBlue + ? theme.colorTheme.accentPrimary : theme.primaryIconTheme.color!.withOpacity(.5), size: size, ); @@ -371,7 +376,7 @@ class StreamChatThemeData { final theme = StreamChatTheme.of(context); return StreamSvgIcon.thumbsDownReaction( color: highlighted - ? theme.colorTheme.accentBlue + ? theme.colorTheme.accentPrimary : theme.primaryIconTheme.color!.withOpacity(.5), size: size, ); @@ -383,7 +388,7 @@ class StreamChatThemeData { final theme = StreamChatTheme.of(context); return StreamSvgIcon.lolReaction( color: highlighted - ? theme.colorTheme.accentBlue + ? theme.colorTheme.accentPrimary : theme.primaryIconTheme.color!.withOpacity(.5), size: size, ); @@ -395,7 +400,7 @@ class StreamChatThemeData { final theme = StreamChatTheme.of(context); return StreamSvgIcon.wutReaction( color: highlighted - ? theme.colorTheme.accentBlue + ? theme.colorTheme.accentPrimary : theme.primaryIconTheme.color!.withOpacity(.5), size: size, ); @@ -572,17 +577,17 @@ class TextTheme { class ColorTheme { /// Initialise with light theme ColorTheme.light({ - this.black = const Color(0xff000000), - this.grey = const Color(0xff7a7a7a), - this.greyGainsboro = const Color(0xffdbdbdb), - this.greyWhisper = const Color(0xffecebeb), - this.whiteSmoke = const Color(0xfff2f2f2), - this.whiteSnow = const Color(0xfffcfcfc), - this.white = const Color(0xffffffff), - this.blueAlice = const Color(0xffe9f2ff), - this.accentBlue = const Color(0xff005FFF), - this.accentRed = const Color(0xffFF3842), - this.accentGreen = const Color(0xff20E070), + this.textHighEmphasis = const Color(0xff000000), + this.textLowEmphasis = const Color(0xff7a7a7a), + this.disabled = const Color(0xffdbdbdb), + this.borders = const Color(0xffecebeb), + this.inputBg = const Color(0xfff2f2f2), + this.appBg = const Color(0xfffcfcfc), + this.barsBg = const Color(0xffffffff), + this.linkBg = const Color(0xffe9f2ff), + this.accentPrimary = const Color(0xff005FFF), + this.accentError = const Color(0xffFF3842), + this.accentInfo = const Color(0xff20E070), this.highlight = const Color(0xfffbf4dd), this.overlay = const Color.fromRGBO(0, 0, 0, 0.2), this.overlayDark = const Color.fromRGBO(0, 0, 0, 0.6), @@ -604,17 +609,17 @@ class ColorTheme { /// Initialise with dark theme ColorTheme.dark({ - this.black = const Color(0xffffffff), - this.grey = const Color(0xff7a7a7a), - this.greyGainsboro = const Color(0xff2d2f2f), - this.greyWhisper = const Color(0xff1c1e22), - this.whiteSmoke = const Color(0xff13151b), - this.whiteSnow = const Color(0xff070A0D), - this.white = const Color(0xff101418), - this.blueAlice = const Color(0xff00193D), - this.accentBlue = const Color(0xff005FFF), - this.accentRed = const Color(0xffFF3742), - this.accentGreen = const Color(0xff20E070), + this.textHighEmphasis = const Color(0xffffffff), + this.textLowEmphasis = const Color(0xff7a7a7a), + this.disabled = const Color(0xff2d2f2f), + this.borders = const Color(0xff1c1e22), + this.inputBg = const Color(0xff13151b), + this.appBg = const Color(0xff070A0D), + this.barsBg = const Color(0xff101418), + this.linkBg = const Color(0xff00193D), + this.accentPrimary = const Color(0xff005FFF), + this.accentError = const Color(0xffFF3742), + this.accentInfo = const Color(0xff20E070), this.borderTop = const Effect( sigmaX: 0, sigmaY: -1, @@ -657,37 +662,37 @@ class ColorTheme { }) : brightness = Brightness.dark; /// - final Color black; + final Color textHighEmphasis; /// - final Color grey; + final Color textLowEmphasis; /// - final Color greyGainsboro; + final Color disabled; /// - final Color greyWhisper; + final Color borders; /// - final Color whiteSmoke; + final Color inputBg; /// - final Color whiteSnow; + final Color appBg; /// - final Color white; + final Color barsBg; /// - final Color blueAlice; + final Color linkBg; /// - final Color accentBlue; + final Color accentPrimary; /// - final Color accentRed; + final Color accentError; /// - final Color accentGreen; + final Color accentInfo; /// final Effect borderTop; @@ -719,17 +724,17 @@ class ColorTheme { /// Copy with theme ColorTheme copyWith({ Brightness brightness = Brightness.light, - Color? black, - Color? grey, - Color? greyGainsboro, - Color? greyWhisper, - Color? whiteSmoke, - Color? whiteSnow, - Color? white, - Color? blueAlice, - Color? accentBlue, - Color? accentRed, - Color? accentGreen, + Color? textHighEmphasis, + Color? textLowEmphasis, + Color? disabled, + Color? borders, + Color? inputBg, + Color? appBg, + Color? barsBg, + Color? linkBg, + Color? accentPrimary, + Color? accentError, + Color? accentInfo, Effect? borderTop, Effect? borderBottom, Effect? shadowIconButton, @@ -741,17 +746,17 @@ class ColorTheme { }) => brightness == Brightness.light ? ColorTheme.light( - black: black ?? this.black, - grey: grey ?? this.grey, - greyGainsboro: greyGainsboro ?? this.greyGainsboro, - greyWhisper: greyWhisper ?? this.greyWhisper, - whiteSmoke: whiteSmoke ?? this.whiteSmoke, - whiteSnow: whiteSnow ?? this.whiteSnow, - white: white ?? this.white, - blueAlice: blueAlice ?? this.blueAlice, - accentBlue: accentBlue ?? this.accentBlue, - accentRed: accentRed ?? this.accentRed, - accentGreen: accentGreen ?? this.accentGreen, + textHighEmphasis: textHighEmphasis ?? this.textHighEmphasis, + textLowEmphasis: textLowEmphasis ?? this.textLowEmphasis, + disabled: disabled ?? this.disabled, + borders: borders ?? this.borders, + inputBg: inputBg ?? this.inputBg, + appBg: appBg ?? this.appBg, + barsBg: barsBg ?? this.barsBg, + linkBg: linkBg ?? this.linkBg, + accentPrimary: accentPrimary ?? this.accentPrimary, + accentError: accentError ?? this.accentError, + accentInfo: accentInfo ?? this.accentInfo, borderTop: borderTop ?? this.borderTop, borderBottom: borderBottom ?? this.borderBottom, shadowIconButton: shadowIconButton ?? this.shadowIconButton, @@ -762,17 +767,17 @@ class ColorTheme { bgGradient: bgGradient ?? this.bgGradient, ) : ColorTheme.dark( - black: black ?? this.black, - grey: grey ?? this.grey, - greyGainsboro: greyGainsboro ?? this.greyGainsboro, - greyWhisper: greyWhisper ?? this.greyWhisper, - whiteSmoke: whiteSmoke ?? this.whiteSmoke, - whiteSnow: whiteSnow ?? this.whiteSnow, - white: white ?? this.white, - blueAlice: blueAlice ?? this.blueAlice, - accentBlue: accentBlue ?? this.accentBlue, - accentRed: accentRed ?? this.accentRed, - accentGreen: accentGreen ?? this.accentGreen, + textHighEmphasis: textHighEmphasis ?? this.textHighEmphasis, + textLowEmphasis: textLowEmphasis ?? this.textLowEmphasis, + disabled: disabled ?? this.disabled, + borders: borders ?? this.borders, + inputBg: inputBg ?? this.inputBg, + appBg: appBg ?? this.appBg, + barsBg: barsBg ?? this.barsBg, + linkBg: linkBg ?? this.linkBg, + accentPrimary: accentPrimary ?? this.accentPrimary, + accentError: accentError ?? this.accentError, + accentInfo: accentInfo ?? this.accentInfo, borderTop: borderTop ?? this.borderTop, borderBottom: borderBottom ?? this.borderBottom, shadowIconButton: shadowIconButton ?? this.shadowIconButton, @@ -787,17 +792,17 @@ class ColorTheme { ColorTheme merge(ColorTheme? other) { if (other == null) return this; return copyWith( - black: other.black, - grey: other.grey, - greyGainsboro: other.greyGainsboro, - greyWhisper: other.greyWhisper, - whiteSmoke: other.whiteSmoke, - whiteSnow: other.whiteSnow, - white: other.white, - blueAlice: other.blueAlice, - accentBlue: other.accentBlue, - accentRed: other.accentRed, - accentGreen: other.accentGreen, + textHighEmphasis: other.textHighEmphasis, + textLowEmphasis: other.textLowEmphasis, + disabled: other.disabled, + borders: other.borders, + inputBg: other.inputBg, + appBg: other.appBg, + barsBg: other.barsBg, + linkBg: other.linkBg, + accentPrimary: other.accentPrimary, + accentError: other.accentError, + accentInfo: other.accentInfo, highlight: other.highlight, overlay: other.overlay, overlayDark: other.overlayDark, diff --git a/packages/stream_chat_flutter/lib/src/swipeable.dart b/packages/stream_chat_flutter/lib/src/swipeable.dart index 5895e8b5..041111e4 100644 --- a/packages/stream_chat_flutter/lib/src/swipeable.dart +++ b/packages/stream_chat_flutter/lib/src/swipeable.dart @@ -151,9 +151,8 @@ class _SwipeableState extends State with TickerProviderStateMixin { decoration: BoxDecoration( shape: BoxShape.circle, border: Border.all( - color: StreamChatTheme.of(context) - .colorTheme - .greyGainsboro, + color: + StreamChatTheme.of(context).colorTheme.disabled, ), ), child: widget.backgroundIcon, diff --git a/packages/stream_chat_flutter/lib/src/system_message.dart b/packages/stream_chat_flutter/lib/src/system_message.dart index b847eb3c..11c80300 100644 --- a/packages/stream_chat_flutter/lib/src/system_message.dart +++ b/packages/stream_chat_flutter/lib/src/system_message.dart @@ -32,7 +32,7 @@ class SystemMessage extends StatelessWidget { textAlign: TextAlign.center, softWrap: true, style: theme.textTheme.captionBold.copyWith( - color: theme.colorTheme.grey, + color: theme.colorTheme.textLowEmphasis, ), ), ); diff --git a/packages/stream_chat_flutter/lib/src/upload_progress_indicator.dart b/packages/stream_chat_flutter/lib/src/upload_progress_indicator.dart index 9905141a..b3fe510d 100644 --- a/packages/stream_chat_flutter/lib/src/upload_progress_indicator.dart +++ b/packages/stream_chat_flutter/lib/src/upload_progress_indicator.dart @@ -59,7 +59,7 @@ class UploadProgressIndicator extends StatelessWidget { '${_percentage.toInt()}%', style: textStyle ?? theme.textTheme.footnote.copyWith( - color: theme.colorTheme.white, + color: theme.colorTheme.barsBg, ), ), ], diff --git a/packages/stream_chat_flutter/lib/src/url_attachment.dart b/packages/stream_chat_flutter/lib/src/url_attachment.dart index 4944c73c..5d5ca489 100644 --- a/packages/stream_chat_flutter/lib/src/url_attachment.dart +++ b/packages/stream_chat_flutter/lib/src/url_attachment.dart @@ -60,7 +60,7 @@ class UrlAttachment extends StatelessWidget { borderRadius: const BorderRadius.only( topRight: Radius.circular(16), ), - color: chatThemeData.colorTheme.blueAlice, + color: chatThemeData.colorTheme.linkBg, ), child: Padding( padding: const EdgeInsets.only( @@ -71,7 +71,7 @@ class UrlAttachment extends StatelessWidget { child: Text( hostDisplayName, style: chatThemeData.textTheme.bodyBold.copyWith( - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/user_avatar.dart b/packages/stream_chat_flutter/lib/src/user_avatar.dart index ecf1783f..31e07f0a 100644 --- a/packages/stream_chat_flutter/lib/src/user_avatar.dart +++ b/packages/stream_chat_flutter/lib/src/user_avatar.dart @@ -70,7 +70,7 @@ class UserAvatar extends StatelessWidget { constraints: constraints ?? streamChatTheme.ownMessageTheme.avatarTheme?.constraints, decoration: BoxDecoration( - color: streamChatTheme.colorTheme.accentBlue, + color: streamChatTheme.colorTheme.accentPrimary, ), child: hasImage ? CachedNetworkImage( @@ -95,7 +95,7 @@ class UserAvatar extends StatelessWidget { child: Container( constraints: constraints ?? streamChatTheme.ownMessageTheme.avatarTheme?.constraints, - color: selectionColor ?? streamChatTheme.colorTheme.accentBlue, + color: selectionColor ?? streamChatTheme.colorTheme.accentPrimary, child: Padding( padding: EdgeInsets.all(selectionThickness), child: avatar, @@ -115,7 +115,7 @@ class UserAvatar extends StatelessWidget { alignment: onlineIndicatorAlignment, child: Material( type: MaterialType.circle, - color: streamChatTheme.colorTheme.white, + color: streamChatTheme.colorTheme.barsBg, child: Container( margin: const EdgeInsets.all(2), constraints: onlineIndicatorConstraints ?? @@ -125,7 +125,7 @@ class UserAvatar extends StatelessWidget { ), child: Material( shape: const CircleBorder(), - color: streamChatTheme.colorTheme.accentGreen, + color: streamChatTheme.colorTheme.accentInfo, ), ), ), diff --git a/packages/stream_chat_flutter/lib/src/user_item.dart b/packages/stream_chat_flutter/lib/src/user_item.dart index e9d9f7c0..a13b544e 100644 --- a/packages/stream_chat_flutter/lib/src/user_item.dart +++ b/packages/stream_chat_flutter/lib/src/user_item.dart @@ -75,7 +75,7 @@ class UserItem extends StatelessWidget { ), trailing: selected ? StreamSvgIcon.checkSend( - color: chatThemeData.colorTheme.accentBlue, + color: chatThemeData.colorTheme.accentPrimary, ) : null, title: Text( @@ -92,8 +92,8 @@ class UserItem extends StatelessWidget { user.online == true ? 'Online' : 'Last online ${Jiffy(user.lastActive).fromNow()}', - style: chatTheme.textTheme.footnote - .copyWith(color: chatTheme.colorTheme.black.withOpacity(.5)), + style: chatTheme.textTheme.footnote.copyWith( + color: chatTheme.colorTheme.textHighEmphasis.withOpacity(.5)), ); } } diff --git a/packages/stream_chat_flutter/lib/src/user_list_view.dart b/packages/stream_chat_flutter/lib/src/user_list_view.dart index f64f3c76..923e0334 100644 --- a/packages/stream_chat_flutter/lib/src/user_list_view.dart +++ b/packages/stream_chat_flutter/lib/src/user_list_view.dart @@ -285,7 +285,7 @@ class _UserListViewState extends State final chatThemeData = StreamChatTheme.of(context); return Container( key: ValueKey('HEADER-$header'), - color: chatThemeData.colorTheme.black.withOpacity(0.05), + color: chatThemeData.colorTheme.textHighEmphasis.withOpacity(0.05), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 6), child: Text( @@ -293,7 +293,7 @@ class _UserListViewState extends State style: TextStyle( fontWeight: FontWeight.bold, fontSize: 14.5, - color: chatThemeData.colorTheme.grey, + color: chatThemeData.colorTheme.textLowEmphasis, ), ), ), @@ -385,7 +385,7 @@ class _UserListViewState extends State return Container( color: StreamChatTheme.of(context) .colorTheme - .accentRed + .accentError .withOpacity(.2), child: const Padding( padding: EdgeInsets.symmetric(vertical: 16), @@ -408,6 +408,6 @@ class _UserListViewState extends State Widget _separatorBuilder(context, i) => Container( height: 1, - color: StreamChatTheme.of(context).colorTheme.greyWhisper, + color: StreamChatTheme.of(context).colorTheme.borders, ); } diff --git a/packages/stream_chat_flutter/lib/src/utils.dart b/packages/stream_chat_flutter/lib/src/utils.dart index d923b752..aee46800 100644 --- a/packages/stream_chat_flutter/lib/src/utils.dart +++ b/packages/stream_chat_flutter/lib/src/utils.dart @@ -31,7 +31,7 @@ Future showConfirmationDialog( final chatThemeData = StreamChatTheme.of(context); return showModalBottomSheet( useRootNavigator: false, - backgroundColor: chatThemeData.colorTheme.white, + backgroundColor: chatThemeData.colorTheme.barsBg, context: context, shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( @@ -75,7 +75,7 @@ Future showConfirmationDialog( child: Text( cancelText, style: chatThemeData.textTheme.bodyBold.copyWith( - color: chatThemeData.colorTheme.black + color: chatThemeData.colorTheme.textHighEmphasis .withOpacity(0.5)), ), ), @@ -91,7 +91,7 @@ Future showConfirmationDialog( child: Text( okText, style: chatThemeData.textTheme.bodyBold.copyWith( - color: chatThemeData.colorTheme.accentRed), + color: chatThemeData.colorTheme.accentError), ), ), ), @@ -116,7 +116,8 @@ Future showInfoDialog( final chatThemeData = StreamChatTheme.of(context); return showModalBottomSheet( useRootNavigator: false, - backgroundColor: theme?.colorTheme.white ?? chatThemeData.colorTheme.white, + backgroundColor: + theme?.colorTheme.barsBg ?? chatThemeData.colorTheme.barsBg, context: context, shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( @@ -147,8 +148,8 @@ Future showInfoDialog( height: 36, ), Container( - color: theme?.colorTheme.black.withOpacity(.08) ?? - chatThemeData.colorTheme.black.withOpacity(.08), + color: theme?.colorTheme.textHighEmphasis.withOpacity(.08) ?? + chatThemeData.colorTheme.textHighEmphasis.withOpacity(.08), height: 1, ), Center( @@ -159,8 +160,8 @@ Future showInfoDialog( child: Text( okText, style: TextStyle( - color: theme?.colorTheme.black.withOpacity(0.5) ?? - chatThemeData.colorTheme.accentBlue, + color: theme?.colorTheme.textHighEmphasis.withOpacity(0.5) ?? + chatThemeData.colorTheme.accentPrimary, fontWeight: FontWeight.w400, ), ), diff --git a/packages/stream_chat_flutter/lib/src/video_thumbnail_image.dart b/packages/stream_chat_flutter/lib/src/video_thumbnail_image.dart index 23cc0e35..2286bc3d 100644 --- a/packages/stream_chat_flutter/lib/src/video_thumbnail_image.dart +++ b/packages/stream_chat_flutter/lib/src/video_thumbnail_image.dart @@ -94,8 +94,8 @@ class _VideoThumbnailImageState extends State { constraints: const BoxConstraints.expand(), child: widget.placeholderBuilder?.call(context) ?? Shimmer.fromColors( - baseColor: _streamChatTheme.colorTheme.greyGainsboro, - highlightColor: _streamChatTheme.colorTheme.whiteSmoke, + baseColor: _streamChatTheme.colorTheme.disabled, + highlightColor: _streamChatTheme.colorTheme.inputBg, child: Image.asset( 'images/placeholder.png', fit: BoxFit.cover, diff --git a/packages/stream_chat_flutter_core/example/lib/main.dart b/packages/stream_chat_flutter_core/example/lib/main.dart index e7ef400a..e12d2177 100644 --- a/packages/stream_chat_flutter_core/example/lib/main.dart +++ b/packages/stream_chat_flutter_core/example/lib/main.dart @@ -203,9 +203,9 @@ class _MessageScreenState extends State { final channel = StreamChannel.of(context).channel; return Scaffold( appBar: AppBar( - title: StreamBuilder>( - initialData: channel.state?.typingEvents, - stream: channel.state?.typingEventsStream, + title: StreamBuilder>( + initialData: channel.state?.typingEvents.keys, + stream: channel.state?.typingEventsStream.map((it) => it.keys), builder: (context, snapshot) { if (snapshot.hasData && snapshot.data!.isNotEmpty) { return Text('${snapshot.data!.first.name} is typing...'); @@ -344,7 +344,7 @@ extension on Channel { String? get name { final _channelName = extraData['name']; if (_channelName != null) { - return _channelName; + return _channelName as String; } else { return cid; }