lib/core/widgets/animations/rotation_planet.dart

@@ -0,0 +1,51 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+
+class RotationPlanet extends StatefulWidget {
+  const RotationPlanet({super.key, required this.child});
+
+  final Widget child;
+
+  @override
+  State<RotationPlanet> createState() => _RotationPlanetState();
+}
+
+class _RotationPlanetState extends State<RotationPlanet>
+    with SingleTickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<double> _animation;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(
+      vsync: this,
+      duration: Duration(seconds: 200 + Random().nextInt(300)),
+    );
+    _animation = Tween<double>(
+      begin: 0,
+      end: Random().nextBool() ? 1 : -1,
+    ).animate(CurvedAnimation(parent: _controller, curve: Curves.linear));
+    _controller.repeat();
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AnimatedBuilder(
+      animation: _controller,
+      child: widget.child,
+      builder: (context, child) => RotationTransition(
+        turns: _animation,
+        alignment: Alignment.center,
+        child: child,
+      ),
+    );
+  }
+}

lib/features/home/presentation/ui/home_page.dart

@@ -44,19 +44,18 @@ class HomePage extends StatelessWidget {
 
   Widget _music(BuildContext context) {
     return PositionedDirectional(
-      top: setPlatform(android: MySpaces.s36, iOS: MySpaces.s0),
+      top: setPlatform(android: MySpaces.s36, iOS: 50),
       end: MySpaces.s16,
-      child: SafeArea(
-        child: SlideDownFade(
-          delay: Duration(milliseconds: 200),
-          child: StreamBuilder<double>(
-            initialData: 1,
-            stream: context.read<HomeBloc>().volumeStream,
-            builder: (context, snapshot) => MyInkwell(
-              onTap: () => context.read<HomeBloc>().changeMute(),
-              child: MyImage(
-                image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
-              ),
+      child: SlideDownFade(
+        delay: Duration(milliseconds: 200),
+        child: StreamBuilder<double>(
+          initialData: 1,
+          stream: context.read<HomeBloc>().volumeStream,
+          builder: (context, snapshot) => MyInkwell(
+            onTap: () => context.read<HomeBloc>().changeMute(),
+            child: MyImage(
+              image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
+              size: setSize(context: context, tablet: 100),
             ),
           ),
         ),
@@ -101,6 +100,7 @@ class HomePage extends StatelessWidget {
                 onTap: () => context.read<HomeBloc>().goToLanguagePage(context),
                 child: MyImage(
                   image: MyAssets.language,
+                  size: setSize(context: context, tablet: 100),
                 ),
               ),
               MyYellowButton(
@@ -111,6 +111,7 @@ class HomePage extends StatelessWidget {
                 onTap: () => context.read<HomeBloc>().showAboutUs(context),
                 child: MyImage(
                   image: MyAssets.theme,
+                  size: setSize(context: context, tablet: 100),
                 ),
               ),
             ],

lib/features/level/presentation/bloc/level_bloc.dart

@@ -9,8 +9,10 @@ import 'package:hadi_hoda_flutter/core/params/level_params.dart';
 import 'package:hadi_hoda_flutter/core/routers/my_routes.dart';
 import 'package:hadi_hoda_flutter/core/services/audio_service.dart';
 import 'package:hadi_hoda_flutter/core/status/base_status.dart';
+import 'package:hadi_hoda_flutter/core/utils/context_provider.dart';
 import 'package:hadi_hoda_flutter/core/utils/local_storage.dart';
 import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
+import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
 import 'package:hadi_hoda_flutter/features/level/domain/entity/level_entity.dart';
 import 'package:hadi_hoda_flutter/features/level/domain/entity/level_location.dart';
 import 'package:hadi_hoda_flutter/features/level/domain/usecases/get_levels_usecase.dart';
@@ -44,33 +46,134 @@ class LevelBloc extends Bloc<LevelEvent, LevelState> {
 
   /// ------------Variables------------
   final List<LevelLocation> locationList = [
-    LevelLocation(bottom: 0.13.h, left: 0.2.w, index: 0),
-    LevelLocation(bottom: 0.25.h, left: 0.43.w, index: 1),
-    LevelLocation(bottom: 0.35.h, left: 0.22.w, index: 2),
-    LevelLocation(bottom: 0.5.h, left: 0.35.w, index: 3),
-    LevelLocation(bottom: 0.57.h, left: 0.6.w, index: 4),
-    LevelLocation(bottom: 0.65.h, left: 0.8.w, index: 5),
-    LevelLocation(bottom: 0.8.h, left: 0.82.w, index: 6),
-    LevelLocation(bottom: 1.0.h, left: 0.76.w, index: 7),
-    LevelLocation(bottom: 1.15.h, left: 0.6.w, index: 8),
-    LevelLocation(bottom: 1.2.h, left: 0.3.w, index: 9),
-    LevelLocation(bottom: 1.3.h, left: 0.07.w, index: 10),
-    LevelLocation(bottom: 1.38.h, left: 0.3.w, index: 11),
-    LevelLocation(bottom: 1.44.h, left: 0.55.w, index: 12),
-    LevelLocation(bottom: 1.54.h, left: 0.68.w, index: 13),
-    LevelLocation(bottom: 1.63.h, left: 0.6.w, index: 14),
-    LevelLocation(bottom: 1.75.h, left: 0.63.w, index: 15),
-    LevelLocation(bottom: 1.84.h, left: 0.43.w, index: 16),
-    LevelLocation(bottom: 1.82.h, left: 0.17.w, index: 17),
-    LevelLocation(bottom: 1.96.h, left: 0.05.w, index: 18),
-    LevelLocation(bottom: 2.08.h, left: 0.1.w, index: 19),
-    LevelLocation(bottom: 2.14.h, left: 0.3.w, index: 20),
-    LevelLocation(bottom: 2.24.h, left: 0.35.w, index: 21),
-    LevelLocation(bottom: 2.35.h, left: 0.2.w, index: 22),
-    LevelLocation(bottom: 2.44.h, left: 0.14.w, index: 23),
-    LevelLocation(bottom: 2.55.h, left: 0.28.w, index: 24),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: -0.03.h, tablet: -0.03.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.1.w, tablet: 0.2.w),
+      index: 0,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.03.h, tablet: 0.1.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.28.w, tablet: 0.4.w),
+      index: 1,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.1.h, tablet: 0.21.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.14.w, tablet: 0.2.w),
+      index: 2,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.2.h, tablet: 0.38.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.3.w, tablet: 0.3.w),
+      index: 3,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.24.h, tablet: 0.47.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.5.w, tablet: 0.5.w),
+      index: 4,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.33.h, tablet: 0.55.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.65.w, tablet: 0.8.w),
+      index: 5,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.45.h, tablet: 0.8.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.57.w, tablet: 0.8.w),
+      index: 6,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.55.h, tablet: 1.1.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.57.w, tablet: 0.77.w),
+      index: 7,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.6.h, tablet: 1.2.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.4.w, tablet: 0.65.w),
+      index: 8,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.63.h, tablet: 1.25.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.2.w, tablet: 0.3.w),
+      index: 9,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.7.h, tablet: 1.38.h),
+      left: setSize(context: ContextProvider.context, mobile: 0, tablet: 0.04.w),
+      index: 10,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.75.h, tablet: 1.46.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.15.w, tablet: 0.22.w),
+      index: 11,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.78.h, tablet: 1.52.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.4.w, tablet: 0.45.w),
+      index: 12,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.85.h, tablet: 1.68.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.5.w, tablet: 0.68.w),
+      index: 13,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 0.94.h, tablet: 1.8.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.45.w, tablet: 0.6.w),
+      index: 14,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.02.h, tablet: 1.95.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.45.w, tablet: 0.6.w),
+      index: 15,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.02.h, tablet: 2.01.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.2.w, tablet: 0.4.w),
+      index: 16,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.02.h, tablet: 2.0.h),
+      left: setSize(context: ContextProvider.context, mobile: 0, tablet: 0.1.w),
+      index: 17,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.1.h, tablet: 2.17.h),
+      left: setSize(context: ContextProvider.context, mobile: 0, tablet: 0.04.w),
+      index: 18,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.2.h, tablet: 2.32.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.05.w, tablet: 0.1.w),
+      index: 19,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.23.h, tablet: 2.35.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.23.w, tablet: 0.25.w),
+      index: 20,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.31.h, tablet: 2.5.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.2.w, tablet: 0.33.w),
+      index: 21,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.37.h, tablet: 2.6.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.1.w, tablet: 0.2.w),
+      index: 22,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.45.h, tablet: 2.7.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.1.w, tablet: 0.1.w),
+      index: 23,
+    ),
+    LevelLocation(
+      bottom: setSize(context: ContextProvider.context, mobile: 1.5.h, tablet: 2.8.h),
+      left: setSize(context: ContextProvider.context, mobile: 0.2.w, tablet: 0.15.w),
+      index: 24,
+    ),
   ];
 
