fix: map attribution and other styling (#22303)

* chore: map widget and page styling

* fix: map bottom sheet styling

* fix: attribution location on android

it appears that on android, the attribution marker is positioned from the top of the display and on iOS its positioned from the safe area edge

mobile/lib/presentation/pages/drift_map.page.dart

@@ -25,9 +25,10 @@ class DriftMapPage extends StatelessWidget {
               onPressed: () => context.pop(),
               icon: const Icon(Icons.arrow_back_ios_new_rounded),
               style: IconButton.styleFrom(
-                shape: const CircleBorder(side: BorderSide(width: 1, color: Colors.black26)),
                 padding: const EdgeInsets.all(8),
-                backgroundColor: Colors.indigo.withValues(alpha: 0.7),
+                backgroundColor: Colors.indigo,
+                shadowColor: Colors.black26,
+                elevation: 4,
               ),
             ),
           ),

mobile/lib/presentation/widgets/bottom_sheet/map_bottom_sheet.widget.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/bottom_sheet/base_bottom_sheet.widget.dart';
 import 'package:immich_mobile/presentation/widgets/map/map.state.dart';
 import 'package:immich_mobile/presentation/widgets/timeline/timeline.widget.dart';
@@ -10,13 +11,14 @@ class MapBottomSheet extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return const BaseBottomSheet(
+    return BaseBottomSheet(
       initialChildSize: 0.25,
       maxChildSize: 0.9,
       shouldCloseOnMinExtent: false,
       resizeOnScroll: false,
       actions: [],
-      slivers: [SliverFillRemaining(hasScrollBody: false, child: _ScopedMapTimeline())],
+      backgroundColor: context.themeData.colorScheme.surface,
+      slivers: [const SliverFillRemaining(hasScrollBody: false, child: _ScopedMapTimeline())],
     );
   }
 }

mobile/lib/presentation/widgets/map/map.widget.dart

@@ -1,5 +1,6 @@
 import 'dart:async';
 import 'dart:io';
+import 'dart:math';
 
 import 'package:flutter/material.dart';
 import 'package:fluttertoast/fluttertoast.dart';
@@ -9,8 +10,8 @@ import 'package:immich_mobile/extensions/asyncvalue_extensions.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/bottom_sheet/map_bottom_sheet.widget.dart';
-import 'package:immich_mobile/presentation/widgets/map/map_utils.dart';
 import 'package:immich_mobile/presentation/widgets/map/map.state.dart';
+import 'package:immich_mobile/presentation/widgets/map/map_utils.dart';
 import 'package:immich_mobile/utils/async_mutex.dart';
 import 'package:immich_mobile/utils/debounce.dart';
 import 'package:immich_mobile/widgets/common/immich_toast.dart';
@@ -187,6 +188,8 @@ class _Map extends StatelessWidget {
           styleString: style,
           onMapCreated: onMapCreated,
           onStyleLoadedCallback: onMapReady,
+          attributionButtonPosition: AttributionButtonPosition.topRight,
+          attributionButtonMargins: Platform.isIOS ? const Point(40, 12) : const Point(40, 72),
         ),
       ),
     );