fix browser fab animation issues

app/lib/features/geckoview/features/browser/presentation/screens/browser.dart

@@ -342,7 +342,7 @@ class BrowserScreen extends HookConsumerWidget {
               displayedSheet: null,
             ).preferredSize,
           ),
-          floatingActionButton: BrowserFab(),
+          floatingActionButton: const BrowserFab(),
         ),
       ),
     );

app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/browser_fab.dart

@@ -26,6 +26,8 @@ import 'package:weblibre/features/geckoview/features/browser/presentation/contro
 import 'package:weblibre/features/geckoview/features/readerview/domain/providers/readerable.dart';
 
 class BrowserFab extends HookConsumerWidget {
+  const BrowserFab({super.key});
+
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final tabBarDismissed = ref.watch(tabBarDismissableControllerProvider);
@@ -42,22 +44,38 @@ class BrowserFab extends HookConsumerWidget {
       ),
     );
 
-    return Visibility(
+    final Widget child;
-      visible: readerabilityState.active && appearanceButtonVisible,
+    if (readerabilityState.active && appearanceButtonVisible) {
-      replacement: tabBarDismissed
+      child = FloatingActionButton(
-          ? FloatingActionButton(
+        key: const ValueKey('appearance_fab'),
-              child: const Icon(MdiIcons.dockBottom),
+        heroTag: 'appearance_fab',
-              onPressed: () {
-                ref.read(tabBarDismissableControllerProvider.notifier).show();
-              },
-            )
-          : const SizedBox.shrink(),
-      child: FloatingActionButton(
         onPressed: () async {
           await ref.read(readerableServiceProvider).onAppearanceButtonTap();
         },
         child: const Icon(MdiIcons.formatFont),
-      ),
+      );
+    } else if (tabBarDismissed) {
+      child = FloatingActionButton(
+        key: const ValueKey('dock_fab'),
+        heroTag: 'dock_fab',
+        onPressed: () {
+          ref.read(tabBarDismissableControllerProvider.notifier).show();
+        },
+        child: const Icon(MdiIcons.dockBottom),
+      );
+    } else {
+      child = const SizedBox.shrink(key: ValueKey('no_fab'));
+    }
+
+    return AnimatedSwitcher(
+      duration: const Duration(milliseconds: 200),
+      transitionBuilder: (child, animation) {
+        return ScaleTransition(
+          scale: animation,
+          child: child,
+        );
+      },
+      child: child,
     );
   }
 }