fix color of tim, scroll bar and add readme help for android build errors

lib/src/mih_single_child_scroll.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:mih_package_toolkit/src/mih_colors.dart';
 
 /// A standardized scrollable container for the MIH Toolkit.
 ///
@@ -34,10 +35,18 @@ class MihSingleChildScroll extends StatefulWidget {
   /// Defaults to `false` if null. When enabled, it applies a
   /// [ScrollConfiguration] to the child subtree.
   final bool? scrollbarOn;
+
+  /// the color of scroll thumb when enabled wth [scrollbarOn]
+  final Color? scrollThumbColor;
+
+  /// The thinkness of scroll thumb when enabled with [scrollbarOn]
+  final double? scrollThumbThinkness;
   const MihSingleChildScroll({
     super.key,
     required this.child,
     this.scrollbarOn,
+    this.scrollThumbColor,
+    this.scrollThumbThinkness,
   });
 
   @override
@@ -50,11 +59,22 @@ class _MihSingleChildScrollState extends State<MihSingleChildScroll> {
     return SafeArea(
       bottom: false,
       minimum: EdgeInsets.only(bottom: 5),
-      child: ScrollConfiguration(
-        behavior: ScrollConfiguration.of(
-          context,
-        ).copyWith(scrollbars: widget.scrollbarOn ?? false),
-        child: SingleChildScrollView(child: widget.child),
+      child: Theme(
+        data: Theme.of(context).copyWith(
+          scrollbarTheme: ScrollbarThemeData(
+            thumbColor: WidgetStateProperty.all(widget.scrollThumbColor ??
+                MihColors.secondary()), // scrollbar color
+            thickness:
+                WidgetStateProperty.all(widget.scrollThumbThinkness ?? 10.0),
+            radius: Radius.circular(10),
+          ),
+        ),
+        child: ScrollConfiguration(
+          behavior: ScrollConfiguration.of(
+            context,
+          ).copyWith(scrollbars: widget.scrollbarOn ?? false),
+          child: SingleChildScrollView(child: widget.child),
+        ),
       ),
     );
   }

lib/src/mih_time_field.dart

@@ -92,6 +92,7 @@ class _MihTimeFieldState extends State<MihTimeField> {
               minute: int.tryParse(widget.controller.text.split(":")[1]) ?? 0,
             )
           : TimeOfDay.now(),
+      initialEntryMode: TimePickerEntryMode.dial,
       builder: (context, child) {
         return Theme(
           data: Theme.of(context).copyWith(
@@ -108,21 +109,57 @@ class _MihTimeFieldState extends State<MihTimeField> {
                   MihColors.primary(darkMode: widget.darkMode),
             ),
             timePickerTheme: TimePickerThemeData(
+              helpTextStyle: TextStyle(
+                color: widget.secondayColor ??
+                    MihColors.secondary(darkMode: widget.darkMode),
+                fontSize: 12,
+                letterSpacing: 0.8,
+                fontWeight: FontWeight.w500,
+              ),
               // The main dialog background
               backgroundColor: widget.primaryColor ??
                   MihColors.primary(darkMode: widget.darkMode),
               // The background of the clock dial
-              dialBackgroundColor: widget.secondayColor ??
-                  MihColors.secondary(darkMode: widget.darkMode),
+              dialBackgroundColor: widget.primaryColor ??
+                  MihColors.primary(darkMode: widget.darkMode),
+              dialTextColor: WidgetStateColor.resolveWith((states) {
+                if (states.contains(WidgetState.selected)) {
+                  return widget.primaryColor ??
+                      MihColors.primary(
+                          darkMode: widget
+                              .darkMode); // number at selected position (inside the dot)
+                }
+                return widget.secondayColor ??
+                    MihColors.secondary(
+                        darkMode: widget.darkMode); // all other numbers
+              }),
               // The color of the clock hand
-              dialHandColor: widget.primaryColor ??
-                  MihColors.primary(darkMode: widget.darkMode),
-              // The background color of the hour/minute input boxes
-              hourMinuteColor: widget.secondayColor ??
+              dialHandColor: widget.secondayColor ??
                   MihColors.secondary(darkMode: widget.darkMode),
+              // The background color of the hour/minute input boxes
+              hourMinuteColor: WidgetStateColor.resolveWith((states) {
+                if (states.contains(WidgetState.selected)) {
+                  return widget.secondayColor ??
+                      MihColors.secondary(
+                          darkMode: widget
+                              .darkMode); // lighter when selected (image 2 hour box)
+                }
+                return widget.primaryColor ??
+                    MihColors.primary(
+                        darkMode: widget
+                            .darkMode); // lighter when selected (image 2 hour box)
+              }),
               // The text color inside the hour/minute input boxes
-              hourMinuteTextColor: widget.primaryColor ??
-                  MihColors.primary(darkMode: widget.darkMode),
+              hourMinuteTextColor: WidgetStateColor.resolveWith((states) {
+                if (states.contains(WidgetState.selected)) {
+                  return widget.primaryColor ??
+                      MihColors.primary(
+                          darkMode: widget
+                              .darkMode); // lighter when selected (image 2 hour box)
+                }
+                return widget.secondayColor ??
+                    MihColors.secondary(darkMode: widget.darkMode);
+              }),
               // The color of the keyboard/clock toggle icon
               entryModeIconColor: widget.secondayColor ??
                   MihColors.secondary(darkMode: widget.darkMode),