+
   final List<LevelEntity> levelList = [];
 
   late final Stream<double> volumeStream;

lib/features/level/presentation/ui/level_page.dart

@@ -5,6 +5,7 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_audios.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
 import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
 import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
+import 'package:hadi_hoda_flutter/core/widgets/animations/rotation_planet.dart';
 import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart';
 import 'package:hadi_hoda_flutter/core/widgets/inkwell/my_inkwell.dart';
 import 'package:hadi_hoda_flutter/core/widgets/pop_scope/my_pop_scope.dart';
@@ -22,7 +23,7 @@ class LevelPage extends StatelessWidget {
 
 
 
-  @override
+   @override
   Widget build(BuildContext context) {
     return Scaffold(
       body: MyPopScope(
@@ -35,9 +36,8 @@ class LevelPage extends StatelessWidget {
               child: Stack(
                 alignment: Alignment.center,
                 children: [
-                  _background(),
+                  _background(context),
                   _path(context),
-                  _levelLocation(context),
                   _planets(context),
                 ],
               ),
@@ -56,84 +56,104 @@ class LevelPage extends StatelessWidget {
         alignment: Alignment.center,
         children: [
           Positioned(
-            bottom: 0.3.h,
+            bottom: 0.2.h,
             right: setSize(context: context, mobile: -40, tablet: -80),
-            child: MyImage(
-              image: MyAssets.planet1,
-              size: setSize(context: context, mobile: 180),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet1,
+                size: setSize(context: context, mobile: 180),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 0.65.h, tablet: 0.9.h),
-            child: MyImage(
-              image: MyAssets.planet2,
-              size: setSize(context: context, mobile: 110),
+            bottom: setSize(context: context, mobile: 0.5.h, tablet: 0.8.h),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet2,
+                size: setSize(context: context, mobile: 110),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 0.8.h, tablet: 1.15.h),
+            bottom: setSize(context: context, mobile: 0.55.h, tablet: 0.9.h),
             left: setSize(context: context, mobile: -120, tablet: -200),
-            child: MyImage(
-              image: MyAssets.planet3,
-              size: setSize(context: context, mobile: 300),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet3,
+                size: setSize(context: context, mobile: 250),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 1.3.h, tablet: 1.75.h),
-            right: 40,
-            child: MyImage(
-              image: MyAssets.planet4,
-              size: setSize(context: context, mobile: 120),
+            bottom: setSize(context: context, mobile: 0.85.h, tablet: 1.4.h),
+            right: 30,
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet4,
+                size: setSize(context: context, mobile: 100),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 1.5.h, tablet: 2.0.h),
+            bottom: setSize(context: context, mobile: 0.95.h, tablet: 1.65.h),
             left: setSize(context: context, mobile: -130, tablet: -220),
-            child: MyImage(
-              image: MyAssets.planet5,
-              size: setSize(context: context, mobile: 300),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet5,
+                size: setSize(context: context, mobile: 250),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 1.85.h, tablet: 2.55.h),
+            bottom: setSize(context: context, mobile: 1.25.h, tablet: 2.1.h),
             right: setSize(context: context, mobile: 20, tablet: 20),
-            child: MyImage(
-              image: MyAssets.planet6,
-              size: setSize(context: context, mobile: 80),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet6,
+                size: setSize(context: context, mobile: 60),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 1.95.h, tablet: 2.6.h),
-            child: MyImage(
-              image: MyAssets.planet7,
-              size: setSize(context: context, mobile: 120),
+            bottom: setSize(context: context, mobile: 1.28.h, tablet: 2.2.h),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet7,
+                size: setSize(context: context, mobile: 100),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 2.1.h, tablet: 2.8.h),
+            bottom: setSize(context: context, mobile: 1.4.h, tablet: 2.3.h),
             right: setSize(context: context, mobile: -50, tablet: -120),
-            child: MyImage(
-              image: MyAssets.planet8,
-              size: setSize(context: context, mobile: 250),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet8,
+                size: setSize(context: context, mobile: 200),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 2.3.h, tablet: 3.1.h),
+            bottom: setSize(context: context, mobile: 1.5.h, tablet: 2.6.h),
             left: -20,
-            child: MyImage(
-              image: MyAssets.planet9,
-              size: setSize(context: context, mobile: 100),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet9,
+                size: setSize(context: context, mobile: 100),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 2.5.h, tablet: 3.4.h),
-            child: MyImage(
-              image: MyAssets.planet10,
-              size: setSize(context: context, mobile: 60),
+            bottom: setSize(context: context, mobile: 1.58.h, tablet: 2.8.h),
+            child: RotationPlanet(
+              child: MyImage(
+                image: MyAssets.planet10,
+                size: setSize(context: context, mobile: 60),
+              ),
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 2.55.h, tablet: 3.45.h),
+            bottom: setSize(context: context, mobile: 1.65.h, tablet: 2.9.h),
             right: 20,
             child: MyImage(
               image: MyAssets.satellite,
@@ -141,11 +161,11 @@ class LevelPage extends StatelessWidget {
             ),
           ),
           Positioned(
-            bottom: setSize(context: context, mobile: 2.6.h, tablet: 3.5.h),
-            left: setSize(context: context, mobile: 40),
+            bottom: setSize(context: context, mobile: 1.7.h, tablet: 2.9.h),
+            left: setSize(context: context, mobile: 80, tablet: 0.2.w),
             child: MyImage(
               image: MyAssets.planetFinal,
-              size: setSize(context: context, mobile: 300),
+              size: setSize(context: context, mobile: 250),
             ),
           ),
         ],
@@ -153,19 +173,57 @@ class LevelPage extends StatelessWidget {
     );
   }
 
-  Positioned _path(BuildContext context) {
+  Widget _path(BuildContext context) {
     return Positioned.fill(
-      top: setSize(context: context, mobile: 0.3.h, tablet: 0.37.h),
-      bottom: setSize(context: context, mobile: 0.15.h, tablet: 200),
-      left: MySpaces.s30,
-      right: MySpaces.s30,
-      child: LevelPath(
-        width: setSize(context: context, tablet: 0.45.w, mobile: 0.9.w) ?? 0,
-        height: setSize(context: context, tablet: 1.75.h, mobile: 2.55.h) ?? 0,
+      top: 250,
+      bottom: 150,
+      right: 60,
+      left: 60,
+      child: Stack(
+        alignment: Alignment.center,
+        children: [
+          Positioned.fill(
+            child: LevelPath(),
+          ),
+          Positioned.fill(child: _levelLocation(context)),
+        ],
       ),
     );
   }
 
+   Widget _levelLocation(BuildContext context) {
+     return BlocBuilder<LevelBloc, LevelState>(
+       builder: (context, state) => Stack(
+         clipBehavior: Clip.none,
+         children: [
+           ...List.generate(
+             context.read<LevelBloc>().levelList.length,
+                 (index) => Positioned(
+               top: context.read<LevelBloc>().locationList[index].top,
+               bottom: context.read<LevelBloc>().locationList[index].bottom,
+               right: context.read<LevelBloc>().locationList[index].right,
+               left: context.read<LevelBloc>().locationList[index].left,
+               child: BlocBuilder<LevelBloc, LevelState>(
+                 buildWhen: (previous, current) =>
+                 previous.chooseLevel?.id != current.chooseLevel?.id,
+                 builder: (context, state) => LevelWidget(
+                   chooseLevel: state.chooseLevel,
+                   level: context.read<LevelBloc>().levelList[index],
+                   type: context.read<LevelBloc>().getLevelType(index + 1),
+                   onTap: (LevelEntity level, LevelType type) {
+                     context.read<LevelBloc>().add(
+                       ChooseLevelEvent(level, type),
+                     );
+                   },
+                 ),
+               ),
+             ),
+           ),
+         ],
+       ),
+     );
+   }
+
    Widget _playButton(BuildContext context) {
      return BlocBuilder<LevelBloc, LevelState>(
          buildWhen: (previous, current) =>
@@ -187,80 +245,42 @@ class LevelPage extends StatelessWidget {
     return Positioned(
       left: MySpaces.s16,
       right: MySpaces.s16,
-      top: setPlatform(android: MySpaces.s20, iOS: MySpaces.s0),
-      child: SafeArea(
-        child: Row(
-          spacing: MySpaces.s16,
-          children: [
-            MyInkwell(
-              onTap: () => context.read<LevelBloc>().goToHomePage(context),
-              audio: MyAudios.back,
-              child: MyImage(
-                image: MyAssets.homeButton,
-              ),
-            ),
-            Spacer(),
-            DiamondLevel(
-              diamonds: context.read<LevelBloc>().diamonds,
+      top: setPlatform(android: MySpaces.s20, iOS: 50),
+      child: Row(
+        spacing: MySpaces.s16,
+        children: [
+          MyInkwell(
+            onTap: () => context.read<LevelBloc>().goToHomePage(context),
+            audio: MyAudios.back,
+            child: MyImage(
+              image: MyAssets.homeButton,
+              size: setSize(context: context, tablet: 80),
             ),
-            StreamBuilder<double>(
-              initialData: 1,
-              stream: context.read<LevelBloc>().volumeStream,
-              builder: (context, snapshot) => MyInkwell(
-                onTap: () => context.read<LevelBloc>().changeMute(),
-                child: MyImage(
-                  image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
-                ),
+          ),
+          Spacer(),
+          DiamondLevel(
+            diamonds: context.read<LevelBloc>().diamonds,
+          ),
+          StreamBuilder<double>(
+            initialData: 1,
+            stream: context.read<LevelBloc>().volumeStream,
+            builder: (context, snapshot) => MyInkwell(
+              onTap: () => context.read<LevelBloc>().changeMute(),
+              child: MyImage(
+                image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
+                size: setSize(context: context, tablet: 80),
               ),
             ),
-          ],
-        ),
+          ),
+        ],
       ),
     );
   }
 
-  Widget _background() {
-    return Stack(
-      children: [
-        MyImage(
-          image: MyAssets.mapBackground,
-          fit: BoxFit.cover,
-        ),
-      ],
-    );
-  }
-
-  Widget _levelLocation(BuildContext context) {
-    return BlocBuilder<LevelBloc, LevelState>(
-      builder: (context, state) => Positioned.fill(
-        child: Stack(
-          children: [
-            ...List.generate(
-              context.read<LevelBloc>().levelList.length,
-              (index) => Positioned(
-                top: context.read<LevelBloc>().locationList[index].top,
-                bottom: context.read<LevelBloc>().locationList[index].bottom,
-                right: context.read<LevelBloc>().locationList[index].right,
-                left: context.read<LevelBloc>().locationList[index].left,
-                child: BlocBuilder<LevelBloc, LevelState>(
-                  buildWhen: (previous, current) =>
-                      previous.chooseLevel?.id != current.chooseLevel?.id,
-                  builder: (context, state) => LevelWidget(
-                    chooseLevel: state.chooseLevel,
-                    level: context.read<LevelBloc>().levelList[index],
-                    type: context.read<LevelBloc>().getLevelType(index + 1),
-                    onTap: (LevelEntity level, LevelType type) {
-                      context.read<LevelBloc>().add(
-                        ChooseLevelEvent(level, type),
-                      );
-                    },
-                  ),
-                ),
-              ),
-            ),
-          ],
-        ),
-      ),
+  Widget _background(BuildContext context) {
+    return MyImage(
+      image: MyAssets.mapBackground,
+      fit: BoxFit.cover,
     );
   }
 }

lib/features/level/presentation/ui/widgets/diamond_level.dart

@@ -4,6 +4,7 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_colors.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_text_style.dart';
 import 'package:hadi_hoda_flutter/core/utils/gap.dart';
+import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
 import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart';
 
 class DiamondLevel extends StatelessWidget {
@@ -16,12 +17,18 @@ class DiamondLevel extends StatelessWidget {
     return Stack(
       alignment: Alignment.center,
       children: [
-        MyImage(image: MyAssets.diamondContainer),
+        MyImage(
+          image: MyAssets.diamondContainer,
+          size: setSize(context: context, tablet: 80),
+        ),
         Row(
           mainAxisAlignment: MainAxisAlignment.center,
           crossAxisAlignment: CrossAxisAlignment.center,
           children: [
-            MyImage(image: MyAssets.diamondBig, size: 42),
+            MyImage(
+              image: MyAssets.diamondBig,
+              size: setSize(context: context, mobile: 42, tablet: 60),
+            ),
             MySpaces.s16.gapWidth,
             ShaderMask(
               blendMode: BlendMode.modulate,

lib/features/level/presentation/ui/widgets/level_path.dart

@@ -4,12 +4,10 @@ import 'package:path_drawing/path_drawing.dart';
 class LevelPath extends StatelessWidget {
   const LevelPath({
     super.key,
-    required this.width,
-    required this.height
   });
 
-  final double width;
-  final double height;
+  final double width = 357;
+  final double height = 2230;
 
   @override
   Widget build(BuildContext context) {

lib/features/level/presentation/ui/widgets/level_widget.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_colors.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_text_style.dart';
+import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
 import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart';
 import 'package:hadi_hoda_flutter/features/level/domain/entity/level_entity.dart';
 
@@ -51,7 +52,11 @@ class LevelWidget extends StatelessWidget {
         alignment: Alignment.topCenter,
         clipBehavior: Clip.none,
         children: [
-          MyImage(image: LevelType.image[type] ?? MyAssets.level, size: 46),
+          MyImage(
+            image: LevelType.image[type] ?? MyAssets.level,
+            fit: BoxFit.cover,
+            size: setSize(context: context, tablet: 70, mobile: 44),
+          ),
           ShaderMask(
             blendMode: BlendMode.modulate,
             shaderCallback: (bounds) => LinearGradient(
@@ -66,7 +71,7 @@ class LevelWidget extends StatelessWidget {
               '${level.order ?? 0}',
               maxLines: 1,
               style: MYTextStyle.button1.copyWith(
-                fontSize: 24,
+                fontSize: setSize(context: context, mobile: 24, tablet: 34),
                 shadows: [
                   BoxShadow(
                     color: LevelType.textShadowColor[type] ?? MyColors.white,
@@ -78,18 +83,18 @@ class LevelWidget extends StatelessWidget {
           ),
           if(level.id == chooseLevel?.id)
             Positioned(
-              top: -20,
+              top: setSize(context: context, mobile: -20, tablet: -30),
               child: MyImage(
                 image: MyAssets.location,
-                size: 26,
+                size: setSize(context: context,mobile: 26, tablet: 40),
               ),
             ),
           if(type == LevelType.finished)
             Positioned(
               bottom: 0,
               child: Container(
-                height: 17,
-                width: 17,
+                height: setSize(context: context, mobile: 17, tablet: 24),
+                width: setSize(context: context, mobile: 17, tablet: 24),
                 padding: EdgeInsets.all(3),
                 decoration: BoxDecoration(
                   shape: BoxShape.circle,

lib/features/question/presentation/ui/question_page.dart

@@ -29,7 +29,6 @@ class QuestionPage extends StatelessWidget {
             horizontal: setSize(context: context,
                 mobile: MySpaces.s16,
                 tablet: MySpaces.s30) ?? 0,
-            vertical: setPlatform(android: MySpaces.s20) ?? 0,
           ),
           decoration: BoxDecoration(
             gradient: LinearGradient(
@@ -47,29 +46,28 @@ class QuestionPage extends StatelessWidget {
               ),
             ),
           ),
-          child: SafeArea(
-            bottom: false,
-            child: Column(
-              children: [
-                _topButtons(context),
-                MySpaces.s10.gapHeight,
-                Expanded(
-                  child: BlocBuilder<QuestionBloc, QuestionState>(
-                    buildWhen: (previous, current) =>
-                    (previous.currentQuestion?.order !=
-                        current.currentQuestion?.order),
-                    builder: (context, state) {
-                      if (state.currentQuestion?.order ==
-                          state.levelEntity?.questions?.length) {
-                        return DiamondScreen();
-                      } else {
-                        return QuestionScreen();
-                      }
-                    },
-                  ),
+          child: Column(
+            children: [
+              setPlatform<double>(android: MySpaces.s20, iOS: 50)?.gapHeight ?? SizedBox.shrink(),
+              _topButtons(context),
+              MySpaces.s10.gapHeight,
+              Expanded(
+                child: BlocBuilder<QuestionBloc, QuestionState>(
+                  buildWhen: (previous, current) =>
+                  (previous.currentQuestion?.order !=
+                      current.currentQuestion?.order),
+                  builder: (context, state) {
+                    if (state.currentQuestion?.order ==
+                        state.levelEntity?.questions?.length) {
+                      return DiamondScreen();
+                    } else {
+                      return QuestionScreen();
+                    }
+                  },
                 ),
-              ],
-            ),
+              ),
+              setPlatform<double>(android: MySpaces.s20,)?.gapHeight  ?? SizedBox.shrink(),
+            ],
           ),
         ),
       ),

lib/features/question/presentation/ui/screens/diamond_screen.dart

@@ -7,6 +7,7 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_colors.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_text_style.dart';
+import 'package:hadi_hoda_flutter/core/utils/gap.dart';
 import 'package:hadi_hoda_flutter/core/utils/my_localization.dart';
 import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
 import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
@@ -143,6 +144,7 @@ class DiamondScreen extends StatelessWidget {
             _buttons(context),
           ],
         ),
+        MySpaces.s20.gapHeight,
       ],
     );
   }