diff --git a/.gradle/8.1.1/checksums/checksums.lock b/.gradle/8.1.1/checksums/checksums.lock
index 5d738dc..9bfd332 100644
Binary files a/.gradle/8.1.1/checksums/checksums.lock and b/.gradle/8.1.1/checksums/checksums.lock differ
diff --git a/.gradle/8.1.1/checksums/md5-checksums.bin b/.gradle/8.1.1/checksums/md5-checksums.bin
index 0123b95..6f09f2d 100644
Binary files a/.gradle/8.1.1/checksums/md5-checksums.bin and b/.gradle/8.1.1/checksums/md5-checksums.bin differ
diff --git a/.gradle/8.1.1/checksums/sha1-checksums.bin b/.gradle/8.1.1/checksums/sha1-checksums.bin
index f837589..4d55c2a 100644
Binary files a/.gradle/8.1.1/checksums/sha1-checksums.bin and b/.gradle/8.1.1/checksums/sha1-checksums.bin differ
diff --git a/lib/about.dart b/lib/about.dart
index 8f6387c..b95e68c 100644
--- a/lib/about.dart
+++ b/lib/about.dart
@@ -1,39 +1,49 @@
 import 'package:flutter/material.dart';
 import 'package:url_launcher/link.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 
 class AboutScreen extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
