apply colors and ui fixes

analysis_options.yaml

@@ -1,63 +1,63 @@
-include: package:pedantic/analysis_options.yaml
+#include: package:pedantic/analysis_options.yaml
-
+#
-analyzer:
+#analyzer:
-  enable-experiment:
+#  enable-experiment:
-    - extension-methods
+#    - extension-methods
-  exclude:
+#  exclude:
-    - lib/**/*.g.dart
+#    - lib/**/*.g.dart
-    - example/**
+#    - example/**
-
+#
-linter:
+#linter:
-  rules:
+#  rules:
-    # these rules are documented on and in the same order as
+#    # these rules are documented on and in the same order as
-    # the Dart Lint rules page to make maintenance easier
+#    # the Dart Lint rules page to make maintenance easier
-    # https://github.com/dart-lang/linter/blob/master/example/all.yaml
+#    # https://github.com/dart-lang/linter/blob/master/example/all.yaml
-    # - always_declare_return_types
+#    # - always_declare_return_types
-    # - always_specify_types
+#    # - always_specify_types
-    # - annotate_overrides
+#    # - annotate_overrides
-    # - avoid_as
+#    # - avoid_as
-    - avoid_empty_else
+#    - avoid_empty_else
-    - avoid_init_to_null
+#    - avoid_init_to_null
-    - avoid_return_types_on_setters
+#    - avoid_return_types_on_setters
-    - avoid_web_libraries_in_flutter
+#    - avoid_web_libraries_in_flutter
-    - await_only_futures
+#    - await_only_futures
-    - camel_case_types
+#    - camel_case_types
-    - cancel_subscriptions
+#    - cancel_subscriptions
-    - close_sinks
+#    - close_sinks
-    # - comment_references # we do not presume as to what people want to reference in their dartdocs
+#    # - comment_references # we do not presume as to what people want to reference in their dartdocs
-    # - constant_identifier_names # https://github.com/dart-lang/linter/issues/204
+#    # - constant_identifier_names # https://github.com/dart-lang/linter/issues/204
-    - control_flow_in_finally
+#    - control_flow_in_finally
-    - empty_constructor_bodies
+#    - empty_constructor_bodies
-    - empty_statements
+#    - empty_statements
-    - hash_and_equals
+#    - hash_and_equals
-    - implementation_imports
+#    - implementation_imports
-    # - invariant_booleans
+#    # - invariant_booleans
-    # - iterable_contains_unrelated_type
+#    # - iterable_contains_unrelated_type
-    - library_names
+#    - library_names
-    # - library_prefixes
+#    # - library_prefixes
-    # - list_remove_unrelated_type
+#    # - list_remove_unrelated_type
-    # - literal_only_boolean_expressions
+#    # - literal_only_boolean_expressions
-    - non_constant_identifier_names
+#    - non_constant_identifier_names
-    # - one_member_abstracts
+#    # - one_member_abstracts
-    # - only_throw_errors
+#    # - only_throw_errors
-    # - overridden_fields
+#    # - overridden_fields
-#    - package_api_docs
+##    - package_api_docs
-    - package_names
+#    - package_names
-    - package_prefixed_library_names
+#    - package_prefixed_library_names
-    - prefer_is_not_empty
+#    - prefer_is_not_empty
-    # - prefer_mixin # https://github.com/dart-lang/language/issues/32
+#    # - prefer_mixin # https://github.com/dart-lang/language/issues/32
-    - public_member_api_docs
+#    - public_member_api_docs
-    - slash_for_doc_comments
+#    - slash_for_doc_comments
-    # - sort_constructors_first
+#    # - sort_constructors_first
-    # - sort_unnamed_constructors_first
+#    # - sort_unnamed_constructors_first
-    # - super_goes_last # no longer needed w/ Dart 2
+#    # - super_goes_last # no longer needed w/ Dart 2
-    - test_types_in_equals
+#    - test_types_in_equals
-    - throw_in_finally
+#    - throw_in_finally
-    # - type_annotate_public_apis # subset of always_specify_types
+#    # - type_annotate_public_apis # subset of always_specify_types
-    - type_init_formals
+#    - type_init_formals
-    # - unawaited_futures
+#    # - unawaited_futures
-    - unnecessary_brace_in_string_interps
+#    - unnecessary_brace_in_string_interps
-    - unnecessary_getters_setters
+#    - unnecessary_getters_setters
-    - unnecessary_statements
+#    - unnecessary_statements
     - unrelated_type_equality_checks
     - valid_regexps

example/lib/advanced_options_page.dart

@@ -3,12 +3,12 @@ import 'dart:io';
 import 'package:example/stream_version.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_secure_storage/flutter_secure_storage.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
+import 'choose_user_page.dart';
 import 'main.dart';
 import 'notifications_service.dart';
-import 'choose_user_page.dart';
-import 'package:flutter_secure_storage/flutter_secure_storage.dart';
 
 class AdvancedOptionsPage extends StatefulWidget {
   @override
@@ -36,7 +36,7 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
     return Scaffold(
       resizeToAvoidBottomPadding: false,
       appBar: AppBar(
-        backgroundColor: StreamChatTheme.of(context).primaryColor,
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
         elevation: 1,
         centerTitle: true,
         brightness: Theme.of(context).brightness,
@@ -97,7 +97,7 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                         fontSize: 14,
                         fontWeight: FontWeight.bold,
                         color: _apiKeyError != null
-                            ? Color(0xffff3742)
+                            ? StreamChatTheme.of(context).colorTheme.accentRed
                             : StreamChatTheme.of(context)
                                 .colorTheme
                                 .black
@@ -145,7 +145,7 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                           fontWeight: FontWeight.bold,
                           fontSize: 14,
                           color: _userIdError != null
-                              ? Color(0xffff3742)
+                              ? StreamChatTheme.of(context).colorTheme.accentRed
                               : StreamChatTheme.of(context)
                                   .colorTheme
                                   .black
@@ -193,7 +193,7 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                           fontWeight: FontWeight.bold,
                           fontSize: 14,
                           color: _userTokenError != null
-                              ? Color(0xffff3742)
+                              ? StreamChatTheme.of(context).colorTheme.accentRed
                               : StreamChatTheme.of(context)
                                   .colorTheme
                                   .black
@@ -238,7 +238,8 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                     child: Align(
                       alignment: Alignment.bottomCenter,
                       child: FlatButton(
-                        color: StreamChatTheme.of(context).accentColor,
+                        color:
+                            StreamChatTheme.of(context).colorTheme.accentBlue,
                         minWidth: double.infinity,
                         height: 48,
                         child: Text(

example/lib/choose_user_page.dart

@@ -1,5 +1,3 @@
-import 'package:example/advanced_options_page.dart';
-import 'package:example/main.dart';
 import 'package:example/stream_version.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
@@ -194,7 +192,7 @@ class ChooseUserPage extends StatelessWidget {
                             color: StreamChatTheme.of(context).colorTheme.black,
                           ),
                           backgroundColor:
-                              StreamChatTheme.of(context).secondaryColor,
+                              StreamChatTheme.of(context).colorTheme.accentBlue,
                         ),
                         title: Text(
                           'Advanced Options',

example/lib/customize_channel_preview.dart

@@ -84,7 +84,6 @@ class ChannelListPage extends StatelessWidget {
         channel: channel,
       ),
       title: ChannelName(
-        channel: channel,
         textStyle:
             StreamChatTheme.of(context).channelPreviewTheme.title.copyWith(
                   color: StreamChatTheme.of(context)

example/lib/customize_message_widget.dart

@@ -127,7 +127,6 @@ class ChannelPage extends StatelessWidget {
       showTimestamp: !details.isNextUser,
       showUsername: !details.isNextUser,
       showReactions: false,
-      showReplyIndicator: false,
     );
   }
 }

example/lib/main.dart

@@ -1,8 +1,7 @@
+import 'dart:async';
 import 'dart:io';
 
 import 'package:example/choose_user_page.dart';
-import 'package:example/new_chat_screen.dart';
-import 'package:example/new_group_chat_screen.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
@@ -13,7 +12,6 @@ import 'notifications_service.dart';
 import 'routes/app_routes.dart';
 import 'routes/routes.dart';
 import 'search_text_field.dart';
-import 'dart:async';
 
 void main() async {
   WidgetsFlutterBinding.ensureInitialized();
@@ -51,21 +49,20 @@ class MyApp extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return StreamChat(
+    return MaterialApp(
-      streamChatThemeData: StreamChatThemeData.getDefaultTheme(
+      builder: (context, child) {
-        ThemeData.dark(),
+        return StreamChat(
-      ),
+          client: client,
-      client: client,
+          child: child,
-      child: MaterialApp(
+        );
-        debugShowCheckedModeBanner: false,
+      },
-        theme: ThemeData.light(),
+      debugShowCheckedModeBanner: false,
-        darkTheme: ThemeData.dark(),
+      theme: ThemeData.light(),
-        //TODO change to system once dark  theme is implemented
+      darkTheme: ThemeData.dark(),
-        themeMode: ThemeMode.dark,
+      themeMode: ThemeMode.dark,
-        onGenerateRoute: AppRoutes.generateRoute,
+      onGenerateRoute: AppRoutes.generateRoute,
-        initialRoute:
+      initialRoute:
-            client.state.user == null ? Routes.CHOOSE_USER : Routes.HOME,
+          client.state.user == null ? Routes.CHOOSE_USER : Routes.HOME,
-      ),
     );
   }
 }
@@ -120,6 +117,7 @@ class _HomePageState extends State<HomePage> {
   Widget build(BuildContext context) {
     final user = StreamChat.of(context).user;
     return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       appBar: ChannelListHeader(
         onNewChatButtonTap: () {
           Navigator.pushNamed(context, Routes.NEW_CHAT);
@@ -128,6 +126,7 @@ class _HomePageState extends State<HomePage> {
       drawer: _buildDrawer(context, user),
       drawerEdgeDragWidth: 50,
       bottomNavigationBar: BottomNavigationBar(
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
         currentIndex: _currentIndex,
         items: _navBarItems,
         selectedLabelStyle: StreamChatTheme.of(context).textTheme.footnoteBold,
@@ -429,7 +428,7 @@ class ChannelPage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: StreamChatTheme.of(context).backgroundColor,
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       appBar: ChannelHeader(
         showTypingIndicator: false,
       ),

example/lib/new_chat_screen.dart

@@ -5,7 +5,6 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
 import 'chips_input_text_field.dart';
 import 'main.dart';
-import 'new_group_chat_screen.dart';
 import 'routes/routes.dart';
 
 class NewChatScreen extends StatefulWidget {
@@ -37,8 +36,6 @@ class _NewChatScreenState extends State<NewChatScreen> {
 
   bool _showUserList = true;
 
-  bool _channelExisted = false;
-
   void _userNameListener() {
     if (_debounce?.isActive ?? false) _debounce.cancel();
     _debounce = Timer(const Duration(milliseconds: 350), () {

example/lib/search_text_field.dart

@@ -24,7 +24,7 @@ class SearchTextField extends StatelessWidget {
       decoration: BoxDecoration(
         color: StreamChatTheme.of(context).colorTheme.white,
         border: Border.all(
-          color: Colors.grey.shade300,
+          color: StreamChatTheme.of(context).colorTheme.white,
         ),
         borderRadius: BorderRadius.circular(24),
       ),

example/pubspec.yaml

@@ -1,6 +1,6 @@
 name: example
 description: A new Flutter project.
-version: 1.0.95+98
+version: 1.0.97+100
 
 environment:
   sdk: ">=2.2.2 <3.0.0"

lib/src/attachment_title.dart

@@ -32,7 +32,7 @@ class AttachmentTitle extends StatelessWidget {
               attachment.title,
               overflow: TextOverflow.ellipsis,
               style: messageTheme.messageText.copyWith(
-                color: StreamChatTheme.of(context).accentColor,
+                color: StreamChatTheme.of(context).colorTheme.accentBlue,
                 fontWeight: FontWeight.bold,
               ),
             ),

lib/src/back_button.dart

@@ -37,9 +37,7 @@ class StreamBackButton extends StatelessWidget {
             },
             child: StreamSvgIcon.left(
               size: 24,
-              color: Theme.of(context).brightness == Brightness.dark
+              color: StreamChatTheme.of(context).colorTheme.black,
-                  ? StreamChatTheme.of(context).colorTheme.white
-                  : StreamChatTheme.of(context).colorTheme.black,
             ),
           ),
         ),

lib/src/channel_bottom_sheet.dart

@@ -106,13 +106,13 @@ class ChannelBottomSheet extends StatelessWidget {
                 ?.role))
               ListTile(
                 leading: StreamSvgIcon.delete(
-                  color: Color(0xFFFF3742),
+                  color: StreamChatTheme.of(context).colorTheme.accentRed,
                   size: 24,
                 ),
                 title: Text(
                   'Delete chat',
                   style: TextStyle(
-                    color: Color(0xFFFF3742),
+                    color: StreamChatTheme.of(context).colorTheme.accentRed,
                   ),
                 ),
                 onTap: () async {
@@ -124,7 +124,7 @@ class ChannelBottomSheet extends StatelessWidget {
                         'Are you sure you want to delete this conversation?',
                     cancelText: 'CANCEL',
                     icon: StreamSvgIcon.delete(
-                      color: Colors.red,
+                      color: StreamChatTheme.of(context).colorTheme.accentRed,
                     ),
                   );
                   var channel = StreamChannel.of(context).channel;

lib/src/channel_image.dart

@@ -133,7 +133,7 @@ class ChannelImage extends StatelessWidget {
                       .avatarTheme
                       .constraints,
               decoration: BoxDecoration(
-                color: StreamChatTheme.of(context).accentColor,
+                color: StreamChatTheme.of(context).colorTheme.accentBlue,
               ),
               child: Stack(
                 alignment: Alignment.center,

lib/src/channel_list_view.dart

@@ -253,7 +253,8 @@ class _ChannelListViewState extends State<ChannelListView>
                                     .bodyBold
                                     .copyWith(
                                       color: StreamChatTheme.of(context)
-                                          .accentColor,
+                                          .colorTheme
+                                          .accentBlue,
                                     ),
                               ),
                             ),
@@ -501,9 +502,7 @@ class _ChannelListViewState extends State<ChannelListView>
               );
             } else {
               final backgroundColor =
-                  Theme.of(context).brightness == Brightness.light
+                  StreamChatTheme.of(context).colorTheme.whiteSmoke;
-                      ? Color(0xffEBEBEB)
-                      : Color(0xff141414);
               child = Slidable(
                 enabled: widget.swipeToAction,
                 actionPane: SlidableBehindActionPane(),
@@ -543,7 +542,7 @@ class _ChannelListViewState extends State<ChannelListView>
                     IconSlideAction(
                       color: backgroundColor,
                       iconWidget: StreamSvgIcon.delete(
-                        color: Color(0xFFFF3742),
+                        color: StreamChatTheme.of(context).colorTheme.accentRed,
                       ),
                       onTap: () async {
                         final res = await showConfirmationDialog(
@@ -554,7 +553,9 @@ class _ChannelListViewState extends State<ChannelListView>
                               'Are you sure you want to delete this conversation?',
                           cancelText: 'CANCEL',
                           icon: StreamSvgIcon.delete(
-                            color: Color(0xFFFF3742),
+                            color: StreamChatTheme.of(context)
+                                .colorTheme
+                                .accentRed,
                           ),
                         );
                         if (res == true) {
@@ -564,7 +565,7 @@ class _ChannelListViewState extends State<ChannelListView>
                     ),
                 ],
                 child: Container(
-                  color: StreamChatTheme.of(context).backgroundColor,
+                  color: StreamChatTheme.of(context).colorTheme.whiteSnow,
                   child: ChannelPreview(
                     onLongPress: widget.onChannelLongPress,
                     channel: channel,
@@ -621,9 +622,7 @@ class _ChannelListViewState extends State<ChannelListView>
   Widget _separatorBuilder(context, i) {
     return Container(
       height: 1,
-      color: Theme.of(context).brightness == Brightness.dark
+      color: StreamChatTheme.of(context).colorTheme.black.withOpacity(0.08),
-          ? StreamChatTheme.of(context).colorTheme.white.withOpacity(0.1)
-          : StreamChatTheme.of(context).colorTheme.black.withOpacity(0.1),
     );
   }
 

lib/src/channel_preview.dart

@@ -130,7 +130,7 @@ class ChannelPreview extends StatelessWidget {
                                         .isAfter(channel
                                             .state.lastMessage.createdAt))
                                     .length ==
-                                (channel.memberCount ?? 0),
+                                ((channel.memberCount ?? 0) - 1),
                           ),
                         );
                       }

lib/src/chat_info_screen.dart

@@ -1,4 +1,3 @@
-import 'package:emojis/emojis.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:jiffy/jiffy.dart';
@@ -21,7 +20,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
   Widget build(BuildContext context) {
     final channel = StreamChannel.of(context).channel;
     return Scaffold(
-      backgroundColor: Color(0xFFe6e6e6),
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
       body: ListView(
         children: [
           _buildUserHeader(),
@@ -47,7 +46,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
 
   Widget _buildUserHeader() {
     return Material(
-      color: StreamChatTheme.of(context).colorTheme.white,
+      color: StreamChatTheme.of(context).colorTheme.whiteSnow,
       child: SafeArea(
         child: Stack(
           children: [
@@ -96,7 +95,9 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
               top: 21,
               left: 16,
               child: InkWell(
-                child: StreamSvgIcon.left(),
+                child: StreamSvgIcon.left(
+                  color: StreamChatTheme.of(context).colorTheme.black,
+                ),
                 onTap: () {
                   Navigator.of(context).pop();
                 },
@@ -218,7 +219,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
 
   Widget _buildDeleteListTile() {
     return _OptionListTile(
-      title: 'Delete',
+      title: 'Delete conversation',
       leading: StreamSvgIcon.delete(
         color: Colors.red,
         size: 24.0,
@@ -290,7 +291,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
               ),
               child: Material(
                 shape: CircleBorder(),
-                color: Color(0xff20E070),
+                color: StreamChatTheme.of(context).colorTheme.accentGreen,
               ),
             ),
             color: StreamChatTheme.of(context).colorTheme.white,
@@ -321,11 +322,11 @@ class _OptionListTile extends StatelessWidget {
     return Column(
       children: [
         Container(
-          color: Color(0xffe6e6e6),
+          color: StreamChatTheme.of(context).colorTheme.white,
           height: 2.0,
         ),
         Material(
-          color: StreamChatTheme.of(context).colorTheme.white,
+          color: StreamChatTheme.of(context).colorTheme.whiteSnow,
           child: Container(
             height: 56.0,
             child: InkWell(
@@ -409,7 +410,7 @@ class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
             ),
           ),
         ),
-        backgroundColor: StreamChatTheme.of(context).primaryColor,
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
       ),
       body: FutureBuilder<List<Channel>>(
         future: chat.client.queryChannels(
@@ -559,7 +560,7 @@ class _MediaDisplayScreen extends StatelessWidget {
             ),
           ),
         ),
-        backgroundColor: StreamChatTheme.of(context).primaryColor,
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
       ),
     );
   }
@@ -595,7 +596,7 @@ class _FileDisplayScreen extends StatelessWidget {
             ),
           ),
         ),
-        backgroundColor: StreamChatTheme.of(context).primaryColor,
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
       ),
     );
   }

lib/src/date_divider.dart

@@ -40,10 +40,7 @@ class DateDivider extends StatelessWidget {
       child: Container(
         padding: const EdgeInsets.symmetric(horizontal: 8),
         decoration: BoxDecoration(
-          color: (Theme.of(context).brightness == Brightness.light
+          color: StreamChatTheme.of(context).colorTheme.black.withOpacity(0.5),
-                  ? StreamChatTheme.of(context).colorTheme.black
-                  : StreamChatTheme.of(context).colorTheme.white)
-              .withOpacity(0.5),
           borderRadius: BorderRadius.circular(
             8,
           ),

lib/src/file_attachment.dart

@@ -9,6 +9,7 @@ import 'package:stream_chat_flutter/src/stream_svg_icon.dart';
 import 'package:stream_chat_flutter/src/utils.dart';
 import 'package:video_compress/video_compress.dart';
 import 'package:video_player/video_player.dart';
+
 import 'media_utils.dart';
 
 enum FileAttachmentType { local, online }
@@ -61,7 +62,6 @@ class _FileAttachmentState extends State<FileAttachment> {
       child: Container(
         width: widget.size?.width ?? 100,
         height: 56.0,
-        margin: widget.trailing != null ? EdgeInsets.only(top: 4.0) : null,
         decoration: BoxDecoration(
           color: StreamChatTheme.of(context).colorTheme.white,
           borderRadius:
@@ -177,7 +177,8 @@ class _FileAttachmentState extends State<FileAttachment> {
                   width: 20.0,
                   height: 20.0,
                   child: CircularProgressIndicator(
-                    backgroundColor: StreamChatTheme.of(context).accentColor,
+                    backgroundColor:
+                        StreamChatTheme.of(context).colorTheme.accentBlue,
                   ),
                 ),
               );

lib/src/giphy_attachment.dart

@@ -260,7 +260,9 @@ class GiphyAttachment extends StatelessWidget {
                       child: Text(
                         'Send',
                         style: TextStyle(
-                            color: StreamChatTheme.of(context).accentColor,
+                            color: StreamChatTheme.of(context)
+                                .colorTheme
+                                .accentBlue,
                             fontWeight: FontWeight.bold),
                       ),
                     ),

lib/src/group_image.dart

@@ -31,7 +31,7 @@ class GroupImage extends StatelessWidget {
                   .avatarTheme
                   .constraints,
           decoration: BoxDecoration(
-            color: StreamChatTheme.of(context).accentColor,
+            color: StreamChatTheme.of(context).colorTheme.accentBlue,
           ),
           child: Flex(
             direction: Axis.vertical,

lib/src/image_actions_modal.dart

@@ -1,13 +1,14 @@
 import 'dart:typed_data';
 import 'dart:ui';
 
+import 'package:dio/dio.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
-import 'package:dio/dio.dart';
 import 'package:image_gallery_saver/image_gallery_saver.dart';
-import '../stream_chat_flutter.dart';
 import 'package:path_provider/path_provider.dart';
 
+import '../stream_chat_flutter.dart';
+
 class ImageActionsModal extends StatelessWidget {
   final Message message;
   final String userName;
@@ -165,7 +166,9 @@ class ImageActionsModal extends StatelessWidget {
                             'Delete',
                             StreamSvgIcon.delete(
                               size: 24.0,
-                              color: Color(0xffFF3742),
+                              color: StreamChatTheme.of(context)
+                                  .colorTheme
+                                  .accentRed,
                             ),
                             () {
                               Navigator.pop(context);
@@ -175,7 +178,9 @@ class ImageActionsModal extends StatelessWidget {
                                     StreamChannel.of(context).channel.cid,
                                   );
                             },
-                            color: Color(0xffFF3742),
+                            color: StreamChatTheme.of(context)
+                                .colorTheme
+                                .accentRed,
                           ),
                       ],
                     ).toList(),

lib/src/image_footer.dart

@@ -378,7 +378,8 @@ class _ImageFooterState extends State<ImageFooter> {
                                       'Save to Photos',
                                       style: TextStyle(
                                         color: StreamChatTheme.of(context)
-                                            .accentColor,
+                                            .colorTheme
+                                            .accentBlue,
                                         fontWeight: FontWeight.bold,
                                       ),
                                     ),
@@ -595,7 +596,9 @@ class _ImageFooterState extends State<ImageFooter> {
                           child: Transform.rotate(
                             angle: -pi / 2,
                             child: StreamSvgIcon.Icon_send_message(
-                              color: StreamChatTheme.of(context).accentColor,
+                              color: StreamChatTheme.of(context)
+                                  .colorTheme
+                                  .accentBlue,
                             ),
                           ),
                         ),

lib/src/media_list_view.dart

@@ -1,10 +1,11 @@
+import 'dart:ui' as ui;
+
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:photo_manager/photo_manager.dart';
 import 'package:stream_chat_flutter/src/lazy_load_scroll_view.dart';
 import 'package:stream_chat_flutter/src/stream_svg_icon.dart';
-import 'dart:ui' as ui;
 
 import '../stream_chat_flutter.dart';
 
@@ -148,7 +149,15 @@ class _MediaListViewState extends State<MediaListView> {
   void _getMedia() async {
     final assetList = await PhotoManager.getAssetPathList(
       hasAll: true,
-    ).then((value) => value.singleWhere((element) => element.isAll));
+    ).then((value) {
+      if (value?.isNotEmpty == true) {
+        return value.singleWhere((element) => element.isAll);
+      }
+    });
+
+    if (assetList == null) {
+      return;
+    }
 
     final media = await assetList.getAssetListPaged(_currentPage, 50);
 

lib/src/message_actions_modal.dart

@@ -69,10 +69,7 @@ class MessageActionsModal extends StatelessWidget {
                 sigmaY: 10.8731,
               ),
               child: Container(
-                color: StreamChatTheme.of(context)
+                color: Colors.black.withOpacity(.2),
-                    .colorTheme
-                    .black
-                    .withOpacity(0.1),
               ),
             ),
           ),
@@ -146,6 +143,9 @@ class MessageActionsModal extends StatelessWidget {
                                 horizontal: 48.0,
                               ),
                               child: Material(
+                                color: StreamChatTheme.of(context)
+                                    .colorTheme
+                                    .whiteSnow,
                                 clipBehavior: Clip.hardEdge,
                                 shape: RoundedRectangleBorder(
                                   borderRadius: BorderRadius.circular(16),

lib/src/message_input.dart

@@ -275,7 +275,7 @@ class MessageInputState extends State<MessageInput> {
               child: Material(
                 borderRadius: BorderRadius.circular(3),
                 color: _sendAsDm
-                    ? StreamChatTheme.of(context).accentColor
+                    ? StreamChatTheme.of(context).colorTheme.accentBlue
                     : StreamChatTheme.of(context).colorTheme.white,
                 child: InkWell(
                   onTap: () {
@@ -337,7 +337,7 @@ class MessageInputState extends State<MessageInput> {
         child: Padding(
           padding: const EdgeInsets.all(8.0) + EdgeInsets.only(bottom: 3.0),
           child: StreamSvgIcon.emptyCircleLeft(
-            color: StreamChatTheme.of(context).accentColor,
+            color: StreamChatTheme.of(context).colorTheme.accentBlue,
           ),
         ),
       ),
@@ -364,7 +364,7 @@ class MessageInputState extends State<MessageInput> {
           decoration: BoxDecoration(
             borderRadius: BorderRadius.circular(24.0),
             border: Border.all(
-              color: Colors.grey,
+              color: StreamChatTheme.of(context).colorTheme.white,
             ),
           ),
           padding: _attachments.isEmpty ? null : EdgeInsets.all(6.0),
@@ -411,8 +411,9 @@ class MessageInputState extends State<MessageInput> {
                             padding:
                                 const EdgeInsets.symmetric(horizontal: 8.0),
                             child: Chip(
-                              backgroundColor:
+                              backgroundColor: StreamChatTheme.of(context)
-                                  StreamChatTheme.of(context).accentColor,
+                                  .colorTheme
+                                  .accentBlue,
                               padding: EdgeInsets.zero,
                               labelPadding:
                                   EdgeInsets.symmetric(horizontal: 9.0),
@@ -612,12 +613,12 @@ class MessageInputState extends State<MessageInput> {
                     shape: RoundedRectangleBorder(
                       borderRadius: BorderRadius.circular(8.0),
                     ),
-                    color: StreamChatTheme.of(context).primaryColor,
+                    color: StreamChatTheme.of(context).colorTheme.white,
                     clipBehavior: Clip.antiAlias,
                     child: Container(
                       constraints: BoxConstraints.loose(Size.fromHeight(400)),
                       decoration: BoxDecoration(
-                          color: StreamChatTheme.of(context).primaryColor,
+                          color: StreamChatTheme.of(context).colorTheme.white,
                           borderRadius: BorderRadius.circular(8.0)),
                       child: ListView(
                         padding: const EdgeInsets.all(0),
@@ -635,7 +636,8 @@ class MessageInputState extends State<MessageInput> {
                                     ),
                                     child: StreamSvgIcon.lightning(
                                       color: StreamChatTheme.of(context)
-                                          .accentColor,
+                                          .colorTheme
+                                          .accentBlue,
                                     ),
                                   ),
                                   Text(
@@ -671,17 +673,6 @@ class MessageInputState extends State<MessageInput> {
                                       ],
                                     ),
                                   ),
-                                  trailing: CircleAvatar(
-                                    backgroundColor:
-                                        StreamChatTheme.of(context).accentColor,
-                                    child: StreamSvgIcon.lightning(
-                                      color: StreamChatTheme.of(context)
-                                          .colorTheme
-                                          .white,
-                                      size: 12.5,
-                                    ),
-                                    maxRadius: 12,
-                                  ),
                                   //subtitle: Text(c.description),
                                   onTap: () {
                                     _setCommand(c);
@@ -708,9 +699,9 @@ class MessageInputState extends State<MessageInput> {
       switch (index) {
         case 0:
           return _attachments.isEmpty
-              ? StreamChatTheme.of(context).accentColor
+              ? StreamChatTheme.of(context).colorTheme.accentBlue
               : (!_attachmentContainsFile
-                  ? StreamChatTheme.of(context).accentColor
+                  ? StreamChatTheme.of(context).colorTheme.accentBlue
                   : StreamChatTheme.of(context)
                       .colorTheme
                       .black
@@ -718,7 +709,7 @@ class MessageInputState extends State<MessageInput> {
           break;
         case 1:
           return _attachmentContainsFile
-              ? StreamChatTheme.of(context).accentColor
+              ? StreamChatTheme.of(context).colorTheme.accentBlue
               : (_attachments.isEmpty
                   ? StreamChatTheme.of(context)
                       .colorTheme
@@ -881,7 +872,8 @@ class MessageInputState extends State<MessageInput> {
                       child: Text(
                         'Add more files',
                         style: TextStyle(
-                          color: StreamChatTheme.of(context).accentColor,
+                          color:
+                              StreamChatTheme.of(context).colorTheme.accentBlue,
                           fontWeight: FontWeight.bold,
                         ),
                       ),
@@ -919,7 +911,8 @@ class MessageInputState extends State<MessageInput> {
                         'svgs/icon_picture_empty_state.svg',
                         package: 'stream_chat_flutter',
                         height: 140,
-                        color: StreamChatTheme.of(context).accentColor,
+                        color:
+                            StreamChatTheme.of(context).colorTheme.accentBlue,
                       ),
                       Center(
                         child: Text(
@@ -928,7 +921,9 @@ class MessageInputState extends State<MessageInput> {
                               .textTheme
                               .bodyBold
                               .copyWith(
-                                color: StreamChatTheme.of(context).accentColor,
+                                color: StreamChatTheme.of(context)
+                                    .colorTheme
+                                    .accentBlue,
                               ),
                         ),
                       ),
@@ -1106,7 +1101,7 @@ class MessageInputState extends State<MessageInput> {
                 child: Card(
                   margin: EdgeInsets.all(8.0),
                   elevation: 2.0,
-                  color: StreamChatTheme.of(context).primaryColor,
+                  color: StreamChatTheme.of(context).colorTheme.white,
                   shape: RoundedRectangleBorder(
                     borderRadius: BorderRadius.circular(8.0),
                   ),
@@ -1114,7 +1109,7 @@ class MessageInputState extends State<MessageInput> {
                   child: Container(
                     constraints: BoxConstraints.loose(Size.fromHeight(400)),
                     decoration: BoxDecoration(
-                      color: StreamChatTheme.of(context).primaryColor,
+                      color: StreamChatTheme.of(context).colorTheme.white,
                     ),
                     child: FutureBuilder<List<Member>>(
                         future: queryMembers ?? Future.value(members),
@@ -1142,7 +1137,8 @@ class MessageInputState extends State<MessageInput> {
                                       subtitle: Text('@${m.userId}'),
                                       trailing: StreamSvgIcon.mentions(
                                         color: StreamChatTheme.of(context)
-                                            .accentColor,
+                                            .colorTheme
+                                            .accentBlue,
                                       ),
                                       onTap: () {
                                         _mentionedUsers.add(m.user);
@@ -1207,7 +1203,7 @@ class MessageInputState extends State<MessageInput> {
         child: Card(
           margin: EdgeInsets.all(8.0),
           elevation: 2.0,
-          color: StreamChatTheme.of(context).primaryColor,
+          color: StreamChatTheme.of(context).colorTheme.white,
           shape: RoundedRectangleBorder(
             borderRadius: BorderRadius.circular(8.0),
           ),
@@ -1222,7 +1218,7 @@ class MessageInputState extends State<MessageInput> {
                   offset: Offset(0, -4),
                 ),
               ],
-              color: StreamChatTheme.of(context).primaryColor,
+              color: StreamChatTheme.of(context).colorTheme.white,
             ),
             child: ListView.builder(
                 padding: const EdgeInsets.all(0),
@@ -1238,7 +1234,9 @@ class MessageInputState extends State<MessageInput> {
                             padding:
                                 const EdgeInsets.symmetric(horizontal: 8.0),
                             child: StreamSvgIcon.smile(
-                              color: StreamChatTheme.of(context).accentColor,
+                              color: StreamChatTheme.of(context)
+                                  .colorTheme
+                                  .accentBlue,
                             ),
                           ),
                           Flexible(
@@ -1528,8 +1526,8 @@ class MessageInputState extends State<MessageInput> {
             const EdgeInsets.only(left: 4.0, right: 8.0, top: 8.0, bottom: 8.0),
         child: StreamSvgIcon.lightning(
           color: _commandsOverlay != null
-              ? StreamChatTheme.of(context).accentColor
+              ? StreamChatTheme.of(context).colorTheme.accentBlue
-              : Color(0xFF000000).withAlpha(128),
+              : StreamChatTheme.of(context).colorTheme.grey,
         ),
       ),
       onTap: () async {
@@ -1566,8 +1564,8 @@ class MessageInputState extends State<MessageInput> {
               EdgeInsets.only(left: 8.0, right: padding, top: 8.0, bottom: 8.0),
           child: StreamSvgIcon.attach(
             color: _openFilePickerSection
-                ? StreamChatTheme.of(context).accentColor
+                ? StreamChatTheme.of(context).colorTheme.accentBlue
-                : Color(0xFF000000).withAlpha(128),
+                : StreamChatTheme.of(context).colorTheme.grey,
           ),
         ),
         onTap: () async {
@@ -1896,7 +1894,7 @@ class MessageInputState extends State<MessageInput> {
         },
         child: StreamSvgIcon(
           assetName: _getIdleSendIcon(),
-          color: Colors.grey,
+          color: StreamChatTheme.of(context).colorTheme.greyGainsboro,
           height: 24.0,
           width: 24.0,
         ),
@@ -1914,7 +1912,7 @@ class MessageInputState extends State<MessageInput> {
           },
           child: StreamSvgIcon(
             assetName: _getSendIcon(),
-            color: StreamChatTheme.of(context).accentColor,
+            color: StreamChatTheme.of(context).colorTheme.accentBlue,
             height: 24.0,
             width: 24.0,
           ),

lib/src/message_reactions_modal.dart

@@ -60,10 +60,7 @@ class MessageReactionsModal extends StatelessWidget {
                 sigmaY: 10.8731,
               ),
               child: Container(
-                color: StreamChatTheme.of(context)
+                color: Colors.black.withOpacity(0.2),
-                    .colorTheme
-                    .black
-                    .withOpacity(0.1),
               ),
             ),
           ),
@@ -140,6 +137,7 @@ class MessageReactionsModal extends StatelessWidget {
         horizontal: 8.0,
       ),
       child: Card(
+        color: StreamChatTheme.of(context).colorTheme.white,
         clipBehavior: Clip.hardEdge,
         shape: RoundedRectangleBorder(
           borderRadius: BorderRadius.circular(16),

lib/src/reaction_bubble.dart

@@ -107,7 +107,7 @@ class ReactionBubble extends StatelessWidget {
               height: 16,
               color: (!highlightOwnReactions ||
                       reaction.user.id == StreamChat.of(context).user.id)
-                  ? StreamChatTheme.of(context).accentColor
+                  ? StreamChatTheme.of(context).colorTheme.accentBlue
                   : StreamChatTheme.of(context)
                       .colorTheme
                       .black
@@ -118,7 +118,7 @@ class ReactionBubble extends StatelessWidget {
               size: 16,
               color: (!highlightOwnReactions ||
                       reaction.user.id == StreamChat.of(context).user.id)
-                  ? StreamChatTheme.of(context).accentColor
+                  ? StreamChatTheme.of(context).colorTheme.accentBlue
                   : StreamChatTheme.of(context)
                       .colorTheme
                       .black

lib/src/reaction_picker.dart

@@ -89,7 +89,9 @@ class _ReactionPickerState extends State<ReactionPicker>
                               height: animations[index].value * 24.0,
                               width: animations[index].value * 24.0,
                               color: ownReactionIndex != -1
-                                  ? StreamChatTheme.of(context).accentColor
+                                  ? StreamChatTheme.of(context)
+                                      .colorTheme
+                                      .accentBlue
                                   : Theme.of(context)
                                       .iconTheme
                                       .color

lib/src/sending_indicator.dart

@@ -18,7 +18,7 @@ class SendingIndicator extends StatelessWidget {
       return Icon(
         Icons.done_all,
         size: 8,
-        color: StreamChatTheme.of(context).accentColor,
+        color: StreamChatTheme.of(context).colorTheme.accentBlue,
       );
     }
     if (message.status == MessageSendingStatus.SENT || message.status == null) {

lib/src/stream_chat.dart

@@ -76,8 +76,8 @@ class StreamChatState extends State<StreamChat> with WidgetsBindingObserver {
           return Theme(
             data: materialTheme.copyWith(
               primaryIconTheme: streamTheme.primaryIconTheme,
-              accentColor: streamTheme.accentColor,
+              accentColor: streamTheme.colorTheme.accentBlue,
-              scaffoldBackgroundColor: streamTheme.backgroundColor,
+              scaffoldBackgroundColor: streamTheme.colorTheme.white,
             ),
             child: widget.child,
           );
@@ -92,11 +92,9 @@ class StreamChatState extends State<StreamChat> with WidgetsBindingObserver {
   ) {
     final defaultTheme = StreamChatThemeData.getDefaultTheme(Theme.of(context));
     final theme = defaultTheme.copyWith(
-      primaryColor: themeData?.primaryColor,
       defaultChannelImage: themeData?.defaultChannelImage,
       primaryIconTheme: themeData?.primaryIconTheme,
       defaultUserImage: themeData?.defaultUserImage,
-      backgroundColor: themeData?.backgroundColor,
       channelTheme: defaultTheme.channelTheme.copyWith(
         channelHeaderTheme:
             defaultTheme.channelTheme.channelHeaderTheme.copyWith(
@@ -151,8 +149,6 @@ class StreamChatState extends State<StreamChat> with WidgetsBindingObserver {
         reactionsBackgroundColor:
             themeData?.otherMessageTheme?.reactionsBackgroundColor,
       ),
-      accentColor: themeData?.accentColor,
-      secondaryColor: themeData?.secondaryColor,
       channelPreviewTheme: defaultTheme.channelPreviewTheme.copyWith(
         avatarTheme: defaultTheme.channelPreviewTheme.avatarTheme.copyWith(
           constraints: themeData?.channelPreviewTheme?.avatarTheme?.constraints,

lib/src/stream_chat_theme.dart

@@ -48,18 +48,6 @@ class StreamChatThemeData {
   /// The text themes used in the widgets
   final ColorTheme colorTheme;
 
-  /// Primary color of the chat widgets
-  final Color primaryColor;
-
-  /// Secondary color of the chat widgets
-  final Color secondaryColor;
-
-  /// Accent color of the chat widgets
-  final Color accentColor;
-
-  /// Background color of the chat widgets
-  final Color backgroundColor;
-
   /// Theme of the [ChannelPreview]
   final ChannelPreviewTheme channelPreviewTheme;
 
@@ -88,10 +76,6 @@ class StreamChatThemeData {
   StreamChatThemeData({
     this.textTheme,
     this.colorTheme,
-    this.primaryColor,
-    this.secondaryColor,
-    this.accentColor,
-    this.backgroundColor,
     this.channelPreviewTheme,
     this.channelTheme,
     this.otherMessageTheme,
@@ -107,11 +91,7 @@ class StreamChatThemeData {
     final defaultTheme = getDefaultTheme(theme);
 
     return defaultTheme.copyWith(
-      accentColor: theme.accentColor,
       primaryIconTheme: theme.primaryIconTheme,
-      primaryColor: theme.colorScheme.primary,
-      secondaryColor: theme.colorScheme.secondary,
-      backgroundColor: theme.scaffoldBackgroundColor,
       channelTheme: defaultTheme.channelTheme.copyWith(
         inputGradient: LinearGradient(colors: [
           theme.accentColor.withOpacity(.5),
@@ -141,10 +121,6 @@ class StreamChatThemeData {
   StreamChatThemeData copyWith({
     TextTheme textTheme,
     ColorTheme colorTheme,
-    Color primaryColor,
-    Color secondaryColor,
-    Color accentColor,
-    Color backgroundColor,
     ChannelPreviewTheme channelPreviewTheme,
     ChannelTheme channelTheme,
     MessageTheme ownMessageTheme,
@@ -175,13 +151,9 @@ class StreamChatThemeData {
               white: colorTheme?.white,
               blueAlice: colorTheme?.blueAlice,
             ),
-        primaryColor: primaryColor ?? this.primaryColor,
-        secondaryColor: secondaryColor ?? this.secondaryColor,
         primaryIconTheme: primaryIconTheme ?? this.primaryIconTheme,
-        accentColor: accentColor ?? this.accentColor,
         defaultChannelImage: defaultChannelImage ?? this.defaultChannelImage,
         defaultUserImage: defaultUserImage ?? this.defaultUserImage,
-        backgroundColor: backgroundColor ?? this.backgroundColor,
         channelPreviewTheme: this.channelPreviewTheme?.copyWith(
               title: channelPreviewTheme.title,
               subtitle: channelPreviewTheme.subtitle,
@@ -252,12 +224,8 @@ class StreamChatThemeData {
     return StreamChatThemeData(
       textTheme: textTheme,
       colorTheme: colorTheme,
-      secondaryColor: Color(0xffEAEAEA),
-      accentColor: accentColor,
-      primaryColor: colorTheme.white,
       primaryIconTheme: IconThemeData(color: colorTheme.black.withOpacity(.5)),
       defaultChannelImage: (context, channel) => SizedBox(),
-      backgroundColor: colorTheme.whiteSnow,
       defaultUserImage: (context, user) => Center(
         child: CachedNetworkImage(
           filterQuality: FilterQuality.high,
@@ -266,7 +234,7 @@ class StreamChatThemeData {
         ),
       ),
       channelPreviewTheme: ChannelPreviewTheme(
-        unreadCounterColor: Color(0xffff3742),
+        unreadCounterColor: colorTheme.accentRed,
         avatarTheme: AvatarTheme(
           borderRadius: BorderRadius.circular(20),
           constraints: BoxConstraints.tightFor(
@@ -324,10 +292,10 @@ class StreamChatThemeData {
           fontWeight: FontWeight.w600,
           fontSize: 12,
         ),
-        messageBackgroundColor: isDark ? Color(0xff191919) : Color(0xffEAEAEA),
+        messageBackgroundColor: colorTheme.greyGainsboro,
         reactionsBackgroundColor: colorTheme.white,
-        reactionsBorderColor: isDark ? Color(0xff191919) : Color(0xffEAEAEA),
+        reactionsBorderColor: colorTheme.greyWhisper,
-        replyThreadColor: isDark ? Color(0xff191919) : Color(0xffEAEAEA),
+        replyThreadColor: colorTheme.greyWhisper,
         avatarTheme: AvatarTheme(
           borderRadius: BorderRadius.circular(20),
           constraints: BoxConstraints.tightFor(
@@ -340,8 +308,7 @@ class StreamChatThemeData {
         ),
       ),
       otherMessageTheme: MessageTheme(
-        reactionsBackgroundColor:
+        reactionsBackgroundColor: colorTheme.greyGainsboro,
-            isDark ? Color(0xff191919) : Color(0xffEAEAEA),
         reactionsBorderColor: colorTheme.white,
         messageText: TextStyle(
           fontSize: 14.5,
@@ -535,6 +502,9 @@ class ColorTheme {
   final Color whiteSnow;
   final Color white;
   final Color blueAlice;
+  final Color accentBlue;
+  final Color accentRed;
+  final Color accentGreen;
 
   ColorTheme.light({
     this.black = const Color(0xff000000),
@@ -545,6 +515,9 @@ class ColorTheme {
     this.whiteSnow = const Color(0xfffcfcfc),
     this.white = const Color(0xffffffff),
     this.blueAlice = const Color(0xffe9f2ff),
+    this.accentBlue = const Color(0xff005FFF),
+    this.accentRed = const Color(0xffFF3742),
+    this.accentGreen = const Color(0xff20E070),
   });
 
   ColorTheme.dark({
@@ -556,6 +529,9 @@ class ColorTheme {
     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),
   });
 
   ColorTheme copyWith({
@@ -568,6 +544,9 @@ class ColorTheme {
     Color whiteSnow,
     Color white,
     Color blueAlice,
+    Color accentBlue,
+    Color accentRed,
+    Color accentGreen,
   }) {
     return type == ColorThemeType.light
         ? ColorTheme.light(
@@ -579,6 +558,9 @@ class ColorTheme {
             whiteSnow: whiteSnow ?? this.whiteSnow,
             white: white ?? this.white,
             blueAlice: blueAlice ?? this.blueAlice,
+            accentBlue: accentBlue ?? this.accentBlue,
+            accentRed: accentRed ?? this.accentRed,
+            accentGreen: accentGreen ?? this.accentGreen,
           )
         : ColorTheme.dark(
             black: black ?? this.black,
@@ -589,6 +571,9 @@ class ColorTheme {
             whiteSnow: whiteSnow ?? this.whiteSnow,
             white: white ?? this.white,
             blueAlice: blueAlice ?? this.blueAlice,
+            accentBlue: accentBlue ?? this.accentBlue,
+            accentRed: accentRed ?? this.accentRed,
+            accentGreen: accentGreen ?? this.accentGreen,
           );
   }
 }

lib/src/user_avatar.dart

@@ -47,7 +47,7 @@ class UserAvatar extends StatelessWidget {
         constraints: constraints ??
             streamChatTheme.ownMessageTheme.avatarTheme.constraints,
         decoration: BoxDecoration(
-          color: streamChatTheme.accentColor,
+          color: streamChatTheme.colorTheme.accentBlue,
         ),
         child: hasImage
             ? CachedNetworkImage(
@@ -96,7 +96,7 @@ class UserAvatar extends StatelessWidget {
                         ),
                     child: Material(
                       shape: CircleBorder(),
-                      color: Color(0xff20E070),
+                      color: streamChatTheme.colorTheme.accentGreen,
                     ),
                   ),
                   color: StreamChatTheme.of(context).colorTheme.white,