resposive profile page

lib/page/profile/profile.dart

 // ignore_for_file: avoid_unnecessary_containers, sized_box_for_whitespace
 
 import 'package:flutter/material.dart';
+import 'package:tour_travel_agr/helper/widget_responsive.dart';
 import 'package:tour_travel_agr/resource/assets.dart';
 import 'package:tour_travel_agr/resource/colors.dart';
+import 'package:tour_travel_agr/resource/routes.dart';
 import 'package:tour_travel_agr/resource/size.dart';
 import 'package:tour_travel_agr/resource/style.dart';
 
@@ -13,9 +15,25 @@ class ProfileView extends StatelessWidget {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: ColorManager.backgroundColor,
-      body: Stack(
+      body: ScreenResponsive(
+        widget: const BodyWidget(),
+        widthScreen: MediaQuery.of(context).size.width,
+      ),
+    );
+  }
+}
+
+class BodyWidget extends StatelessWidget {
+  const BodyWidget({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
       children: [
         Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
           children: [
             Container(
               width: double.infinity,
@@ -94,6 +112,7 @@ class ProfileView extends StatelessWidget {
                     height: 40,
                   ),
                   Row(
+                    mainAxisAlignment: MainAxisAlignment.center,
                     children: [
                       Image(
                         width: 20,
@@ -113,6 +132,38 @@ class ProfileView extends StatelessWidget {
                 ],
               ),
             ),
+            GestureDetector(
+              onTap: () {
+                Navigator.pop(context);
+              },
+              child: Container(
+                padding: EdgeInsets.symmetric(
+                  horizontal: AppPadding.p20,
+                ),
+                margin: EdgeInsets.only(
+                  top: AppMargin.m6,
+                ),
+                child: const Icon(Icons.arrow_back),
+              ),
+            ),
+            GestureDetector(
+              onTap: () {
+                Navigator.pushNamed(
+                  context,
+                  Routes.changePasswordRoute,
+                );
+              },
+              child: PorfileButton(
+                marginTop: 10,
+                icon: Assets.passwordIcon,
+                text: "Ganti Password",
+              ),
+            ),
+            PorfileButton(
+              marginTop: 16,
+              icon: Assets.logoutGreyIcon,
+              text: "Log Out",
+            ),
           ],
         ),
         Positioned(
@@ -127,6 +178,64 @@ class ProfileView extends StatelessWidget {
           ),
         )
       ],
+    );
+  }
+}
+
+class PorfileButton extends StatelessWidget {
+  const PorfileButton({
+    Key? key,
+    required this.marginTop,
+    required this.text,
+    required this.icon,
+  }) : super(key: key);
+
+  final double marginTop;
+  final String text;
+  final String icon;
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: EdgeInsets.symmetric(
+        horizontal: AppPadding.p20,
+      ),
+      margin: EdgeInsets.only(
+        top: marginTop,
+      ),
+      child: Container(
+        width: double.infinity,
+        height: 50,
+        padding: EdgeInsets.symmetric(
+          horizontal: AppPadding.p20,
+          vertical: AppPadding.p15,
+        ),
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.circular(8),
+          color: const Color.fromARGB(255, 228, 225, 225),
+        ),
+        child: Row(
+          children: [
+            Container(
+              width: 16,
+              height: 20,
+              child: Image(
+                fit: BoxFit.fill,
+                image: AssetImage(
+                  icon,
+                ),
+              ),
+            ),
+            SizedBox(
+              width: AppMargin.m18,
+            ),
+            Text(
+              text,
+              style: getRegularStyle(
+                color: Colors.black,
+              ),
+            )
+          ],
+        ),
       ),
     );
   }