fix: small issues

packages/flutter_timeline/lib/src/flutter_timeline_gorouter_userstory.dart

@@ -116,7 +116,6 @@ List<GoRoute> getTimelineStoryRoutes({
               Scaffold(
                 appBar: AppBar(
                   leading: backButton,
-                  backgroundColor: const Color(0xff212121),
                   title: Text(
                     config.optionsBuilder(context).translations.postCreation,
                     style: TextStyle(
@@ -180,7 +179,6 @@ List<GoRoute> getTimelineStoryRoutes({
               Scaffold(
                 appBar: AppBar(
                   leading: backButton,
-                  backgroundColor: const Color(0xff212121),
                   title: Text(
                     category?.title ?? post.category ?? 'Category',
                     style: TextStyle(
@@ -238,7 +236,6 @@ List<GoRoute> getTimelineStoryRoutes({
                   ?.call(context, timelinePostCreationWidget, backButton) ??
               Scaffold(
                 appBar: AppBar(
-                  backgroundColor: const Color(0xff212121),
                   leading: backButton,
                   title: Text(
                     config.optionsBuilder(context).translations.postCreation,
@@ -287,7 +284,6 @@ List<GoRoute> getTimelineStoryRoutes({
               Scaffold(
                 appBar: AppBar(
                   leading: backButton,
-                  backgroundColor: const Color(0xff212121),
                   title: Text(
                     config.optionsBuilder(context).translations.postOverview,
                     style: TextStyle(

packages/flutter_timeline/lib/src/flutter_timeline_navigator_userstory.dart

@@ -313,7 +313,7 @@ Widget _postOverviewScreenRoute({
         appBar: AppBar(
           leading: backButton,
           title: Text(
-            config.optionsBuilder(context).translations.postOverview,
+            config.optionsBuilder(context).translations.postCreation,
             style: TextStyle(
               color: Theme.of(context).primaryColor,
               fontSize: 24,

packages/flutter_timeline_view/lib/src/config/timeline_options.dart

@@ -16,7 +16,7 @@ class TimelineOptions {
     this.translations = const TimelineTranslations.empty(),
     this.paddings = const TimelinePaddingOptions(),
     this.imagePickerConfig = const ImagePickerConfig(),
-    this.imagePickerTheme = const ImagePickerTheme(),
+    this.imagePickerTheme,
     this.timelinePostHeight,
     this.sortCommentsAscending = true,
     this.sortPostsAscending = false,
@@ -93,7 +93,7 @@ class TimelineOptions {
 
   /// ImagePickerTheme can be used to change the UI of the
   /// Image Picker Widget to change the text/icons to your liking.
-  final ImagePickerTheme imagePickerTheme;
+  final ImagePickerTheme? imagePickerTheme;
 
   /// ImagePickerConfig can be used to define the
   /// size and quality for the uploaded image.

packages/flutter_timeline_view/lib/src/screens/timeline_post_creation_screen.dart

@@ -11,6 +11,7 @@ import 'package:flutter_image_picker/flutter_image_picker.dart';
 import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
 import 'package:flutter_timeline_view/flutter_timeline_view.dart';
 import 'package:flutter_timeline_view/src/config/timeline_options.dart';
+import 'package:flutter_timeline_view/src/widgets/default_filled_button.dart';
 import 'package:flutter_timeline_view/src/widgets/post_creation_textfield.dart';
 
 class TimelinePostCreationScreen extends StatefulWidget {
@@ -123,9 +124,9 @@ class _TimelinePostCreationScreenState
 
     return GestureDetector(
       onTap: () => FocusScope.of(context).unfocus(),
-      child: Padding(
+      child: SingleChildScrollView(
-        padding: widget.options.paddings.mainPadding,
+        child: Padding(
-        child: SingleChildScrollView(
+          padding: widget.options.paddings.mainPadding,
           child: Column(
             mainAxisSize: MainAxisSize.max,
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -199,7 +200,23 @@ class _TimelinePostCreationScreenState
                           color: theme.colorScheme.surface,
                           child: ImagePicker(
                             imagePickerConfig: widget.options.imagePickerConfig,
-                            imagePickerTheme: widget.options.imagePickerTheme,
+                            imagePickerTheme: widget.options.imagePickerTheme ??
+                                ImagePickerTheme(
+                                  titleAlignment: TextAlign.center,
+                                  title: '    Do you want to upload a file'
+                                      ' or take a picture?    ',
+                                  titleTextSize:
+                                      theme.textTheme.titleMedium!.fontSize!,
+                                  font:
+                                      theme.textTheme.titleMedium!.fontFamily!,
+                                  iconSize: 40,
+                                  selectImageText: 'UPLOAD FILE',
+                                  makePhotoText: 'TAKE PICTURE',
+                                  selectImageIcon: const Icon(
+                                    size: 40,
+                                    Icons.insert_drive_file,
+                                  ),
+                                ),
                           ),
                         ),
                       );
@@ -263,9 +280,7 @@ class _TimelinePostCreationScreenState
                   ],
                 ],
               ),
-
               const SizedBox(height: 16),
-
               Text(
                 widget.options.translations.commentsTitle,
                 style: theme.textTheme.titleMedium,
@@ -318,41 +333,28 @@ class _TimelinePostCreationScreenState
                 ],
               ),
               const SizedBox(height: 120),
-
               SafeArea(
                 bottom: true,
                 child: Align(
                   alignment: Alignment.bottomCenter,
-                  child: (widget.options.buttonBuilder != null)
+                  child: widget.options.buttonBuilder?.call(
-                      ? widget.options.buttonBuilder!(
+                        context,
-                          context,
+                        onPostCreated,
-                          onPostCreated,
+                        widget.options.translations.checkPost,
-                          widget.options.translations.checkPost,
+                        enabled: editingDone,
-                          enabled: editingDone,
+                      ) ??
-                        )
+                      DefaultFilledButton(
-                      : FilledButton(
+                        onPressed: editingDone
-                          style: ButtonStyle(
+                            ? () async {
-                            backgroundColor: WidgetStatePropertyAll(
+                                await onPostCreated();
-                              theme.colorScheme.primary,
+                                await widget.service.postService
-                            ),
+                                    .fetchPosts(null);
-                          ),
+                              }
-                          onPressed: editingDone
+                            : null,
-                              ? () async {
+                        buttonText: widget.enablePostOverviewScreen
-                                  await onPostCreated();
+                            ? widget.options.translations.checkPost
-                                  await widget.service.postService
+                            : widget.options.translations.postCreation,
-                                      .fetchPosts(null);
+                      ),
-                                }
-                              : null,
-                          child: Padding(
-                            padding: const EdgeInsets.all(8),
-                            child: Text(
-                              widget.enablePostOverviewScreen
-                                  ? widget.options.translations.checkPost
-                                  : widget.options.translations.postCreation,
-                              style: theme.textTheme.displayLarge,
-                            ),
-                          ),
-                        ),
                 ),
               ),
             ],

packages/flutter_timeline_view/lib/src/screens/timeline_post_overview_screen.dart

@@ -4,6 +4,7 @@ import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
 import 'package:flutter_timeline_view/flutter_timeline_view.dart';
+import 'package:flutter_timeline_view/src/widgets/default_filled_button.dart';
 
 class TimelinePostOverviewScreen extends StatelessWidget {
   const TimelinePostOverviewScreen({
@@ -20,8 +21,6 @@ class TimelinePostOverviewScreen extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    var theme = Theme.of(context);
-    // the timelinePost.category is a key so we need to get the category object
     var timelineCategoryName = options.categoriesOptions.categoriesBuilder
             ?.call(context)
             .firstWhereOrNull((element) => element.key == timelinePost.category)
@@ -56,21 +55,9 @@ class TimelinePostOverviewScreen extends StatelessWidget {
               buttonText,
               enabled: true,
             ) ??
-            FilledButton(
+            DefaultFilledButton(
-              style: ButtonStyle(
+              onPressed: () async => onPostSubmit(timelinePost),
-                backgroundColor:
+              buttonText: buttonText,
-                    WidgetStatePropertyAll(Theme.of(context).primaryColor),
-              ),
-              onPressed: () {
-                onPostSubmit(timelinePost);
-              },
-              child: Padding(
-                padding: const EdgeInsets.all(8),
-                child: Text(
-                  buttonText,
-                  style: theme.textTheme.displayLarge,
-                ),
-              ),
             ),
         SizedBox(height: options.paddings.postOverviewButtonBottomPadding),
       ],

packages/flutter_timeline_view/lib/src/screens/timeline_post_screen.dart

@@ -6,7 +6,6 @@ import 'dart:async';
 
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_html/flutter_html.dart';
 import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
 import 'package:flutter_timeline_view/src/config/timeline_options.dart';
 import 'package:flutter_timeline_view/src/widgets/reaction_bottom.dart';
@@ -364,6 +363,7 @@ class _TimelinePostScreenState extends State<TimelinePostScreen> {
                     ],
                   ),
                   const SizedBox(height: 8),
+                  // ignore: avoid_bool_literals_in_conditional_expressions
                   if (widget.isOverviewScreen != null
                       ? !widget.isOverviewScreen!
                       : false) ...[
@@ -549,14 +549,15 @@ class _TimelinePostScreenState extends State<TimelinePostScreen> {
           ),
         ),
         if (post.reactionEnabled && !(widget.isOverviewScreen ?? false))
-          SafeArea(
+          Align(
-            bottom: true,
+            alignment: Alignment.bottomCenter,
-            child: Align(
+            child: Container(
-              alignment: Alignment.bottomCenter,
+              color: theme.scaffoldBackgroundColor,
-              child: Container(
+              constraints: BoxConstraints(
-                constraints: BoxConstraints(
+                maxWidth: MediaQuery.of(context).size.width,
-                  maxWidth: MediaQuery.of(context).size.width,
+              ),
-                ),
+              child: SafeArea(
+                bottom: true,
                 child: Row(
                   crossAxisAlignment: CrossAxisAlignment.center,
                   mainAxisSize: MainAxisSize.min,

packages/flutter_timeline_view/lib/src/screens/timeline_screen.dart

@@ -302,14 +302,14 @@ class _TimelineScreenState extends State<TimelineScreen> {
                             ),
                           ),
                         ),
+                      SizedBox(
+                        height: widget.options.paddings.mainPadding.bottom,
+                      ),
                     ],
                   ),
                 ),
               ),
             ),
-            SizedBox(
-              height: widget.options.paddings.mainPadding.bottom,
-            ),
           ],
         );
       },

packages/flutter_timeline_view/lib/src/widgets/default_filled_button.dart

@@ -0,0 +1,32 @@
+import 'package:flutter/material.dart';
+
+class DefaultFilledButton extends StatelessWidget {
+  const DefaultFilledButton({
+    required this.onPressed,
+    required this.buttonText,
+    super.key,
+  });
+
+  final Future<void> Function()? onPressed;
+  final String buttonText;
+
+  @override
+  Widget build(BuildContext context) {
+    var theme = Theme.of(context);
+    return FilledButton(
+      style: ButtonStyle(
+        backgroundColor: WidgetStatePropertyAll(
+          theme.colorScheme.primary,
+        ),
+      ),
+      onPressed: onPressed,
+      child: Padding(
+        padding: const EdgeInsets.all(8),
+        child: Text(
+          buttonText,
+          style: theme.textTheme.displayLarge,
+        ),
+      ),
+    );
+  }
+}

packages/flutter_timeline_view/lib/src/widgets/reaction_bottom.dart

@@ -28,26 +28,28 @@ class _ReactionBottomState extends State<ReactionBottom> {
   final TextEditingController _textEditingController = TextEditingController();
 
   @override
-  Widget build(BuildContext context) => widget.messageInputBuilder(
+  Widget build(BuildContext context) => Container(
-        _textEditingController,
+        child: widget.messageInputBuilder(
-        Padding(
+          _textEditingController,
-          padding: const EdgeInsets.symmetric(
+          Padding(
-            horizontal: 8,
+            padding: const EdgeInsets.symmetric(
-          ),
+              horizontal: 8,
-          child: IconButton(
+            ),
-            onPressed: () async {
+            child: IconButton(
-              var value = _textEditingController.text;
+              onPressed: () async {
-              if (value.isNotEmpty) {
+                var value = _textEditingController.text;
-                await widget.onReactionSubmit(value);
+                if (value.isNotEmpty) {
-                _textEditingController.clear();
+                  await widget.onReactionSubmit(value);
-              }
+                  _textEditingController.clear();
-            },
+                }
-            icon: Icon(
+              },
-              Icons.send,
+              icon: Icon(
-              color: widget.iconColor,
+                Icons.send,
+                color: widget.iconColor,
+              ),
             ),
           ),
+          widget.translations.writeComment,
         ),
-        widget.translations.writeComment,
       );
 }