fix: home page responsive

assets/svg/button_2_tablet.svg

@@ -0,0 +1,51 @@
+<svg width="385" height="160" viewBox="0 0 385 160" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_44_94)">
+<path d="M368.206 132.832C367.846 133.142 367.46 133.43 367.05 133.694C334.548 155.577 52.5059 154.804 13.1428 135.151C11.4287 134.41 10.0021 133.287 9.0259 131.91C-4.87761 108.124 2.67003 36.2317 24.7712 20.6817C48.5335 4.03171 332.165 -3.52027 361.489 17.7085C383.12 33.199 393.376 111.068 368.206 132.832Z" fill="url(#paint0_linear_44_94)"/>
+</g>
+<path d="M9.13382 127.183C22.5679 150.225 340.507 152.069 368.205 128.134C393.484 106.37 383.12 28.4718 361.597 12.9516C332.273 -8.21778 48.6414 -0.695533 24.9152 15.9248C2.77792 31.445 -4.76968 103.338 9.13382 127.183Z" fill="url(#paint1_linear_44_94)"/>
+<path d="M19.0661 116.746C31.2723 137.559 326.568 143.505 351.703 121.801C374.562 102.029 365.281 31.2958 345.744 17.2027C319.093 -2.00433 56.8403 11.4941 35.1725 26.5981C15.0576 40.7209 6.42658 95.0714 19.0661 116.746Z" fill="url(#paint2_radial_44_94)"/>
+<path d="M20.0411 113.061C32.2112 133.219 325.774 134.646 350.8 113.685C373.551 94.6565 364.631 31.6539 345.166 18.0663C318.623 -0.48662 57.2014 12.5361 35.7142 26.9859C15.8159 40.7222 7.4738 92.1589 20.0411 113.061Z" fill="url(#paint3_linear_44_94)"/>
+<path d="M23.7234 111.277C35.6046 130.841 322.811 132.238 347.296 111.901C369.577 93.4079 360.802 32.2785 341.77 19.0774C315.841 1.08941 60.0892 13.7256 39.0353 27.9971C19.426 41.0792 11.3728 90.9104 23.7234 111.277Z" fill="url(#paint4_linear_44_94)"/>
+<path style="mix-blend-mode:screen" d="M38.3137 27.9658C38.3137 27.9658 238.596 -5.48297 342.493 19.5516C348.884 26.8199 353.407 35.0856 355.783 43.8428C326.205 51.5749 295.499 55.9951 264.489 56.9844C211.042 58.9765 155.175 34.1203 110.034 30.4038C86.2337 28.1287 62.2609 27.3137 38.3137 27.9658Z" fill="url(#paint5_linear_44_94)"/>
+<path d="M30.802 36.4106C33.9508 31.6749 38.8094 27.8618 44.7055 25.4989C54.456 21.6932 82.1908 17.8577 83.7798 18.8389C85.3687 19.82 70.2735 24.2799 62.437 26.6584C54.6005 29.037 34.7744 38.2243 30.802 36.4106Z" fill="white"/>
+<defs>
+<filter id="filter0_d_44_94" x="3.71933e-05" y="4.72266" width="384.97" height="154.833" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="7.54472"/>
+<feGaussianBlur stdDeviation="1.00596"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_44_94"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_44_94" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_44_94" x1="192.552" y1="150.017" x2="192.552" y2="4.71555" gradientUnits="userSpaceOnUse">
+<stop stop-color="#8B9AD1"/>
+<stop offset="1" stop-color="#CEE0FF"/>
+</linearGradient>
+<linearGradient id="paint1_linear_44_94" x1="192.552" y1="145.29" x2="192.552" y2="-0.0116919" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCFF"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<radialGradient id="paint2_radial_44_94" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(194.864 126.498) scale(136.002 111.972)">
+<stop stop-color="#FFBD00"/>
+<stop offset="1" stop-color="#FF772C"/>
+</radialGradient>
+<linearGradient id="paint3_linear_44_94" x1="189.158" y1="128.819" x2="189.158" y2="8.90876" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFF300"/>
+<stop offset="1" stop-color="#FF9700"/>
+</linearGradient>
+<linearGradient id="paint4_linear_44_94" x1="189.157" y1="126.559" x2="189.157" y2="10.1875" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFCC00"/>
+<stop offset="1" stop-color="#FF9700"/>
+</linearGradient>
+<linearGradient id="paint5_linear_44_94" x1="38.3137" y1="33.5852" x2="355.783" y2="33.5852" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF9840"/>
+<stop offset="0.1" stop-color="#EF8E3C"/>
+<stop offset="0.29" stop-color="#C57531"/>
+<stop offset="0.55" stop-color="#814D20"/>
+<stop offset="0.88" stop-color="#241609"/>
+<stop offset="1"/>
+</linearGradient>
+</defs>
+</svg>

