improve mouse hover effects on click areas

lib/components/gesture.dart

@@ -41,13 +41,29 @@ class AnimatedTapRegion extends StatefulWidget {
 }
 
 class _AnimatedTapRegionState extends State<AnimatedTapRegion> {
+  bool isScaled = false;
+
   bool isHovered = false;
 
   @override
   Widget build(BuildContext context) {
     return MouseRegion(
-      onEnter: (_) => setState(() => isHovered = true),
+      onEnter: (_) {
-      onExit: (_) => setState(() => isHovered = false),
+        isHovered = true;
+        if (!isScaled) {
+          Future.delayed(const Duration(milliseconds: 100), () {
+            if (isHovered) {
+              setState(() => isScaled = true);
+            }
+          });
+        }
+      },
+      onExit: (_) {
+        isHovered = false;
+        if(isScaled) {
+          setState(() => isScaled = false);
+        }
+      },
       child: GestureDetector(
         onTap: widget.onTap,
         child: ClipRRect(
@@ -55,7 +71,7 @@ class _AnimatedTapRegionState extends State<AnimatedTapRegion> {
           clipBehavior: Clip.antiAlias,
           child: AnimatedScale(
             duration: _fastAnimationDuration,
-            scale: isHovered ? 1.1 : 1,
+            scale: isScaled ? 1.1 : 1,
             child: widget.child,
           ),
         ),

lib/pages/home_page.dart

@@ -264,7 +264,8 @@ class _HistoryState extends State<_History> {
                     scrollDirection: Axis.horizontal,
                     itemCount: history.length,
                     itemBuilder: (context, index) {
-                      return InkWell(
+                      return AnimatedTapRegion(
+                        borderRadius: 8,
                         onTap: () {
                           context.to(
                             () => ComicPage(
@@ -273,11 +274,9 @@ class _HistoryState extends State<_History> {
                             ),
                           );
                         },
-                        borderRadius: BorderRadius.circular(8),
                         child: Container(
                           width: 92,
                           height: 114,
-                          margin: const EdgeInsets.symmetric(horizontal: 8),
                           decoration: BoxDecoration(
                             borderRadius: BorderRadius.circular(8),
                             color: Theme.of(context)
@@ -293,7 +292,7 @@ class _HistoryState extends State<_History> {
                             filterQuality: FilterQuality.medium,
                           ),
                         ),
-                      );
+                      ).paddingHorizontal(8);
                     },
                   ),
                 ).paddingHorizontal(8).paddingBottom(16),
@@ -386,15 +385,14 @@ class _LocalState extends State<_Local> {
                     scrollDirection: Axis.horizontal,
                     itemCount: local.length,
                     itemBuilder: (context, index) {
-                      return InkWell(
+                      return AnimatedTapRegion(
                         onTap: () {
                           local[index].read();
                         },
-                        borderRadius: BorderRadius.circular(8),
+                        borderRadius: 8,
                         child: Container(
                           width: 92,
                           height: 114,
-                          margin: const EdgeInsets.symmetric(horizontal: 8),
                           decoration: BoxDecoration(
                             borderRadius: BorderRadius.circular(8),
                             color: Theme.of(context)
@@ -412,7 +410,7 @@ class _LocalState extends State<_Local> {
                             filterQuality: FilterQuality.medium,
                           ),
                         ),
-                      );
+                      ).paddingHorizontal(8);
                     },
                   ),
                 ).paddingHorizontal(8),