+    ScreenUtil.init(
+      context,
+    );
     return Scaffold(
       appBar: AppBar(
         title: Text('About App'),
       ),
       body: Padding(
-        padding: const EdgeInsets.fromLTRB(50, 0, 40, 70),
+        padding: EdgeInsets.fromLTRB(
+          ScreenUtil().setWidth(50),
+          ScreenUtil().setWidth(0),
+          ScreenUtil().setWidth(40),
+          ScreenUtil().setWidth(70),
+        ),
+        // const EdgeInsets.fromLTRB(50, 0, 40, 70),
         child: Column(
           mainAxisAlignment: MainAxisAlignment.center,
           children: [
             // Image
             Image.asset(
               'assets/logo.png',
-              width: 300,
-              height: 300,
+              width: ScreenUtil().setWidth(250),
+              height: ScreenUtil().setHeight(250),
               fit: BoxFit.contain,
             ),
-            SizedBox(height: 5),
+            SizedBox(height: ScreenUtil().setHeight(05)),
             // Version
             Text(
               'Version 1.0.0',
-              style: TextStyle(fontSize: 18),
+              style: TextStyle(fontSize: ScreenUtil().setSp(16)),
             ),
-            SizedBox(height: 10),
+            SizedBox(height: ScreenUtil().setHeight(10)),
             // App Description
             Text(
               'OpSo',
               textAlign: TextAlign.center,
-              style: TextStyle(fontSize: 16),
+              style: TextStyle(fontSize: ScreenUtil().setSp(16)),
             ),
-            SizedBox(height: 20),
+            SizedBox(height: ScreenUtil().setHeight(20)),
             // GitHub Button
             Link(
               uri: Uri.parse('https://github.com/andoriyaprashant/OpSo'),
@@ -44,7 +54,7 @@ class AboutScreen extends StatelessWidget {
                 label: Text('GitHub'),
               ),
             ),
-            SizedBox(height: 10),
+            SizedBox(height: ScreenUtil().setHeight(10)),
 
             // Link(
             //   uri: Uri.parse('https://gssoc.girlscript.tech/'),
diff --git a/lib/bar.dart b/lib/bar.dart
index 0516ab5..ae6172c 100644
--- a/lib/bar.dart
+++ b/lib/bar.dart
@@ -1,6 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:opso/about.dart';
-import 'package:url_launcher/link.dart';
 import 'package:opso/widgets/book_mark_screen.dart';
 
 class AppBarWidget extends StatelessWidget implements PreferredSizeWidget {
@@ -8,45 +8,51 @@ class AppBarWidget extends StatelessWidget implements PreferredSizeWidget {
 
   @override
   Widget build(BuildContext context) {
+    ScreenUtil.init(
+      context,
+      designSize: const Size(360, 690),
+    );
+
     return Scaffold(
       appBar: AppBar(
-        title: const Text(
+        title: Text(
           'OpSo',
-          style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+          style: TextStyle(
+              fontSize: ScreenUtil().setSp(20), fontWeight: FontWeight.bold),
         ),
         actions: [
           IconButton(
             icon: const Icon(Icons.search),
             onPressed: () {
               showSearch(context: context, delegate: CustomSearchDelegate());
-             },
-           ),
-         ],
+            },
+          ),
+        ],
       ),
       body: Material(
         color: Colors.transparent,
         child: Ink(
-          decoration: const BoxDecoration(
+          decoration: BoxDecoration(
             color: Colors.white,
           ),
           child: InkWell(
             child: Padding(
-              padding: const EdgeInsets.all(16.0),
+              padding: EdgeInsets.all(ScreenUtil().setWidth(16)),
               child: ListView(
                 children: [
-
                   MenuOption(
                     title: 'Bookmarks',
                     onTap: () {
                       Navigator.push(
                         context,
-                        MaterialPageRoute(builder: (context) => const BookMarkScreen()),
+                        MaterialPageRoute(
+                            builder: (context) => const BookMarkScreen()),
                       );
                     },
                   ),
-
-                  const Padding(padding: EdgeInsets.only(top: 40)),
-
+                  Padding(
+                      padding:
+                          EdgeInsets.only(top: ScreenUtil().setHeight(40))),
                   MenuOption(
                     title: 'About',
                     onTap: () {
@@ -56,18 +62,17 @@ class AppBarWidget extends StatelessWidget implements PreferredSizeWidget {
                       );
                     },
                   ),
-
                 ],
               ),
-            ),       
+            ),
           ),
+        ),
       ),
-    )
     );
   }
 
   @override
-  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
+  Size get preferredSize => Size.fromHeight(kToolbarHeight);
 }
 
 class MenuOption extends StatefulWidget {
@@ -100,10 +105,10 @@ class _MenuOptionState extends State<MenuOption> {
         child: Ink(
           decoration: BoxDecoration(
             color: const Color.fromARGB(255, 237, 237, 239),
-            borderRadius: BorderRadius.circular(25),
+            borderRadius: BorderRadius.circular(ScreenUtil().setWidth(25)),
           ),
           child: InkWell(
-            borderRadius: BorderRadius.circular(20),
+            borderRadius: BorderRadius.circular(ScreenUtil().setWidth(20)),
             onTap: () {
               setState(() {
                 _isClicked = !_isClicked;
@@ -112,29 +117,28 @@ class _MenuOptionState extends State<MenuOption> {
             },
             child: Container(
               child: Padding(
-                padding: const EdgeInsets.all(10.0),
+                padding: EdgeInsets.all(ScreenUtil().setWidth(10)),
                 child: Row(
                   mainAxisAlignment: MainAxisAlignment.spaceBetween,
                   children: [
                     Padding(
-                      padding: const EdgeInsets.all(10.0),
+                      padding: EdgeInsets.all(ScreenUtil().setWidth(10)),
                       child: Text(
                         widget.title,
-                        style: const TextStyle(
-                          fontSize: 18,
+                        style: TextStyle(
+                          fontSize: ScreenUtil().setSp(18),
                           fontWeight: FontWeight.bold,
                         ),
                       ),
                     ),
-                  
                     const Icon(Icons.arrow_forward_ios),
                   ],
                 ),
               ),
+            ),
           ),
         ),
       ),
-    )
     );
   }
 }
@@ -145,12 +149,12 @@ class CustomSearchDelegate extends SearchDelegate {
     return [
       query.isNotEmpty
           ? IconButton(
-        icon: const Icon(Icons.clear),
-        onPressed: () {
-          query = '';
-          showSuggestions(context);
-        },
-      )
+              icon: const Icon(Icons.clear),
+              onPressed: () {
+                query = '';
+                showSuggestions(context);
+              },
+            )
           : Container(),
     ];
   }
diff --git a/lib/home_page.dart b/lib/home_page.dart
index 5b3e319..5f365ef 100644
--- a/lib/home_page.dart
+++ b/lib/home_page.dart
@@ -1,4 +1,5 @@
 import 'dart:ui';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
@@ -96,15 +97,23 @@ class _HomePageState extends State<HomePage> {
 
   @override
   Widget build(BuildContext context) {
-    var media = MediaQuery.of(context).size;
+    // var media = MediaQuery.of(context).size;
     Color backgroundColor = Theme.of(context).brightness == Brightness.dark
         ? Colors.black.withOpacity(0.6) // Example dark mode color
         : Colors.white.withOpacity(0.6); // Example light mode color
+
+    ScreenUtil.init(
+      context,
+    );
+    final double appBarFontSize = ScreenUtil().setSp(18);
+    final double appTextFontSize = ScreenUtil().setSp(20);
+    final double SizedSize = ScreenUtil().setHeight(20);
     return Scaffold(
       appBar: AppBar(
-        title: const Text(
+        title: Text(
           'OpSo',
-          style: TextStyle(fontWeight: FontWeight.bold),
+          style:
+              TextStyle(fontWeight: FontWeight.bold, fontSize: appBarFontSize),
         ),
         actions: [
           IconButton(
@@ -143,17 +152,19 @@ class _HomePageState extends State<HomePage> {
                     child: Column(
                       crossAxisAlignment: CrossAxisAlignment.start,
                       children: [
-                        const SizedBox(
+                        SizedBox(
                           height: kTextTabBarHeight,
                           child: Row(
                             mainAxisAlignment: MainAxisAlignment.start,
                             children: [
                               Icon(FontAwesomeIcons.bars),
-                              SizedBox(width: 10),
+                              SizedBox(
+                                width: ScreenUtil().setWidth(100),
+                              ),
                               Text(
                                 'Menu',
                                 style: TextStyle(
-                                  fontSize: 20,
+                                  fontSize: appTextFontSize,
                                   // color: Colors.black,
                                   fontWeight: FontWeight.w700,
                                 ),
@@ -161,7 +172,7 @@ class _HomePageState extends State<HomePage> {
                             ],
                           ),
                         ),
-                        const SizedBox(height: 15),
+                        SizedBox(height: ScreenUtil().setHeight(15)),
                         const Divider(
                           color: Colors.black26,
                           height: 1,
@@ -170,7 +181,7 @@ class _HomePageState extends State<HomePage> {
                           child: Column(
                             crossAxisAlignment: CrossAxisAlignment.start,
                             children: [
-                              const SizedBox(height: 15),
+                              SizedBox(height: ScreenUtil().setHeight(15)),
                               InkWell(
                                 onTap: () {},
                                 child: ListTile(
@@ -208,7 +219,7 @@ class _HomePageState extends State<HomePage> {
                               const SizedBox(height: 15),
                               ListTile(
                                 leading: Transform.rotate(
-                                  angle: 90 * math.pi/180,
+                                  angle: 90 * math.pi / 180,
                                   child: const Icon(
                                     FontAwesomeIcons.timeline,
                                   ),
@@ -218,12 +229,13 @@ class _HomePageState extends State<HomePage> {
                                   Navigator.push(
                                     context,
                                     MaterialPageRoute(
-                                      builder: (context) => const OpsoTimeLineScreen(),
+                                      builder: (context) =>
+                                          const OpsoTimeLineScreen(),
                                     ),
                                   );
                                 },
                               ),
-                              const SizedBox(height: 15),
+                              SizedBox(height: ScreenUtil().setHeight(15)),
                               ListTile(
                                 leading:
                                     const Icon(FontAwesomeIcons.circleInfo),
@@ -237,7 +249,7 @@ class _HomePageState extends State<HomePage> {
                                   );
                                 },
                               ),
-                              const SizedBox(height: 15),
+                              SizedBox(height: ScreenUtil().setHeight(15)),
                             ],
                           ),
                         ),
@@ -245,7 +257,7 @@ class _HomePageState extends State<HomePage> {
                           color: Colors.black26,
                           height: 1,
                         ),
-                        const SizedBox(height: 15),
+                        SizedBox(height: ScreenUtil().setHeight(15)),
                       ],
                     ),
                   ),
@@ -354,10 +366,10 @@ class ProgramOption extends StatelessWidget {
         GestureDetector(
           onTap: onTap,
           child: Container(
-            padding: const EdgeInsets.all(20),
+            padding: EdgeInsets.all(ScreenUtil().setWidth(20)),
             decoration: BoxDecoration(
               // color: const Color.fromARGB(255, 237, 237, 239),
-                borderRadius: BorderRadius.circular(15),
+              borderRadius: BorderRadius.circular(15),
               border: Border.all(
                 width: 1,
                 color: borderColor,
@@ -367,15 +379,15 @@ class ProgramOption extends StatelessWidget {
               children: [
                 Image.asset(
                   imageAssetPath,
-                  width: 50,
-                  height: 50,
+                  width: ScreenUtil().setWidth(50),
+                  height: ScreenUtil().setHeight(50),
                 ),
-                const SizedBox(width: 20),
+                SizedBox(width: ScreenUtil().setWidth(20)),
                 Expanded(
                   child: Text(
                     title,
-                    style: const TextStyle(
-                      fontSize: 18,
+                    style: TextStyle(
+                      fontSize: ScreenUtil().setSp(18),
                       fontWeight: FontWeight.bold,
                     ),
                   ),
@@ -385,7 +397,7 @@ class ProgramOption extends StatelessWidget {
             ),
           ),
         ),
-        const SizedBox(height: 20), // Adding SizedBox between each button
+        SizedBox(height: ScreenUtil().setHeight(20)),
       ],
     );
   }
diff --git a/lib/landing_page.dart b/lib/landing_page.dart
index 0ffddd5..1d7a89b 100644
--- a/lib/landing_page.dart
+++ b/lib/landing_page.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:animated_text_kit/animated_text_kit.dart';
 import 'package:opso/home_page.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 
 class LandingPage extends StatefulWidget {
   const LandingPage({super.key});
@@ -12,8 +13,11 @@ class LandingPage extends StatefulWidget {
 class _LandingPageState extends State<LandingPage> {
   @override
   Widget build(BuildContext context) {
-    double width = MediaQuery.of(context).size.width;
-    double height = MediaQuery.of(context).size.height;
+    ScreenUtilInit(
+      designSize: Size(360, 690),
+    );
+    // double width = MediaQuery.of(context).size.width;
+    // double height = MediaQuery.of(context).size.height;
     return Scaffold(
       body: SingleChildScrollView(
         child: Padding(
@@ -23,8 +27,8 @@ class _LandingPageState extends State<LandingPage> {
               children: [
                 Center(
                   child: Container(
-                    width: width,
-                    height: height / 2,
+                    width: 360.w,
+                    height: (690.h) / 2,
                     decoration: const BoxDecoration(
                       image: DecorationImage(
                           image: AssetImage("assets/landing.webp"),
@@ -36,15 +40,14 @@ class _LandingPageState extends State<LandingPage> {
                   child: SizedBox(
                     child: DefaultTextStyle(
                       style: TextStyle(
-                        fontSize: width / 19,
+                        fontSize: 50.sp,
                       ),
                       child: AnimatedTextKit(
                         animatedTexts: [
                           ColorizeAnimatedText(
                             'Unlock your potential',
                             textStyle: TextStyle(
-                                fontSize: width / 12,
-                                fontWeight: FontWeight.w900),
+                                fontSize: 20.sp, fontWeight: FontWeight.w700),
                             colors: [
                               const Color.fromRGBO(255, 183, 77, 1),
                               const Color.fromARGB(255, 231, 225, 208)
@@ -62,15 +65,15 @@ class _LandingPageState extends State<LandingPage> {
                     child: Text(
                       "Contribute to Open Source",
                       style: TextStyle(
-                          fontWeight: FontWeight.w400, fontSize: width / 18),
+                          fontWeight: FontWeight.w400, fontSize: 20.sp),
                     ),
                   ),
                 ),
                 const Padding(padding: EdgeInsets.only(top: 30)),
                 Center(
                   child: SizedBox(
-                    width: width / 1.5,
-                    height: height / 10,
+                    width: 250.w,
+                    height: 60.h,
                     child: ElevatedButton(
                       style: ElevatedButton.styleFrom(
                           backgroundColor:
@@ -88,8 +91,10 @@ class _LandingPageState extends State<LandingPage> {
                         "Get started",
                         style: TextStyle(
                             color: Colors.white,
-                            fontSize:
-                                (width < height) ? width / 19 : height / 19),
+                            fontSize: (MediaQuery.of(context).size.width <
+                                    MediaQuery.of(context).size.height)
+                                ? 19.sp
+                                : 19.sh),
                       ),
                     ),
                   ),
diff --git a/lib/main.dart b/lib/main.dart
index 76d1f3c..58635fc 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:opso/landing_page.dart';
 import 'package:opso/programs%20screen/girl_script.dart';
 import 'package:opso/programs%20screen/google_season_of_docs_screen.dart';
@@ -22,34 +23,42 @@ class OpSoApp extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return AdaptiveTheme(
-      light: ThemeData.light(),
-      dark: ThemeData.dark(),
-      initial: AdaptiveThemeMode.system,
-      builder: (theme, darkTheme) => MaterialApp(
-        initialRoute: '/landing_page',
-        routes: {
-          "/progarm_page": (context) => const HomePage(),
-          "/girl_script_summer_of_code": (context) => const GSSOCScreen(),
-          "/google_summer_of_code": (context) => GoogleSummerOfCodeScreen(),
-          "/google_season_of_docs": (context) => GoogleSeasonOfDocsScreen(),
-          "/summer_of_bitcoin": (context) => const SummerOfBitcoin(),
-          "/outreachy": (context) => const OutReachy(),
-          "/major_league_hacking_fellowship": (context) =>
-              const MajorLeagueHackingFellowship(),
-          "/linux_foundation": (context) => const LinuxFoundation(),
-          "/landing_page": (context) => const LandingPage(),
-        },
-        title: 'OpSo',
-        debugShowCheckedModeBanner: false,
-        theme: theme,
-        darkTheme: darkTheme,
-        // theme: ThemeData(
-        //   primarySwatch: Colors.blue,
-        //   visualDensity: VisualDensity.adaptivePlatformDensity,
-        // ),
-        home: const HomePage(),
-      ),
-    );
+    return ScreenUtilInit(
+        designSize: const Size(360, 690),
+        minTextAdapt: true,
+        splitScreenMode: false,
+        builder: (_, child) {
+          return AdaptiveTheme(
+            light: ThemeData.light(),
+            dark: ThemeData.dark(),
+            initial: AdaptiveThemeMode.system,
+            builder: (theme, darkTheme) => MaterialApp(
+              initialRoute: '/landing_page',
+              routes: {
+                "/progarm_page": (context) => const HomePage(),
+                "/girl_script_summer_of_code": (context) => const GSSOCScreen(),
+                "/google_summer_of_code": (context) =>
+                    GoogleSummerOfCodeScreen(),
+                "/google_season_of_docs": (context) =>
+                    GoogleSeasonOfDocsScreen(),
+                "/summer_of_bitcoin": (context) => const SummerOfBitcoin(),
+                "/outreachy": (context) => const OutReachy(),
+                "/major_league_hacking_fellowship": (context) =>
+                    const MajorLeagueHackingFellowship(),
+                "/linux_foundation": (context) => const LinuxFoundation(),
+                "/landing_page": (context) => const LandingPage(),
+              },
+              title: 'OpSo',
+              debugShowCheckedModeBanner: false,
+              theme: theme,
+              darkTheme: darkTheme,
+              // theme: ThemeData(
+              //   primarySwatch: Colors.blue,
+              //   visualDensity: VisualDensity.adaptivePlatformDensity,
+              // ),
+              home: const HomePage(),
+            ),
+          );
+        });
   }
 }
diff --git a/lib/programs screen/girl_script.dart b/lib/programs screen/girl_script.dart
index 8ea149d..06f5340 100644
--- a/lib/programs screen/girl_script.dart	
+++ b/lib/programs screen/girl_script.dart	
@@ -4,23 +4,19 @@ import 'package:flutter/services.dart';
 import 'package:opso/modals/book_mark_model.dart';
 import 'package:opso/modals/gssoc_project_modal.dart';
 
-
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:opso/widgets/gssoc_project_widget.dart';
 import 'package:opso/widgets/year_button.dart';
 
-
 import '../widgets/SearchandFilterWidget.dart';
 
-
 class GSSOCScreen extends StatefulWidget {
   const GSSOCScreen({super.key});
 
-
   @override
   State<GSSOCScreen> createState() => _GSSOCScreenState();
 }
 
-
 class _GSSOCScreenState extends State<GSSOCScreen> {
   String currectPage = "/girl_script_summer_of_code";
   String currentProject = "Girl Script Summer of Code";
@@ -34,36 +30,34 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
   List<GssocProjectModal> projectList = [];
   Future<void>? getProjectFunction;
 
-
   Future<void> initializeProjectLists() async {
     String response =
-    await rootBundle.loadString('assets/projects/gssoc/gssoc2024.json');
+        await rootBundle.loadString('assets/projects/gssoc/gssoc2024.json');
     var jsonList = await json.decode(response);
     for (var data in jsonList) {
       gssoc2024.add(GssocProjectModal.getDataFromJson(data));
     }
     projectList = List.from(gssoc2024);
     response =
-    await rootBundle.loadString('assets/projects/gssoc/gssoc2023.json');
+        await rootBundle.loadString('assets/projects/gssoc/gssoc2023.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
       gssoc2023.add(GssocProjectModal.getDataFromJson(data));
     }
     response =
-    await rootBundle.loadString('assets/projects/gssoc/gssoc2022.json');
+        await rootBundle.loadString('assets/projects/gssoc/gssoc2022.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
       gssoc2022.add(GssocProjectModal.getDataFromJson(data));
     }
     response =
-    await rootBundle.loadString('assets/projects/gssoc/gssoc2021.json');
+        await rootBundle.loadString('assets/projects/gssoc/gssoc2021.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
       gssoc2021.add(GssocProjectModal.getDataFromJson(data));
     }
   }
 
-
   @override
   void initState() {
     getProjectFunction = initializeProjectLists();
@@ -71,7 +65,6 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
     _checkBookmarkStatus();
   }
 
-
   Future<void> _checkBookmarkStatus() async {
     bool bookmarkStatus = await HandleBookmark.isBookmarked(currentProject);
     setState(() {
@@ -79,7 +72,6 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
     });
   }
 
-
   void searchTag(String searchTag) {
     projectList = projectList
         .where((element) => element.techstack.contains(searchTag))
@@ -87,7 +79,6 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
     setState(() {});
   }
 
-
   void search(String searchText) {
     if (searchText.isEmpty) {
       switch (selectedYear) {
@@ -110,15 +101,14 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
     projectList = projectList
         .where(
           (element) =>
-      element.name.toLowerCase().contains(searchText.toLowerCase()) ||
-          element.techstack.contains(searchText) ||
-          element.hostedBy.toLowerCase().contains(searchText.toLowerCase()),
-    )
+              element.name.toLowerCase().contains(searchText.toLowerCase()) ||
+              element.techstack.contains(searchText) ||
+              element.hostedBy.toLowerCase().contains(searchText.toLowerCase()),
+        )
         .toList();
     setState(() {});
   }
 
-
   Future<void> _refresh() async {
     setState(() {
       initializeProjectLists();
@@ -126,11 +116,11 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
     });
   }
 
-
   @override
   Widget build(BuildContext context) {
-    var height = MediaQuery.sizeOf(context).height;
-    var width = MediaQuery.sizeOf(context).width;
+    ScreenUtil.init(context);
+    // var height = MediaQuery.sizeOf(context).height;
+    // var width = MediaQuery.sizeOf(context).width;
     List<String> languages = [
       'All',
       'Js',
@@ -186,8 +176,9 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                   return const Center(child: CircularProgressIndicator());
                 } else if (snapshot.connectionState == ConnectionState.done) {
                   return Padding(
-                    padding:
-                    const EdgeInsets.symmetric(horizontal: 46, vertical: 16),
+                    padding: EdgeInsets.symmetric(
+                        horizontal: ScreenUtil().setWidth(46),
+                        vertical: ScreenUtil().setHeight(16)),
                     child: Column(
                       crossAxisAlignment: CrossAxisAlignment.stretch,
                       children: [
@@ -221,8 +212,9 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                                 color: Color(0xFFEEEEEE),
                               ),
                             ),
-                            contentPadding: const EdgeInsets.symmetric(
-                                vertical: 12.0, horizontal: 20.0),
+                            contentPadding: EdgeInsets.symmetric(
+                                vertical: ScreenUtil().setHeight(12),
+                                horizontal: ScreenUtil().setWidth(20)),
                           ),
                           onFieldSubmitted: (value) {
                             print("value is $value");
@@ -236,12 +228,12 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                         ),
                         const SizedBox(height: 20),
                         SizedBox(
-                          height: height * 0.2,
-                          width: width,
+                          height: ScreenUtil().screenHeight * 0.2,
+                          width: ScreenUtil().screenWidth,
                           child: GridView(
                             physics: const NeverScrollableScrollPhysics(),
                             gridDelegate:
-                            const SliverGridDelegateWithFixedCrossAxisCount(
+                                const SliverGridDelegateWithFixedCrossAxisCount(
                               crossAxisCount: 2,
                               childAspectRatio: 1.5 / 0.6,
                               crossAxisSpacing: 15,
@@ -323,24 +315,27 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                         //     ),
                         //   ),
                         // ),
-                        const SizedBox(
-                          height: 20,
+                        SizedBox(
+                          height: ScreenUtil().setHeight(20),
                         ),
 
-
                         Row(
                           crossAxisAlignment: CrossAxisAlignment.center,
                           mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                           children: [
-                            const Text(
+                            Text(
                               'Filter by Language:',
-                              style: TextStyle(fontWeight: FontWeight.w400),
+                              style: TextStyle(
+                                  fontWeight: FontWeight.w400,
+                                  fontSize: ScreenUtil().setSp(14)),
                             ),
                             Padding(
-                              padding: const EdgeInsets.all(8.0),
+                              padding:
+                                  EdgeInsets.all(ScreenUtil().setHeight(8)),
                               child: Row(
                                 crossAxisAlignment: CrossAxisAlignment.center,
-                                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                                mainAxisAlignment:
+                                    MainAxisAlignment.spaceEvenly,
                                 children: [
                                   DropdownWidget(
                                     items: languages,
@@ -372,19 +367,19 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                           ],
                         ),
 
-
                         Expanded(
                           // width: width,
                           child: ListView.builder(
                             itemCount: projectList.length,
                             itemBuilder: (BuildContext context, int index) {
                               return Padding(
-                                padding: const EdgeInsets.symmetric(vertical: 10),
+                                padding:
+                                    const EdgeInsets.symmetric(vertical: 10),
                                 child: GssocProjectWidget(
                                   index: index + 1,
                                   modal: projectList[index],
-                                  height: height * 0.2,
-                                  width: width,
+                                  height: ScreenUtil().screenHeight * 0.2,
+                                  width: ScreenUtil().screenWidth,
                                 ),
                               );
                             },
@@ -397,10 +392,6 @@ class _GSSOCScreenState extends State<GSSOCScreen> {
                   return const Center(child: Text("Some error occured"));
                 }
               }),
-        )
-    );
+        ));
   }
 }
-
-
-
diff --git a/lib/programs screen/google_season_of_docs_screen.dart b/lib/programs screen/google_season_of_docs_screen.dart
index 6e2df0e..c8c7a5a 100644
--- a/lib/programs screen/google_season_of_docs_screen.dart	
+++ b/lib/programs screen/google_season_of_docs_screen.dart	
@@ -1,6 +1,6 @@
 import 'dart:convert';
 
-
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:opso/modals/book_mark_model.dart';
@@ -10,14 +10,12 @@ import 'package:opso/widgets/gsod/gsod_project_widget_new.dart';
 import 'package:opso/widgets/gsod/gsod_project_widget_old.dart';
 import 'package:opso/widgets/year_button.dart';
 
-
 class GoogleSeasonOfDocsScreen extends StatefulWidget {
   @override
   State<GoogleSeasonOfDocsScreen> createState() =>
       _GoogleSeasonOfDocsScreenState();
 }
 
-
 class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
   String currentProgram = "Google Season of Docs";
   bool isBookmarked = true;
@@ -30,14 +28,12 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
   bool flag = true;
   int selectedYear = 2023;
 
-
   List projectList = [];
   Future<void>? getProjectFunction;
 
-
   Future<void> initializeProjectLists() async {
     String response =
-    await rootBundle.loadString('assets/projects/gsod/gsod2023.json');
+        await rootBundle.loadString('assets/projects/gsod/gsod2023.json');
     var jsonList = await json.decode(response);
     for (var data in jsonList) {
       gsod2023.add(GsodModalNew.fromMap(data));
@@ -45,39 +41,35 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
     print(gsod2023.length);
     projectList = List.from(gsod2023);
     response =
-    await rootBundle.loadString('assets/projects/gsod/gsod2022.json');
+        await rootBundle.loadString('assets/projects/gsod/gsod2022.json');
     jsonList = await json.decode(response);
 
-
     for (var data in jsonList) {
       print(data["organization_name"]);
       gsod2022.add(GsodModalNew.fromMap(data));
     }
 
-
     response =
-    await rootBundle.loadString('assets/projects/gsod/gsod2021.json');
+        await rootBundle.loadString('assets/projects/gsod/gsod2021.json');
     jsonList = await json.decode(response);
 
-
     for (var data in jsonList) {
       gsod2021.add(GsodModalNew.fromMap(data));
     }
     response =
-    await rootBundle.loadString('assets/projects/gsod/gsod2020.json');
+        await rootBundle.loadString('assets/projects/gsod/gsod2020.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
       gsod2020.add(GsodModalOld.fromMap(data));
     }
     response =
-    await rootBundle.loadString('assets/projects/gsod/gsod2019.json');
+        await rootBundle.loadString('assets/projects/gsod/gsod2019.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
       gsod2019.add(GsodModalOld.fromMap(data));
     }
   }
 
-
   @override
   void initState() {
     getProjectFunction = initializeProjectLists();
@@ -85,7 +77,6 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
     super.initState();
   }
 
-
   Future<void> _checkBookmarkStatus() async {
     bool bookmarkStatus = await HandleBookmark.isBookmarked(currentProgram);
     setState(() {
@@ -93,7 +84,6 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
     });
   }
 
-
   void search(String searchText) {
     if (searchText.isEmpty) {
       switch (selectedYear) {
@@ -120,62 +110,65 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
       projectList = projectList
           .where(
             (element) =>
-        element.organizationName
-            .toLowerCase()
-            .contains(searchText.toLowerCase()) ||
-            element.budget
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.acceptedProjectProposal
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.caseStudy
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.docsPage
-                .toLowerCase()
-                .contains(searchText.toLowerCase()),
-      )
+                element.organizationName
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.budget
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.acceptedProjectProposal
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.caseStudy
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.docsPage
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()),
+          )
           .toList();
     } else {
       projectList = projectList
           .where(
             (element) =>
-        element.organization
-            .toLowerCase()
-            .contains(searchText.toLowerCase()) ||
-            element.technicalWriter
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.mentor
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.project
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.originalProjectProposal
-                .toLowerCase()
-                .contains(searchText.toLowerCase()) ||
-            element.report.toLowerCase().contains(searchText.toLowerCase()),
-      )
+                element.organization
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.technicalWriter
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.mentor
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.project
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.originalProjectProposal
+                    .toLowerCase()
+                    .contains(searchText.toLowerCase()) ||
+                element.report.toLowerCase().contains(searchText.toLowerCase()),
+          )
           .toList();
     }
 
-
     setState(() {});
   }
+
   Future<void> _refresh() async {
     // Fetch data for the next year based on the currently selected year
     setState(() {
       initializeProjectLists();
       selectedYear = 2023;
-      if (selectedYear > 2023) selectedYear = 2019; // Reset to the beginning if it exceeds 2023
+      if (selectedYear > 2023)
+        selectedYear = 2019; // Reset to the beginning if it exceeds 2023
     });
   }
+
   @override
   Widget build(BuildContext context) {
-    var height = MediaQuery.sizeOf(context).height;
-    var width = MediaQuery.sizeOf(context).width;
+    // var height = MediaQuery.sizeOf(context).height;
+    // var width = MediaQuery.sizeOf(context).width;
+    ScreenUtil.init(context);
     return RefreshIndicator(
       onRefresh: _refresh,
       child: Scaffold(
@@ -190,10 +183,10 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
               });
               ScaffoldMessenger.of(context).showSnackBar(
                 SnackBar(
-                  content:
-                  Text(isBookmarked ? 'Bookmark added' : 'Bookmark removed'),
-                  duration:
-                  const Duration(seconds: 2), // Adjust the duration as needed
+                  content: Text(
+                      isBookmarked ? 'Bookmark added' : 'Bookmark removed'),
+                  duration: const Duration(
+                      seconds: 2), // Adjust the duration as needed
                 ),
               );
               if (isBookmarked) {
@@ -213,8 +206,9 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
                 return const Center(child: CircularProgressIndicator());
               } else if (snapshot.connectionState == ConnectionState.done) {
                 return Padding(
-                  padding:
-                  const EdgeInsets.symmetric(horizontal: 46, vertical: 16),
+                  padding: EdgeInsets.symmetric(
+                      horizontal: ScreenUtil().setWidth(46),
+                      vertical: ScreenUtil().setHeight(16)),
                   child: Column(
                     crossAxisAlignment: CrossAxisAlignment.stretch,
                     children: [
@@ -248,8 +242,9 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
                               color: Color(0xFFEEEEEE),
                             ),
                           ),
-                          contentPadding: const EdgeInsets.symmetric(
-                              vertical: 12.0, horizontal: 20.0),
+                          contentPadding: EdgeInsets.symmetric(
+                              vertical: ScreenUtil().setHeight(12),
+                              horizontal: ScreenUtil().setWidth(40)),
                         ),
                         onFieldSubmitted: (value) {
                           print("value is $value");
@@ -261,16 +256,16 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
                           }
                         },
                       ),
-                      const SizedBox(height: 20),
+                      SizedBox(height: ScreenUtil().setHeight(20)),
                       Container(
                         constraints: BoxConstraints(
-                          maxHeight: height * 0.3,
+                          maxHeight: ScreenUtil().screenHeight * 0.3,
                         ),
-                        width: width,
+                        width: ScreenUtil().screenWidth,
                         child: GridView(
                           physics: const NeverScrollableScrollPhysics(),
                           gridDelegate:
-                          const SliverGridDelegateWithFixedCrossAxisCount(
+                              const SliverGridDelegateWithFixedCrossAxisCount(
                             crossAxisCount: 2,
                             childAspectRatio: 1.5 / 0.6,
                             crossAxisSpacing: 15,
@@ -369,7 +364,6 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
                         height: 20,
                       ),
 
-
                       Expanded(
                         // width: width,
                         child: ListView.builder(
@@ -379,17 +373,17 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
                               padding: const EdgeInsets.symmetric(vertical: 10),
                               child: selectedYear <= 2020
                                   ? GsodProjectWidgetOld(
-                                index: index + 1,
-                                modal: projectList[index],
-                                height: height * 0.2,
-                                width: width,
-                              )
+                                      index: index + 1,
+                                      modal: projectList[index],
+                                      height: ScreenUtil().screenHeight * 0.2,
+                                      width: ScreenUtil().screenWidth,
+                                    )
                                   : GsodProjectWidgetNew(
-                                index: index + 1,
-                                modal: projectList[index],
-                                height: height * 0.2,
-                                width: width,
-                              ),
+                                      index: index + 1,
+                                      modal: projectList[index],
+                                      height: ScreenUtil().screenHeight * 0.2,
+                                      width: ScreenUtil().screenWidth,
+                                    ),
                             );
                           },
                         ),
@@ -405,4 +399,3 @@ class _GoogleSeasonOfDocsScreenState extends State<GoogleSeasonOfDocsScreen> {
     );
   }
 }
-
diff --git a/lib/programs screen/google_summer_of_code_screen.dart b/lib/programs screen/google_summer_of_code_screen.dart
index d324216..25e7655 100644
--- a/lib/programs screen/google_summer_of_code_screen.dart	
+++ b/lib/programs screen/google_summer_of_code_screen.dart	
@@ -3,17 +3,18 @@ import 'package:flutter/material.dart';
 import 'package:opso/widgets/gsoc/GsocProjectWidget.dart';
 import 'package:url_launcher/url_launcher.dart';
 import '../modals/GSoC/Gsoc.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
 import '../services/ApiService.dart';
 import '../widgets/SearchandFilterWidget.dart';
 import '../widgets/year_button.dart';
 
-
 class GoogleSummerOfCodeScreen extends StatefulWidget {
   @override
-  State<GoogleSummerOfCodeScreen> createState() => _GoogleSummerOfCodeScreenState();
+  State<GoogleSummerOfCodeScreen> createState() =>
+      _GoogleSummerOfCodeScreenState();
 }
 
-
 class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
   List<Organization> gsoc2024 = [];
   List<Organization> gsoc2023 = [];
@@ -41,14 +42,12 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
   late Future<void> _dataFetchFuture;
   final GlobalKey<AnimatedListState> _listKey = GlobalKey<AnimatedListState>();
 
-
   @override
   void initState() {
     super.initState();
     _dataFetchFuture = getProjectData();
   }
 
-
   Future<void> getProjectData() async {
     ApiService apiService = ApiService();
     try {
@@ -57,7 +56,6 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
       Gsoc orgData2023 = await apiService.getOrgByYear('2023');
       Gsoc orgData2024 = await apiService.getOrgByYear('2024');
 
-
       setState(() {
         gsoc2021 = orgData2021.organizations ?? [];
         gsoc2022 = orgData2022.organizations ?? [];
@@ -71,36 +69,34 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
     }
   }
 
-
   void _clearAnimatedList() {
     for (var i = orgList.length - 1; i >= 0; i--) {
       _listKey.currentState?.removeItem(
         i,
-            (context, animation) => SizedBox.shrink(),
+        (context, animation) => SizedBox.shrink(),
         duration: Duration.zero,
       );
     }
   }
 
-
   void _populateAnimatedList(List<Organization> organizations) {
     for (var i = 0; i < organizations.length; i++) {
       _listKey.currentState?.insertItem(i);
     }
   }
 
-
   void searchTag(String searchTag) {
     setState(() {
       _clearAnimatedList();
       orgList = _getOrganizationsByYear(selectedYear)
-          .where((element) => element.technologies?.contains(searchTag) == true || element.topics?.contains(searchTag) == true)
+          .where((element) =>
+              element.technologies?.contains(searchTag) == true ||
+              element.topics?.contains(searchTag) == true)
           .toList();
       _populateAnimatedList(orgList);
     });
   }
 
-
   void search(String searchText) {
     setState(() {
       _clearAnimatedList();
@@ -108,14 +104,17 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
         orgList = _getOrganizationsByYear(selectedYear);
       } else {
         orgList = _getOrganizationsByYear(selectedYear)
-            .where((element) => element.name?.toLowerCase().contains(searchText.toLowerCase()) == true)
+            .where((element) =>
+                element.name
+                    ?.toLowerCase()
+                    .contains(searchText.toLowerCase()) ==
+                true)
             .toList();
       }
       _populateAnimatedList(orgList);
     });
   }
 
-
   List<Organization> _getOrganizationsByYear(int year) {
     switch (year) {
       case 2021:
@@ -131,7 +130,6 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
     }
   }
 
-
   Future<void> _refresh() async {
     setState(() {
       _dataFetchFuture = getProjectData();
@@ -139,12 +137,14 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
     });
   }
 
-
   @override
   Widget build(BuildContext context) {
-    var height = MediaQuery.of(context).size.height;
-    var width = MediaQuery.of(context).size.width;
+    // var height = MediaQuery.of(context).size.height;
+    // var width = MediaQuery.of(context).size.width;
 
+    ScreenUtil.init(
+      context,
+    );
 
     return RefreshIndicator(
       onRefresh: _refresh,
@@ -161,7 +161,9 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
               return Center(child: Text('Error: ${snapshot.error}'));
             } else {
               return Padding(
-                padding: const EdgeInsets.symmetric(horizontal: 46, vertical: 16),
+                padding: EdgeInsets.symmetric(
+                    horizontal: ScreenUtil().setWidth(46),
+                    vertical: ScreenUtil().setHeight(16)),
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.stretch,
                   children: [
@@ -194,8 +196,9 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
                             color: Color(0xFFEEEEEE),
                           ),
                         ),
-                        contentPadding: const EdgeInsets.symmetric(
-                            vertical: 12.0, horizontal: 20.0),
+                        contentPadding: EdgeInsets.symmetric(
+                            vertical: ScreenUtil().setWidth(12),
+                            horizontal: ScreenUtil().setHeight(20)),
                       ),
                       onFieldSubmitted: (value) {
                         search(value.trim());
@@ -206,14 +209,14 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
                         }
                       },
                     ),
-                    const SizedBox(height: 20),
+                    SizedBox(height: ScreenUtil().setHeight(20)),
                     SizedBox(
-                      height: height * 0.2,
-                      width: width,
+                      height: ScreenUtil().screenHeight * 0.2,
+                      width: ScreenUtil().screenWidth,
                       child: GridView(
                         physics: const NeverScrollableScrollPhysics(),
                         gridDelegate:
-                        const SliverGridDelegateWithFixedCrossAxisCount(
+                            const SliverGridDelegateWithFixedCrossAxisCount(
                           crossAxisCount: 2,
                           childAspectRatio: 1.5 / 0.6,
                           crossAxisSpacing: 15,
@@ -292,7 +295,7 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
                           style: TextStyle(fontWeight: FontWeight.w400),
                         ),
                         Padding(
-                          padding: const EdgeInsets.all(8.0),
+                          padding: EdgeInsets.all(ScreenUtil().setWidth(8)),
                           child: Row(
                             crossAxisAlignment: CrossAxisAlignment.center,
                             mainAxisAlignment: MainAxisAlignment.spaceEvenly,
@@ -314,7 +317,12 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
                         key: _listKey,
                         initialItemCount: orgList.length,
                         itemBuilder: (context, index, animation) {
-                          return _buildAnimatedItem(context, index, animation, height, width);
+                          return _buildAnimatedItem(
+                              context,
+                              index,
+                              animation,
+                              ScreenUtil().screenHeight,
+                              ScreenUtil().screenWidth);
                         },
                       ),
                     ),
@@ -328,8 +336,8 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
     );
   }
 
-
-  Widget _buildAnimatedItem(BuildContext context, int index, Animation<double> animation, double height, double width) {
+  Widget _buildAnimatedItem(BuildContext context, int index,
+      Animation<double> animation, double height, double width) {
     return SizeTransition(
       sizeFactor: animation,
       axis: Axis.vertical,
@@ -364,10 +372,8 @@ class _GoogleSummerOfCodeScreenState extends State<GoogleSummerOfCodeScreen> {
   }
 }
 
-
 void main() {
   runApp(MaterialApp(
     home: GoogleSummerOfCodeScreen(),
   ));
 }
-
diff --git a/lib/programs screen/linux_foundation.dart b/lib/programs screen/linux_foundation.dart
index 164fcc1..9bc0fa0 100644
--- a/lib/programs screen/linux_foundation.dart	
+++ b/lib/programs screen/linux_foundation.dart	
@@ -1,22 +1,18 @@
 import 'dart:convert';
-
-
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:opso/modals/book_mark_model.dart';
 import 'package:opso/modals/linux_foundation_modal.dart';
 import 'package:opso/widgets/linux_foundation_widget.dart';
 
-
 class LinuxFoundation extends StatefulWidget {
   const LinuxFoundation({super.key});
 
-
   @override
   State<LinuxFoundation> createState() => _LinuxFoundationState();
 }
 
-
 class _LinuxFoundationState extends State<LinuxFoundation> {
   bool isBookmarked = true;
   String currectPage = "/linux_foundation";
@@ -25,12 +21,10 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
   List<LinuxFoundationModal> projectList = [];
   Future<void>? getProjectListFunction;
 
-
   Future<void> initializeProjectLists() async {
     String response = await rootBundle
         .loadString('assets/projects/linux_foundation/linux_foundation.json');
 
-
     var jsonList = await json.decode(response);
     for (var data in jsonList) {
       modals.add(LinuxFoundationModal.fromMap(data));
@@ -39,7 +33,6 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
     // setState(() {});
   }
 
-
   @override
   void initState() {
     super.initState();
@@ -47,7 +40,6 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
     _checkBookmarkStatus();
   }
 
-
   Future<void> _checkBookmarkStatus() async {
     bool bookmarkStatus = await HandleBookmark.isBookmarked(currentProject);
     setState(() {
@@ -55,7 +47,6 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
     });
   }
 
-
   void search(String searchText) {
     if (searchText.isEmpty) {
       setState(() {
@@ -65,22 +56,21 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
     }
     projectList = projectList
         .where((LinuxFoundationModal element) =>
-        element.name.toLowerCase().contains(searchText.toLowerCase()))
+            element.name.toLowerCase().contains(searchText.toLowerCase()))
         .toList();
     setState(() {});
   }
 
-
   Future<void> _refresh() async {
     await initializeProjectLists();
     setState(() {});
   }
 
-
   @override
   Widget build(BuildContext context) {
-    var height = MediaQuery.sizeOf(context).height;
-    var width = MediaQuery.sizeOf(context).width;
+    // var height = MediaQuery.sizeOf(context).height;
+    // var width = MediaQuery.sizeOf(context).width;
+    ScreenUtil.init(context, designSize: Size(360, 690));
     return RefreshIndicator(
       onRefresh: _refresh,
       child: Scaffold(
@@ -95,10 +85,10 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
               });
               ScaffoldMessenger.of(context).showSnackBar(
                 SnackBar(
-                  content:
-                  Text(isBookmarked ? 'Bookmark added' : 'Bookmark removed'),
-                  duration:
-                  const Duration(seconds: 2), // Adjust the duration as needed
+                  content: Text(
+                      isBookmarked ? 'Bookmark added' : 'Bookmark removed'),
+                  duration: const Duration(
+                      seconds: 2), // Adjust the duration as needed
                 ),
               );
               if (isBookmarked) {
@@ -118,7 +108,9 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
               return const Center(child: CircularProgressIndicator());
             } else if (snapshot.connectionState == ConnectionState.done) {
               return Padding(
-                padding: const EdgeInsets.symmetric(horizontal: 46, vertical: 16),
+                padding: EdgeInsets.symmetric(
+                    horizontal: ScreenUtil().setWidth(46),
+                    vertical: ScreenUtil().setHeight(16)),
                 child: Column(
                   children: [
                     TextFormField(
@@ -151,8 +143,9 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
                             color: Color(0xFFEEEEEE),
                           ),
                         ),
-                        contentPadding: const EdgeInsets.symmetric(
-                            vertical: 12.0, horizontal: 20.0),
+                        contentPadding: EdgeInsets.symmetric(
+                            vertical: ScreenUtil().setHeight(12),
+                            horizontal: ScreenUtil().setWidth(40)),
                       ),
                       onFieldSubmitted: (value) {
                         print("value is $value");
@@ -164,19 +157,20 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
                         }
                       },
                     ),
-                    const SizedBox(height: 20),
+                    SizedBox(height: ScreenUtil().setHeight(20)),
                     Expanded(
                       // width: width,
                       child: ListView.builder(
                         itemCount: projectList.length,
                         itemBuilder: (BuildContext context, int index) {
                           return Padding(
-                            padding: const EdgeInsets.symmetric(vertical: 10),
+                            padding: EdgeInsets.symmetric(
+                                vertical: ScreenUtil().setHeight(10)),
                             child: LinuxFoundationWidget(
                               // index: index + 1,
                               modal: projectList[index],
-                              height: height * 0.2,
-                              width: width,
+                              height: ScreenUtil().screenHeight * 0.2,
+                              width: ScreenUtil().screenWidth,
                             ),
                           );
                         },
@@ -193,4 +187,3 @@ class _LinuxFoundationState extends State<LinuxFoundation> {
     );
   }
 }
-
diff --git a/lib/programs screen/summer_of_bitcoin.dart b/lib/programs screen/summer_of_bitcoin.dart
index 304c7ac..12d4a6b 100644
--- a/lib/programs screen/summer_of_bitcoin.dart	
+++ b/lib/programs screen/summer_of_bitcoin.dart	
@@ -1,46 +1,38 @@
 import 'dart:convert';
-
-
+import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:opso/modals/sob_project_modal.dart';
 import 'package:opso/widgets/sob_project_widget.dart';
 import 'package:opso/widgets/year_button.dart';
 
-
 import '../widgets/SearchandFilterWidget.dart';
 
-
 class SummerOfBitcoin extends StatefulWidget {
   const SummerOfBitcoin({super.key});
 
-
   @override
   State<SummerOfBitcoin> createState() => _SummerOfBitcoinState();
 }
 
-
 class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
   List<SobProjectModal> sob2023 = [];
   List<SobProjectModal> sob2022 = [];
   List<SobProjectModal> sob2021 = [];
   int selectedYear = 2023;
 
-
   List<SobProjectModal> projectList = [];
   Future<void>? getProjectFunction;
 
-
   Future<void> initializeProjectLists() async {
     String response =
-    await rootBundle.loadString('assets/projects/sob/sob2023.json');
+        await rootBundle.loadString('assets/projects/sob/sob2023.json');
     var jsonList = await json.decode(response);
     for (var data in jsonList) {
       sob2023.add(SobProjectModal.fromMap(data));
     }
     projectList = sob2023;
 
-
     response = await rootBundle.loadString('assets/projects/sob/sob2022.json');
     jsonList = await json.decode(response);
     for (var data in jsonList) {
@@ -53,23 +45,20 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
     }
   }
 
-
   @override
   void initState() {
     getProjectFunction = initializeProjectLists();
     super.initState();
   }
 
-
   void searchTag(String searchTag) {
     projectList = projectList
         .where((SobProjectModal element) =>
-        element.organization.contains(searchTag))
+            element.organization.contains(searchTag))
         .toList();
     setState(() {});
   }
 
-
   void search(String searchText) {
     if (searchText.isEmpty) {
       switch (selectedYear) {
@@ -89,14 +78,15 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
     searchText = searchText.toLowerCase();
     projectList = projectList
         .where((SobProjectModal element) =>
-    element.name.toLowerCase().contains(searchText) ||
-        element.mentor.toLowerCase().contains(searchText) ||
-        element.organization.toLowerCase().contains(searchText) ||
-        element.description.toLowerCase().contains(searchText) ||
-        element.university.toLowerCase().contains(searchText))
+            element.name.toLowerCase().contains(searchText) ||
+            element.mentor.toLowerCase().contains(searchText) ||
+            element.organization.toLowerCase().contains(searchText) ||
+            element.description.toLowerCase().contains(searchText) ||
+            element.university.toLowerCase().contains(searchText))
         .toList();
     setState(() {});
   }
+
   List<String> languages = [
     'Rust miniscript',
     'Core Lightning',
@@ -119,10 +109,14 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
       selectedYear = 2023;
     });
   }
+
   @override
   Widget build(BuildContext context) {
-    var height = MediaQuery.sizeOf(context).height;
-    var width = MediaQuery.sizeOf(context).width;
+    // var height = MediaQuery.sizeOf(context).height;
+    // var width = MediaQuery.sizeOf(context).width;
+    ScreenUtilInit(
+      designSize: Size(360, 690),
+    );
     return RefreshIndicator(
       onRefresh: _refresh,
       child: Scaffold(
@@ -136,8 +130,9 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                 return const Center(child: CircularProgressIndicator());
               } else if (snapshot.connectionState == ConnectionState.done) {
                 return Padding(
-                  padding:
-                  const EdgeInsets.symmetric(horizontal: 46, vertical: 16),
+                  padding: EdgeInsets.symmetric(
+                      horizontal: ScreenUtil().setWidth(46),
+                      vertical: ScreenUtil().setHeight(16)),
                   child: Column(
                     crossAxisAlignment: CrossAxisAlignment.stretch,
                     children: [
@@ -170,8 +165,9 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                               color: Color(0xFFEEEEEE),
                             ),
                           ),
-                          contentPadding: const EdgeInsets.symmetric(
-                              vertical: 12.0, horizontal: 20.0),
+                          contentPadding: EdgeInsets.symmetric(
+                              vertical: ScreenUtil().setHeight(12),
+                              horizontal: ScreenUtil().setWidth(20)),
                         ),
                         onFieldSubmitted: (value) {
                           search(value.trim());
@@ -182,14 +178,14 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                           }
                         },
                       ),
-                      const SizedBox(height: 20),
+                      SizedBox(height: ScreenUtil().setHeight(20)),
                       SizedBox(
-                        height: height * 0.2,
-                        width: width,
+                        height: ScreenUtil().setHeight(50),
+                        width: ScreenUtil().setWidth(360),
                         child: GridView(
                           physics: const NeverScrollableScrollPhysics(),
                           gridDelegate:
-                          const SliverGridDelegateWithFixedCrossAxisCount(
+                              const SliverGridDelegateWithFixedCrossAxisCount(
                             crossAxisCount: 2,
                             childAspectRatio: 1.5 / 0.6,
                             crossAxisSpacing: 15,
@@ -238,8 +234,8 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                           ],
                         ),
                       ),
-                      const SizedBox(
-                        height: 20,
+                      SizedBox(
+                        height: ScreenUtil().setHeight(20),
                       ),
                       Row(
                         crossAxisAlignment: CrossAxisAlignment.center,
@@ -250,7 +246,7 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                             style: TextStyle(fontWeight: FontWeight.w400),
                           ),
                           Padding(
-                            padding: const EdgeInsets.all(8.0),
+                            padding: EdgeInsets.all(ScreenUtil().setHeight(8)),
                             child: Row(
                               crossAxisAlignment: CrossAxisAlignment.center,
                               mainAxisAlignment: MainAxisAlignment.spaceEvenly,
@@ -281,8 +277,8 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                           )
                         ],
                       ),
-                      const SizedBox(
-                        height: 20,
+                      SizedBox(
+                        height: ScreenUtil().setHeight(20),
                       ),
                       Expanded(
                         // width: width,
@@ -293,8 +289,8 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
                               padding: const EdgeInsets.symmetric(vertical: 10),
                               child: SobProjectWidget(
                                 modal: projectList[index],
-                                height: height * 0.2,
-                                width: width,
+                                height: ScreenUtil().screenHeight * 0.2,
+                                width: ScreenUtil().screenWidth,
                               ),
                             );
                           },
@@ -311,4 +307,3 @@ class _SummerOfBitcoinState extends State<SummerOfBitcoin> {
     );
   }
 }
-
diff --git a/pubspec.lock b/pubspec.lock
index 4a2f4ef..65f4ec1 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -174,6 +174,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "3.0.2"
+  flutter_screenutil:
+    dependency: "direct main"
+    description:
+      name: flutter_screenutil
+      sha256: b372c35a772a1dc84142a3b9c5ee89a390834bd258e5e6a450d9b975b985d1c9
+      url: "https://pub.dev"
+    source: hosted
+    version: "5.9.1"
   flutter_svg:
     dependency: "direct main"
     description:
@@ -252,26 +260,26 @@ packages:
     dependency: transitive
     description:
       name: leak_tracker
-      sha256: "78eb209deea09858f5269f5a5b02be4049535f568c07b275096836f01ea323fa"
+      sha256: "7f0df31977cb2c0b88585095d168e689669a2cc9b97c309665e3386f3e9d341a"
       url: "https://pub.dev"
     source: hosted
-    version: "10.0.0"
+    version: "10.0.4"
   leak_tracker_flutter_testing:
     dependency: transitive
     description:
       name: leak_tracker_flutter_testing
-      sha256: b46c5e37c19120a8a01918cfaf293547f47269f7cb4b0058f21531c2465d6ef0
+      sha256: "06e98f569d004c1315b991ded39924b21af84cf14cc94791b8aea337d25b57f8"
       url: "https://pub.dev"
     source: hosted
-    version: "2.0.1"
+    version: "3.0.3"
   leak_tracker_testing:
     dependency: transitive
     description:
       name: leak_tracker_testing
-      sha256: a597f72a664dbd293f3bfc51f9ba69816f84dcd403cdac7066cb3f6003f3ab47
+      sha256: "6ba465d5d76e67ddf503e1161d1f4a6bc42306f9d66ca1e8f079a47290fb06d3"
       url: "https://pub.dev"
     source: hosted
-    version: "2.0.1"
+    version: "3.0.1"
   lints:
     dependency: transitive
     description:
@@ -300,10 +308,10 @@ packages:
     dependency: transitive
     description:
       name: meta
-      sha256: d584fa6707a52763a52446f02cc621b077888fb63b93bbcb1143a7be5a0c0c04
+      sha256: "7687075e408b093f36e6bbf6c91878cc0d4cd10f409506f7bc996f68220b9136"
       url: "https://pub.dev"
     source: hosted
-    version: "1.11.0"
+    version: "1.12.0"
   path:
     dependency: transitive
     description:
@@ -473,10 +481,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: "5c2f730018264d276c20e4f1503fd1308dfbbae39ec8ee63c5236311ac06954b"
+      sha256: "9955ae474176f7ac8ee4e989dadfb411a58c30415bcfb648fa04b2b8a03afa7f"
       url: "https://pub.dev"
     source: hosted
-    version: "0.6.1"
+    version: "0.7.0"
   timeline_tile:
     dependency: "direct main"
     description:
@@ -593,10 +601,10 @@ packages:
     dependency: transitive
     description:
       name: vm_service
-      sha256: b3d56ff4341b8f182b96aceb2fa20e3dcb336b9f867bc0eafc0de10f1048e957
+      sha256: "3923c89304b715fb1eb6423f017651664a03bf5f4b29983627c4da791f74a4ec"
       url: "https://pub.dev"
     source: hosted
-    version: "13.0.0"
+    version: "14.2.1"
   web:
     dependency: transitive
     description:
diff --git a/pubspec.yaml b/pubspec.yaml
index 18512c6..40931d4 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -41,6 +41,7 @@ dependencies:
   adaptive_theme: ^3.6.0
   timeline_tile: ^2.0.0
   flutter_svg: ^2.0.10+1
+  flutter_screenutil: ^5.9.1
 
 dev_dependencies:
   awesome_notifications: ^0.9.3+1