lib/common_ui/resources/my_assets.dart

@@ -4,7 +4,7 @@ class MyAssets {
   factory MyAssets() => _i;
 
   /// PNG, JPG
-  static const String backgroundHome = 'assets/images/background_intro.png';
+  static const String backgroundHome = 'assets/images/background_home.png';
   static const String hadiHoda = 'assets/images/hadi_hoda.png';
   static const String khadijeLogo = 'assets/images/khadije_logo.png';
   static const String pattern = 'assets/images/pattern.png';
@@ -35,6 +35,7 @@ class MyAssets {
   static const String button = 'assets/svg/button.svg';
   static const String buttonTablet = 'assets/svg/button_tablet.svg';
   static const String button2 = 'assets/svg/button_2.svg';
+  static const String button2Tablet = 'assets/svg/button_2_tablet.svg';
   static const String button3 = 'assets/svg/button_3.svg';
   static const String theme = 'assets/svg/theme.svg';
   static const String facebook = 'assets/svg/facebook.svg';

lib/core/widgets/about_us_dialog/about_us_dialog.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:go_router/go_router.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/my_localization.dart';
 import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
 import 'package:hadi_hoda_flutter/core/widgets/about_us_dialog/styles/background.dart';
@@ -33,7 +34,7 @@ class AboutUsDialog extends StatelessWidget {
               horizontal: setSize(
                 context: context,
                 mobile: 18,
-                tablet: 120,
+                tablet: 160,
               ) ?? 0,
             ),
             child: Stack(
@@ -45,16 +46,22 @@ class AboutUsDialog extends StatelessWidget {
                     children: [
                       Text(
                         context.translate.about_us,
+                        style: MYTextStyle.titr3.copyWith(
+                          color: Color(0XFF322386),
+                        ),
                       ),
                       Text(
                         context.translate.about_us_desc,
+                        style: MYTextStyle.matn1.copyWith(
+                          color: Color(0XFF494178),
+                        ),
                       ),
                       MyImage(
                         image: MyAssets.newHorizon,
-                        size: 45,
                       ),
                       MyImage(
                         image: MyAssets.khadijeLogo,
+                        size: 100,
                       ),
                       Row(
                         mainAxisAlignment: MainAxisAlignment.center,
@@ -83,7 +90,7 @@ class AboutUsDialog extends StatelessWidget {
                 ),
                 Positioned(
                   right: setSize(context: context, mobile: 30, tablet: 40),
-                  top: -12,
+                  top:  setSize(context: context, mobile: -12, tablet: -20),
                   child: GestureDetector(
                     onTap: context.pop,
                     behavior: HitTestBehavior.opaque,

lib/core/widgets/about_us_dialog/styles/background.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.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';
 
@@ -13,13 +14,10 @@ class AboutUSDialogBackground extends StatelessWidget {
       clipper: _BottomShapeClipper(),
       child: Container(
         width: context.widthScreen,
-        height: setSize(context: context, mobile: 525, tablet: 740),
-        padding: EdgeInsets.all(
-          setSize(
-            context: context,
-            mobile: 30,
-            tablet: 60,
-          ) ?? 0,
+        height: 525,
+        padding: EdgeInsets.symmetric(
+          vertical: MySpaces.s30,
+          horizontal: setSize(context: context, mobile: MySpaces.s30, tablet: 60) ?? 0,
         ),
         decoration: const BoxDecoration(
           gradient: LinearGradient(

lib/core/widgets/button/my_yellow_button.dart

@@ -0,0 +1,52 @@
+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_spaces.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';
+
+class MyYellowButton extends StatelessWidget {
+  const MyYellowButton({
+    super.key,
+    this.onTap,
+    this.title,
+    this.top,
+  });
+
+  final VoidCallback? onTap;
+  final String? title;
+  final double? top;
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      onTap: onTap,
+      highlightColor: MyColors.transparent,
+      splashColor: MyColors.transparent,
+      child: Stack(
+        alignment: Alignment.center,
+        children: [
+          MyImage(image:
+          setSize(
+            context: context,
+            mobile: MyAssets.button2,
+            tablet: MyAssets.button2Tablet,
+          ) ??
+              '',
+          ),
+          PositionedDirectional(
+            top: top ?? setSize(context: context, mobile: MySpaces.s6, tablet: MySpaces.s22),
+            child: Text(
+              title ?? '',
+              style: MYTextStyle.button1.copyWith(
+                color: Color(0XFFD93D16),
+                fontSize: setSize(context: context, tablet: 60),
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

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

@@ -4,8 +4,8 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart';
 import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.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/widgets/button/enum/button_type.dart';
-import 'package:hadi_hoda_flutter/core/widgets/button/my_button.dart';
+import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
+import 'package:hadi_hoda_flutter/core/widgets/button/my_yellow_button.dart';
 import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart';
 import 'package:hadi_hoda_flutter/features/home/presentation/bloc/home_bloc.dart';
 
@@ -15,7 +15,6 @@ class HomePage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      extendBodyBehindAppBar: true,
       body: DecoratedBox(
         decoration: BoxDecoration(
           image: DecorationImage(
@@ -23,14 +22,12 @@ class HomePage extends StatelessWidget {
             fit: BoxFit.cover,
           ),
         ),
-        child: SizedBox(
-          width: context.widthScreen,
-          height: context.heightScreen,
+        child: SizedBox.expand(
           child: Stack(
             alignment: Alignment.center,
             children: [
               _music(context),
-              _name(context),
+              _image(context),
               _bottomBtns(context),
             ],
           ),
@@ -41,7 +38,7 @@ class HomePage extends StatelessWidget {
 
   Widget _music(BuildContext context) {
     return PositionedDirectional(
-      top: MediaQuery.viewPaddingOf(context).top + MySpaces.s16,
+      top: MySpaces.s36,
       end: MySpaces.s16,
       child: StreamBuilder<double>(
         initialData: 1,
@@ -50,6 +47,7 @@ class HomePage extends StatelessWidget {
           onTap: () => context.read<HomeBloc>().changeMute(),
           child: MyImage(
             image: snapshot.data == 1 ? MyAssets.musicOn : MyAssets.musicOff,
+            size: setSize(context: context, tablet: 100),
           ),
         ),
       ),
@@ -57,20 +55,29 @@ class HomePage extends StatelessWidget {
   }
 
 
-  Positioned _name(BuildContext context) {
+  Positioned _image(BuildContext context) {
     return Positioned(
-      top: 146,
-      child: MyImage(
-        image: MyAssets.hadiHoda,
-        size: 232,
-        fit: BoxFit.cover,
+      top: setSize(context: context, mobile: 0.1.h, tablet: 0.15.h),
+      child: Stack(
+        children: [
+          MyImage(
+            image: MyAssets.hadiHoda,
+          ),
+          PositionedDirectional(
+            start: MySpaces.s10,
+            top: MySpaces.s40,
+            child: MyImage(
+              image: MyAssets.globe,
+            ),
+          ),
+        ],
       ),
     );
   }
 
   Positioned _bottomBtns(BuildContext context) {
     return Positioned(
-      bottom: MediaQuery.viewPaddingOf(context).bottom + MySpaces.s16,
+      bottom: MySpaces.s40,
       left: MySpaces.s16,
       right: MySpaces.s16,
       child: Row(
@@ -81,17 +88,18 @@ class HomePage extends StatelessWidget {
             onTap: () => context.read<HomeBloc>().goToLanguagePage(context),
             child: MyImage(
               image: MyAssets.language,
+              size: setSize(context: context, tablet: 100),
             ),
           ),
-          MyButton(
+          MyYellowButton(
             onTap: () => context.read<HomeBloc>().goToLevelPage(context),
-            type: ButtonType.type2,
             title: context.translate.start,
           ),
           InkWell(
             onTap: () => context.read<HomeBloc>().showAboutUs(context),
             child: MyImage(
               image: MyAssets.theme,
+              size: setSize(context: context, tablet: 100),
             ),
           ),
         ],