Merge remote-tracking branch 'origin/refactor_dark_mood_repository'

lib/views/detail/detail_desktop_screen.dart

@@ -1,67 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
-import 'package:tm_app/core/constants/assets.dart';
-import 'package:tm_app/core/constants/strings.dart';
-import 'package:tm_app/core/utils/size_config.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_card.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
-
-class TenderDetailDesktopScreen extends StatelessWidget {
-  const TenderDetailDesktopScreen({super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      backgroundColor: Colors.white,
-      appBar: _buildAppBar(context),
-      body: SingleChildScrollView(
-        child: Padding(
-          padding: const EdgeInsets.all(16.0),
-          child: Center(
-            child: SizedBox(
-              width: 740,
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  TenderDetailHeader(isBig: true,),
-                  SizedBox(height: 24.0.h()),
-                  const TenderDetailCard(),
-                  SizedBox(height: 24.0.h()),
-                  TenderDetailActions(),
-                ],
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-
-  PreferredSizeWidget _buildAppBar(BuildContext context) {
-    return PreferredSize(
-      preferredSize: const Size.fromHeight(60),
-      child: AppBar(
-        backgroundColor: Colors.white,
-        elevation: 0,
-        titleSpacing: 0,
-        leading: IconButton(
-          icon: SvgPicture.asset(
-            AssetsManager.arrowLeft,
-            height: 24.0.w(),
-            width: 24.0.w(),
-          ),
-          onPressed: () => Navigator.pop(context),
-        ),
-        title: Text(
-          AppStrings.tenderDetailTitle,
-          style: TextStyle(
-            color: Colors.black,
-            fontWeight: FontWeight.w600,
-            fontSize: 20.0.sp(),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/detail/detail_mobile_screen.dart

@@ -1,62 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
-import 'package:tm_app/core/constants/assets.dart';
-import 'package:tm_app/core/constants/strings.dart';
-import 'package:tm_app/core/utils/size_config.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_card.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
-
-class TenderDetailMobileScreen extends StatelessWidget {
-  const TenderDetailMobileScreen({super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      backgroundColor: Colors.white,
-      appBar: _buildAppBar(context),
-      body: SingleChildScrollView(
-        child: Padding(
-          padding: const EdgeInsets.all(16.0),
-          child: Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              TenderDetailHeader(isBig: false),
-              SizedBox(height: 24.0.h()),
-              const TenderDetailCard(),
-              SizedBox(height: 24.0.h()),
-              TenderDetailActions(),
-            ],
-          ),
-        ),
-      ),
-    );
-  }
-
-  PreferredSizeWidget _buildAppBar(BuildContext context) {
-    return PreferredSize(
-      preferredSize: const Size.fromHeight(60),
-      child: AppBar(
-        backgroundColor: Colors.white,
-        elevation: 0,
-        titleSpacing: 0,
-        leading: IconButton(
-          icon: SvgPicture.asset(
-            AssetsManager.arrowLeft,
-            height: 24.0.w(),
-            width: 24.0.w(),
-          ),
-          onPressed: () => Navigator.pop(context),
-        ),
-        title: Text(
-          AppStrings.tenderDetailTitle,
-          style: TextStyle(
-            color: Colors.black,
-            fontWeight: FontWeight.w600,
-            fontSize: 20.0.sp(),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/detail/detail_screen.dart

@@ -1,24 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:tm_app/core/utils/display_size_detector.dart';
-import 'package:tm_app/views/detail/detail_desktop_screen.dart';
-import 'package:tm_app/views/detail/detail_mobile_screen.dart';
-import 'package:tm_app/views/detail/detail_tablet_screen.dart';
-
-class TenderDetailScreen extends StatelessWidget {
-  const TenderDetailScreen({super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    final displaySize = MediaQuery.of(context).size.displaySize;
-
-    switch (displaySize) {
-      case DisplaySize.large:
-      case DisplaySize.medium:
-        return const TenderDetailDesktopScreen();
-      case DisplaySize.small:
-        return const TenderDetailTabletScreen();
-      case DisplaySize.extraSmall:
-        return const TenderDetailMobileScreen();
-    }
-  }
-}

lib/views/detail/detail_tablet_screen.dart

@@ -1,67 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
-import 'package:tm_app/core/constants/assets.dart';
-import 'package:tm_app/core/constants/strings.dart';
-import 'package:tm_app/core/utils/size_config.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_card.dart';
-import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
-
-class TenderDetailTabletScreen extends StatelessWidget {
-  const TenderDetailTabletScreen({super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      backgroundColor: Colors.white,
-      appBar: _buildAppBar(context),
-      body: SingleChildScrollView(
-        child: Padding(
-          padding: const EdgeInsets.all(16.0),
-          child: Center(
-            child: SizedBox(
-              width: 768,
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  TenderDetailHeader(isBig: true,),
-                  SizedBox(height: 24.0.h()),
-                  const TenderDetailCard(),
-                  SizedBox(height: 24.0.h()),
-                  TenderDetailActions(),
-                ],
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-
-  PreferredSizeWidget _buildAppBar(BuildContext context) {
-    return PreferredSize(
-      preferredSize: const Size.fromHeight(60),
-      child: AppBar(
-        backgroundColor: Colors.white,
-        elevation: 0,
-        titleSpacing: 0,
-        leading: IconButton(
-          icon: SvgPicture.asset(
-            AssetsManager.arrowLeft,
-            height: 24.0.w(),
-            width: 24.0.w(),
-          ),
-          onPressed: () => Navigator.pop(context),
-        ),
-        title: Text(
-          AppStrings.tenderDetailTitle,
-          style: TextStyle(
-            color: Colors.black,
-            fontWeight: FontWeight.w600,
-            fontSize: 20.0.sp(),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/detail/pages/detail_desktop_page.dart

@@ -0,0 +1,103 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/constants/assets.dart';
+import 'package:tm_app/core/constants/strings.dart';
+import 'package:tm_app/core/theme/colors.dart';
+import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/view_models/tender_detail_view_model.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
+
+class TenderDetailDesktopPage extends StatefulWidget {
+  final String tenderId;
+  const TenderDetailDesktopPage({required this.tenderId, super.key});
+
+  @override
+  State<TenderDetailDesktopPage> createState() =>
+      _TenderDetailDesktopPageState();
+}
+
+class _TenderDetailDesktopPageState extends State<TenderDetailDesktopPage> {
+  @override
+  void initState() {
+    super.initState();
+    Future.microtask(() {
+      context.read<TenderDetailViewModel>().getTenderDetail(
+        id: widget.tenderId,
+      );
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      appBar: _buildAppBar(context),
+      body: Consumer<TenderDetailViewModel>(
+        builder: (context, tenderViewModel, child) {
+          if (tenderViewModel.isLoading) {
+            return const Center(
+              child: CircularProgressIndicator(color: AppColors.secondary50),
+            );
+          }
+
+          if (tenderViewModel.errorMessage != null) {
+            return Center(child: Text(tenderViewModel.errorMessage!));
+          }
+
+          final detail = tenderViewModel.tenderDetail;
+          if (detail == null) {
+            return const Center(child: Text('No tender details available'));
+          }
+
+          return SingleChildScrollView(
+            child: Center(
+              child: SizedBox(
+                width: 740,
+                child: Padding(
+                  padding: const EdgeInsets.all(32.0),
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      TenderDetailHeader(isScreenBig: true, detail: detail),
+                      SizedBox(height: 32.0.h()),
+                      TenderDetailActions(isScreenBig: true),
+                    ],
+                  ),
+                ),
+              ),
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  PreferredSizeWidget _buildAppBar(BuildContext context) {
+    return PreferredSize(
+      preferredSize: const Size.fromHeight(60),
+      child: AppBar(
+        backgroundColor: AppColors.backgroundColor,
+        elevation: 0,
+        titleSpacing: 0,
+        leading: IconButton(
+          icon: SvgPicture.asset(
+            AssetsManager.arrowLeft,
+            height: 24.0.w(),
+            width: 24.0.w(),
+          ),
+          onPressed: () => Navigator.pop(context),
+        ),
+        title: Text(
+          AppStrings.tenderDetailTitle,
+          style: TextStyle(
+            color: AppColors.grey70,
+            fontWeight: FontWeight.w600,
+            fontSize: 20.0.sp(),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/detail/pages/detail_mobile_page.dart

@@ -0,0 +1,98 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/constants/assets.dart';
+import 'package:tm_app/core/constants/strings.dart';
+import 'package:tm_app/core/theme/colors.dart';
+import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/view_models/tender_detail_view_model.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
+
+class TenderDetailMobilePage extends StatefulWidget {
+  final String tenderId;
+  const TenderDetailMobilePage({super.key, required this.tenderId});
+
+  @override
+  State<TenderDetailMobilePage> createState() => _TenderDetailMobilePageState();
+  
+}
+
+
+class _TenderDetailMobilePageState extends State<TenderDetailMobilePage> {
+
+  @override
+void initState() {
+  super.initState();
+  Future.microtask(() {
+    context.read<TenderDetailViewModel>().getTenderDetail(id: widget.tenderId);
+  });
+}
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      appBar: _buildAppBar(context),
+      body: Consumer<TenderDetailViewModel>(
+        builder: (context, tenderViewModel, child) {
+          if (tenderViewModel.isLoading) {
+            return const Center(
+              child: CircularProgressIndicator(color: AppColors.secondary50),
+            );
+          }
+
+          if (tenderViewModel.errorMessage != null) {
+            return Center(child: Text(tenderViewModel.errorMessage!));
+          }
+
+          final detail = tenderViewModel.tenderDetail;
+          if (detail == null) {
+            return const Center(child: Text("No tender details available"));
+          }
+
+          return SingleChildScrollView(
+            child: Padding(
+              padding: const EdgeInsets.all(16.0),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  TenderDetailHeader(isScreenBig: false, detail: detail),
+                  SizedBox(height: 24.0.h()),
+                  TenderDetailActions(isScreenBig: false),
+                ],
+              ),
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  PreferredSizeWidget _buildAppBar(BuildContext context) {
+    return PreferredSize(
+      preferredSize: const Size.fromHeight(60),
+      child: AppBar(
+        backgroundColor: AppColors.backgroundColor,
+        elevation: 0,
+        titleSpacing: 0,
+        leading: IconButton(
+          icon: SvgPicture.asset(
+            AssetsManager.arrowLeft,
+            height: 24.0.w(),
+            width: 24.0.w(),
+          ),
+          onPressed: () => Navigator.pop(context),
+        ),
+        title: Text(
+          AppStrings.tenderDetailTitle,
+          style: TextStyle(
+            color: AppColors.grey70,
+            fontWeight: FontWeight.w600,
+            fontSize: 20.0.sp(),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/detail/pages/detail_screen.dart

@@ -0,0 +1,20 @@
+import 'package:flutter/material.dart';
+import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/views/detail/pages/detail_desktop_page.dart';
+import 'package:tm_app/views/detail/pages/detail_mobile_page.dart';
+import 'package:tm_app/views/detail/pages/detail_tablet_page.dart';
+import 'package:tm_app/views/shared/responsive_builder.dart';
+
+class TenderDetailScreen extends StatelessWidget {
+  const TenderDetailScreen({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SizeConfig.init(context);
+    return ResponsiveBuilder(
+      mobile: TenderDetailMobilePage(tenderId: 'JNDFKMDV-100JF',),
+      tablet: TenderDetailTabletPage(tenderId: 'JNDFKMDV-100JF',),
+      desktop: TenderDetailDesktopPage(tenderId: 'JNDFKMDV-100JF',),
+    );
+  }
+}

lib/views/detail/pages/detail_tablet_page.dart

@@ -0,0 +1,102 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/constants/assets.dart';
+import 'package:tm_app/core/constants/strings.dart';
+import 'package:tm_app/core/theme/colors.dart';
+import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/view_models/tender_detail_view_model.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_action.dart';
+import 'package:tm_app/views/detail/widgets/tender_detail_header.dart';
+
+class TenderDetailTabletPage extends StatefulWidget {
+  final String tenderId;
+  const TenderDetailTabletPage({required this.tenderId, super.key});
+
+  @override
+  State<TenderDetailTabletPage> createState() => _TenderDetailTabletPageState();
+}
+
+class _TenderDetailTabletPageState extends State<TenderDetailTabletPage> {
+  @override
+  void initState() {
+    super.initState();
+    Future.microtask(() {
+      context.read<TenderDetailViewModel>().getTenderDetail(
+        id: widget.tenderId,
+      );
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      appBar: _buildAppBar(context),
+      body: Consumer<TenderDetailViewModel>(
+        builder: (context, tenderViewModel, child) {
+          if (tenderViewModel.isLoading) {
+            return const Center(
+              child: CircularProgressIndicator(color: AppColors.secondary50),
+            );
+          }
+
+          if (tenderViewModel.errorMessage != null) {
+            return Center(child: Text(tenderViewModel.errorMessage!));
+          }
+
+          final detail = tenderViewModel.tenderDetail;
+          if (detail == null) {
+            return const Center(child: Text('No tender details available'));
+          }
+          return SingleChildScrollView(
+            child: Center(
+              child: SizedBox(
+                width: 768,
+
+                child: Padding(
+                  padding: const EdgeInsets.all(24.0),
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      TenderDetailHeader(isScreenBig: true, detail: detail),
+                      SizedBox(height: 28.0.h()),
+                      TenderDetailActions(isScreenBig: true),
+                    ],
+                  ),
+                ),
+              ),
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  PreferredSizeWidget _buildAppBar(BuildContext context) {
+    return PreferredSize(
+      preferredSize: const Size.fromHeight(60),
+      child: AppBar(
+        backgroundColor: AppColors.backgroundColor,
+        elevation: 0,
+        titleSpacing: 0,
+        leading: IconButton(
+          icon: SvgPicture.asset(
+            AssetsManager.arrowLeft,
+            height: 24.0.w(),
+            width: 24.0.w(),
+          ),
+          onPressed: () => Navigator.pop(context),
+        ),
+        title: Text(
+          AppStrings.tenderDetailTitle,
+          style: TextStyle(
+            color: AppColors.grey70,
+            fontWeight: FontWeight.w600,
+            fontSize: 20.0.sp(),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/detail/widgets/deadline_item.dart

@@ -8,156 +8,164 @@ class DeadlineItem extends StatelessWidget {
   final String approvalDate;
   final String submissionText;
   final String submissionDate;
-  final bool isBig;
+  final bool isScreenBig;
 
   const DeadlineItem({
-    required this.title, required this.approvalText, required this.approvalDate, required this.submissionText, required this.submissionDate, required this.isBig, super.key,
+    required this.title,
+    required this.approvalText,
+    required this.approvalDate,
+    required this.submissionText,
+    required this.submissionDate,
+    required this.isScreenBig,
+    super.key,
   });
 
   @override
   Widget build(BuildContext context) {
-    return isBig ? Padding(
-      padding: EdgeInsets.symmetric(vertical: 0),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          SizedBox(
-            height: 45.0.h(),
-            child: Text(
-              title,
-              style: TextStyle(
-                color: AppColors.grey80,
-                fontWeight: FontWeight.w600,
-                fontSize: 16.0.sp(),
-              ),
-            ),
-          ),
-          IntrinsicHeight(
-            child: Row(
-              children: [
-                Expanded(
-                  child: Column(
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: [
-                      Text(
-                        approvalText,
-                        style: TextStyle(
-                          color: AppColors.grey70,
-                          fontWeight: FontWeight.w400,
-                          fontSize: 14.0.sp(),
-                        ),
-                      ),
-                      SizedBox(height: 4.0.h()),
-                      Text(
-                        approvalDate,
-                        style: TextStyle(
-                          color: AppColors.grey80,
-                          fontWeight: FontWeight.w400,
-                          fontSize: 14.0.sp(),
-                        ),
-                      ),
-                    ],
+    return isScreenBig
+        ? Padding(
+          padding: EdgeInsets.symmetric(vertical: 0),
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              SizedBox(
+                height: 45.0.h(),
+                child: Text(
+                  title,
+                  style: TextStyle(
+                    color: AppColors.grey80,
+                    fontWeight: FontWeight.w600,
+                    fontSize: 16.0.sp(),
                   ),
                 ),
-                VerticalDivider(
-                  color: AppColors.grey30,
-                  thickness: 1,
-                  width: 24,
+              ),
+              IntrinsicHeight(
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          Text(
+                            approvalText,
+                            style: TextStyle(
+                              color: AppColors.grey70,
+                              fontWeight: FontWeight.w400,
+                              fontSize: 14.0.sp(),
+                            ),
+                          ),
+                          SizedBox(height: 4.0.h()),
+                          Text(
+                            approvalDate,
+                            style: TextStyle(
+                              color: AppColors.grey80,
+                              fontWeight: FontWeight.w400,
+                              fontSize: 14.0.sp(),
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+                    VerticalDivider(
+                      color: AppColors.grey30,
+                      thickness: 1,
+                      width: 24,
+                    ),
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          Text(
+                            submissionText,
+                            style: TextStyle(
+                              color: AppColors.grey70,
+                              fontWeight: FontWeight.w400,
+                              fontSize: 14.0.sp(),
+                            ),
+                          ),
+                          SizedBox(height: 4.0.h()),
+                          Text(
+                            submissionDate,
+                            style: TextStyle(
+                              color: AppColors.grey80,
+                              fontWeight: FontWeight.w400,
+                              fontSize: 14.0.sp(),
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+                  ],
                 ),
-                Expanded(
-                  child: Column(
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: [
-                      Text(
-                        submissionText,
-                        style: TextStyle(
-                          color: AppColors.grey70,
-                          fontWeight: FontWeight.w400,
-                          fontSize: 14.0.sp(),
-                        ),
-                      ),
-                      SizedBox(height: 4.0.h()),
-                      Text(
-                        submissionDate,
-                        style: TextStyle(
-                          color: AppColors.grey80,
-                          fontWeight: FontWeight.w400,
-                          fontSize: 14.0.sp(),
-                        ),
-                      ),
-                    ],
+              ),
+              SizedBox(height: 8.0.h()),
+              const Divider(),
+            ],
+          ),
+        )
+        : Padding(
+          padding: EdgeInsets.symmetric(vertical: 0),
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              SizedBox(
+                height: 45.0.h(),
+                child: Text(
+                  title,
+                  style: TextStyle(
+                    color: AppColors.grey80,
+                    fontWeight: FontWeight.w600,
+                    fontSize: 16.0.sp(),
                   ),
                 ),
-              ],
-            ),
-          ),
-          SizedBox(height: 8.0.h()),
-          const Divider(),
-        ],
-      ),
-    ) : Padding(
-      padding: EdgeInsets.symmetric(vertical: 0),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          SizedBox(
-            height: 45.0.h(),
-            child: Text(
-              title,
-              style: TextStyle(
-                color: AppColors.grey80,
-                fontWeight: FontWeight.w600,
-                fontSize: 16.0.sp(),
               ),
-            ),
-          ),
-          Row(
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            children: [
-              Text(
-                approvalText,
-                style: TextStyle(
-                  color: AppColors.grey70,
-                  fontWeight: FontWeight.w400,
-                  fontSize: 14.0.sp(),
-                ),
+              Row(
+                mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                children: [
+                  Text(
+                    approvalText,
+                    style: TextStyle(
+                      color: AppColors.grey70,
+                      fontWeight: FontWeight.w400,
+                      fontSize: 14.0.sp(),
+                    ),
+                  ),
+                  Text(
+                    approvalDate,
+                    style: TextStyle(
+                      color: AppColors.grey70,
+                      fontWeight: FontWeight.w400,
+                      fontSize: 14.0.sp(),
+                    ),
+                  ),
+                ],
               ),
-              Text(
-                approvalDate,
-                style: TextStyle(
-                  color: AppColors.grey70,
-                  fontWeight: FontWeight.w400,
-                  fontSize: 14.0.sp(),
-                ),
+              SizedBox(height: 4.0.h()),
+              Row(
+                mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                children: [
+                  Text(
+                    submissionText,
+                    style: TextStyle(
+                      color: AppColors.grey70,
+                      fontWeight: FontWeight.w400,
+                      fontSize: 14.0.sp(),
+                    ),
+                  ),
+                  Text(
+                    submissionDate,
+                    style: TextStyle(
+                      color: AppColors.grey70,
+                      fontWeight: FontWeight.w400,
+                      fontSize: 14.0.sp(),
+                    ),
+                  ),
+                ],
               ),
+              SizedBox(height: 8.0.h()),
+              const Divider(),
             ],
           ),
-          SizedBox(height: 4.0.h()),
-          Row(
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            children: [
-              Text(
-                submissionText,
-                style: TextStyle(
-                  color: AppColors.grey70,
-                  fontWeight: FontWeight.w400,
-                  fontSize: 14.0.sp(),
-                ),
-              ),
-              Text(
-                submissionDate,
-                style: TextStyle(
-                  color: AppColors.grey70,
-                  fontWeight: FontWeight.w400,
-                  fontSize: 14.0.sp(),
-                ),
-              ),
-            ],
-          ),
-          SizedBox(height: 8.0.h()),
-          const Divider(),
-        ],
-      ),
-    );
+        );
   }
 }

lib/views/detail/widgets/tender_detail_action.dart

@@ -5,31 +5,56 @@ import 'package:tm_app/core/utils/size_config.dart';
 import 'package:tm_app/views/login/widgets/login_button.dart';
 
 class TenderDetailActions extends StatelessWidget {
-  const TenderDetailActions({super.key});
+  final bool isScreenBig;
+  const TenderDetailActions({required this.isScreenBig, super.key});
 
   @override
   Widget build(BuildContext context) {
-    return Column(
-      children: [
-        BaseButton(
-          isEnabled: true,
-          text: AppStrings.tenderSubmitButton,
-          backgroundColor: AppColors.lightBlue,
-          textColor: AppColors.mainBlue,
-          onPressed: () {},
-        ),
-        SizedBox(height: 16.0.h()),
-        BaseButton(
-          isEnabled: true,
-          text: AppStrings.tenderRejectButton,
-          borderColor: AppColors.red10,
-          textColor: AppColors.red10,
-          backgroundColor: Colors.white,
-          borderWidth: 1,
-          onPressed: () {},
-        ),
-        SizedBox(height: 16.0.h()),
-      ],
-    );
+    return isScreenBig
+        ? Row(
+          children: [
+            Spacer(),
+            BaseButton(
+              isEnabled: true,
+              text: AppStrings.tenderRejectButton,
+              textColor: AppColors.red10,
+              backgroundColor: AppColors.backgroundColor,
+              borderWidth: 1,
+              onPressed: () {},
+              width: 120.0.w(),
+            ),
+            SizedBox(width: 5.0.w()),
+            BaseButton(
+              isEnabled: true,
+              text: AppStrings.tenderSubmitButton,
+              backgroundColor: AppColors.lightBlue,
+              textColor: AppColors.mainBlue,
+              onPressed: () {},
+              width: 120.0.w(),
+            ),
+          ],
+        )
+        : Column(
+          children: [
+            BaseButton(
+              isEnabled: true,
+              text: AppStrings.tenderSubmitButton,
+              backgroundColor: AppColors.lightBlue,
+              textColor: AppColors.mainBlue,
+              onPressed: () {},
+            ),
+            SizedBox(height: 16.0.h()),
+            BaseButton(
+              isEnabled: true,
+              text: AppStrings.tenderRejectButton,
+              borderColor: AppColors.red10,
+              textColor: AppColors.red10,
+              backgroundColor: AppColors.backgroundColor,
+              borderWidth: 1,
+              onPressed: () {},
+            ),
+            SizedBox(height: 16.0.h()),
+          ],
+        );
   }
 }

lib/views/detail/widgets/tender_detail_card.dart

@@ -20,11 +20,11 @@ class TenderDetailCard extends StatelessWidget {
           Row(
             mainAxisAlignment: MainAxisAlignment.spaceBetween,
             children: [
-              const Text(
+              Text(
                 AppStrings.tenderMatchProfile,
                 style: TextStyle(
-                  fontSize: 12.0,
-                  color: Colors.black87,
+                  fontSize: 12.0.sp(),
+                  color: AppColors.grey80,
                   fontWeight: FontWeight.w400,
                 ),
               ),
@@ -46,7 +46,7 @@ class TenderDetailCard extends StatelessWidget {
               value: 0.75,
               backgroundColor: AppColors.grey20,
               valueColor: AlwaysStoppedAnimation<Color>(AppColors.jellyBean),
-              minHeight: 6,
+              minHeight: 6.0.h(),
             ),
           ),
           SizedBox(height: 16.0.h()),
@@ -54,26 +54,26 @@ class TenderDetailCard extends StatelessWidget {
           Row(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              const Icon(Icons.warning_rounded, color: Colors.red),
+              const Icon(Icons.warning_rounded, color: AppColors.red),
               SizedBox(width: 8.0.w()),
               Expanded(
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
-                  children: const [
+                  children: [
                     Text(
                       AppStrings.tenderIncompleteResume,
                       style: TextStyle(
                         fontWeight: FontWeight.w600,
-                        fontSize: 16.0,
-                        color: Colors.black87,
+                        fontSize: 16.0.sp(),
+                        color: AppColors.grey80,
                       ),
                     ),
-                    SizedBox(height: 4.0),
+                    SizedBox(height: 4.0.h()),
                     Text(
                       AppStrings.tenderNoExperience,
                       style: TextStyle(
-                        fontSize: 14.0,
-                        color: Colors.black54,
+                        fontSize: 14.0.sp(),
+                        color: AppColors.grey70,
                         fontWeight: FontWeight.w400,
                       ),
                     ),
@@ -86,4 +86,4 @@ class TenderDetailCard extends StatelessWidget {
       ),
     );
   }
-}
+}

lib/views/detail/widgets/tender_detail_header.dart

@@ -1,22 +1,24 @@
 import 'package:flutter/material.dart';
-import 'package:tm_app/core/constants/strings.dart';
 import 'package:tm_app/core/theme/colors.dart';
 import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/data/services/model/tender_detail_response/tender_detail_response_model.dart';
 import 'package:tm_app/views/detail/widgets/status_tag.dart';
 import 'package:tm_app/views/detail/widgets/tender_detail_info_section.dart';
 import 'package:tm_app/views/detail/widgets/tender_document_section.dart';
 import 'package:tm_app/views/detail/widgets/tender_location_section.dart';
 
 class TenderDetailHeader extends StatelessWidget {
-    final bool isBig;
-  const TenderDetailHeader({required this.isBig, super.key});
+  final bool isScreenBig;
+  final TenderDetailResponseModel detail;
+
+  const TenderDetailHeader({required this.isScreenBig, required this.detail, super.key});
 
   @override
   Widget build(BuildContext context) {
     return Container(
       padding: const EdgeInsets.all(16),
       decoration: BoxDecoration(
-        color: Colors.white,
+        color: AppColors.backgroundColor,
         borderRadius: BorderRadius.circular(5),
         border: Border.all(width: 0.5, color: AppColors.grey50),
       ),
@@ -29,10 +31,10 @@ class TenderDetailHeader extends StatelessWidget {
           SizedBox(height: 10.0.h()),
           const Divider(),
           SizedBox(height: 5.0.h()),
-          TenderDetailInfoSection(isBig: isBig,),
-          TenderLocationSection(),
+          TenderDetailInfoSection(isScreenBig: isScreenBig, detail: detail),
+          TenderLocationSection(detail: detail),
           SizedBox(height: 16.0.h()),
-          TenderDocumentSection(),
+          TenderDocumentSection(detail: detail),
         ],
       ),
     );
@@ -42,15 +44,15 @@ class TenderDetailHeader extends StatelessWidget {
     mainAxisAlignment: MainAxisAlignment.spaceBetween,
     children: [
       Text(
-        AppStrings.tenderDateExample,
+        detail.date ?? '',
         style: TextStyle(
           color: AppColors.grey60,
           fontWeight: FontWeight.w400,
           fontSize: 12.0.sp(),
         ),
       ),
-      const StatusTag(
-        text: AppStrings.tenderStatusOpen,
+      StatusTag(
+        text: detail.status ?? '',
         textColor: AppColors.cyanTeal,
         backgroundColor: AppColors.cyanAqua,
       ),
@@ -58,7 +60,7 @@ class TenderDetailHeader extends StatelessWidget {
   );
 
   Widget _buildTitle() => Text(
-    AppStrings.tenderTitleExample,
+    detail.title ?? '',
     style: TextStyle(
       color: AppColors.grey80,
       fontWeight: FontWeight.w600,

lib/views/detail/widgets/tender_detail_info_section.dart

@@ -1,12 +1,14 @@
 import 'package:flutter/material.dart';
 import 'package:tm_app/core/constants/strings.dart';
+import 'package:tm_app/data/services/model/tender_detail_response/tender_detail_response_model.dart';
 import 'package:tm_app/views/detail/widgets/deadline_item.dart';
 import 'package:tm_app/views/detail/widgets/info_item.dart';
 
 class TenderDetailInfoSection extends StatelessWidget {
-    final bool isBig;
+  final bool isScreenBig;
+  final TenderDetailResponseModel detail;
 
-  const TenderDetailInfoSection({required this.isBig ,super.key});
+  const TenderDetailInfoSection({required this.isScreenBig, required this.detail, super.key});
 
   @override
   Widget build(BuildContext context) {
@@ -15,26 +17,27 @@ class TenderDetailInfoSection extends StatelessWidget {
       children: [
         InfoItem(
           title: AppStrings.tenderIdLabel,
-          value: AppStrings.tenderIdExample,
+          value: detail.id ?? '',
         ),
         DeadlineItem(
           title: AppStrings.tenderDeadlineLabel,
           approvalText: AppStrings.tenderApprovalText,
-          approvalDate: AppStrings.tenderApprovalDateExample,
+          approvalDate: detail.approvalDate ?? '',
           submissionText: AppStrings.tenderSubmissionText,
-          submissionDate: AppStrings.tenderSubmissionDateExample, isBig: isBig,
+          submissionDate: detail.submissionDate ?? '',
+          isScreenBig: isScreenBig,
         ),
         InfoItem(
           title: AppStrings.tenderClientLabel,
-          value: AppStrings.tenderClientExample,
+          value: detail.client ?? '',
         ),
         InfoItem(
           title: AppStrings.tenderDeliveryLocationsLabel,
-          value: AppStrings.tenderDeliveryLocationExample,
+          value: detail.deliveryLocation ?? '',
         ),
         InfoItem(
           title: AppStrings.tenderReferenceNumberLabel,
-          value: AppStrings.tenderReferenceNumberExample,
+          value: detail.referenceNumber ?? '',
         ),
       ],
     );

lib/views/detail/widgets/tender_document_section.dart

@@ -1,29 +1,38 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:tm_app/core/constants/assets.dart';
-import 'package:tm_app/core/constants/strings.dart';
+import 'package:tm_app/core/theme/colors.dart';
 import 'package:tm_app/core/utils/size_config.dart';
-
+import 'package:tm_app/data/services/model/tender_detail_response/tender_detail_response_model.dart';
 class TenderDocumentSection extends StatelessWidget {
-  const TenderDocumentSection({super.key});
+  final TenderDetailResponseModel detail;
+
+  const TenderDocumentSection({super.key, required this.detail});
 
   @override
   Widget build(BuildContext context) {
-    return Column(
-      crossAxisAlignment: CrossAxisAlignment.start,
-      children: [
-        SvgPicture.asset(AssetsManager.export),
-        SizedBox(height: 6.0.h()),
-        Text(
-          AppStrings.tenderPdfDocument,
-          style: TextStyle(
-            fontWeight: FontWeight.w400,
-            fontSize: 16.0.sp(),
-            color: Colors.blue,
-            decoration: TextDecoration.underline,
+    return InkWell(
+      onTap: () {
+        if (detail.documentUrl != null) {
+          //launchUrl(Uri.parse(detail.documentUrl!));
+        }
+      },
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          SvgPicture.asset(AssetsManager.export),
+          SizedBox(height: 6.0.h()),
+          Text(
+            detail.documentName ?? '',
+            style: TextStyle(
+              fontWeight: FontWeight.w400,
+              fontSize: 16.0.sp(),
+              color: AppColors.textBlue,
+              decoration: TextDecoration.underline,
+            ),
           ),
-        ),
-      ],
+        ],
+      ),
     );
   }
 }

lib/views/detail/widgets/tender_location_section.dart

@@ -4,9 +4,12 @@ import 'package:tm_app/core/constants/assets.dart';
 import 'package:tm_app/core/constants/strings.dart';
 import 'package:tm_app/core/theme/colors.dart';
 import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/data/services/model/tender_detail_response/tender_detail_response_model.dart';
 
 class TenderLocationSection extends StatelessWidget {
-  const TenderLocationSection({super.key});
+  final TenderDetailResponseModel detail;
+
+  const TenderLocationSection({super.key, required this.detail});
 
   @override
   Widget build(BuildContext context) {
@@ -18,7 +21,7 @@ class TenderLocationSection extends StatelessWidget {
           SizedBox(
             height: 45.0.h(),
             child: Text(
-              AppStrings.tenderReferenceNumberLabel,
+              detail.locationTitle ?? '',
               style: TextStyle(
                 color: AppColors.grey80,
                 fontWeight: FontWeight.w600,
@@ -35,7 +38,7 @@ class TenderLocationSection extends StatelessWidget {
               ),
               SizedBox(width: 4.0.w()),
               Text(
-                AppStrings.tenderLocationCountry,
+                detail.country ?? '',
                 style: TextStyle(
                   color: AppColors.grey70,
                   fontSize: 14.0.sp(),
@@ -44,7 +47,7 @@ class TenderLocationSection extends StatelessWidget {
               ),
               SizedBox(width: 4.0.w()),
               Image.asset(
-                AssetsManager.seFlag,
+                detail.flagAsset ?? AssetsManager.seFlag,
                 height: 20.0.h(),
                 width: 20.0.w(),
               ),
@@ -57,7 +60,7 @@ class TenderLocationSection extends StatelessWidget {
           ),
           SizedBox(height: 8.0.h()),
           Text(
-            AppStrings.locationDescription,
+            detail.locationDescription ?? '',
             style: TextStyle(fontWeight: FontWeight.w400, fontSize: 14.0.sp()),
           ),
           SizedBox(height: 16.0.h()),

lib/views/login/login_desktop_screen.dart

@@ -1,94 +0,0 @@
-// lib/views/login_desktop_screen.dart
-import 'package:flutter/material.dart';
-import 'package:tm_app/core/routes/app_routes.dart';
-
-import '../../core/constants/assets.dart';
-import '../../core/constants/strings.dart';
-import '../../core/utils/size_config.dart';
-import 'widgets/widgets.dart';
-import '../../view_models/login_view_model.dart';
-
-class LoginDesktopScreen extends StatefulWidget {
-  const LoginDesktopScreen({super.key});
-
-  @override
-  State<LoginDesktopScreen> createState() => _LoginDesktopScreenState();
-}
-
-class _LoginDesktopScreenState extends State<LoginDesktopScreen> {
-  late final LoginViewModel _viewModel;
-
-  @override
-  void initState() {
-    super.initState();
-    _viewModel = LoginViewModel();
-  }
-
-  @override
-  void dispose() {
-    _viewModel.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    SizeConfig.init(context);
-    return Scaffold(
-      backgroundColor: Colors.white,
-      body: Center(
-        child: SingleChildScrollView(
-          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
-          child: SizedBox(
-            width: 120.0.w(),
-            child: ListenableBuilder(
-              listenable: _viewModel,
-              builder: (context, _) {
-                return Column(
-                  mainAxisSize: MainAxisSize.min,
-                  children: [
-                    LoginLogo(width: 190.0.w(), height: 88.0.h()),
-                    SizedBox(height: 32.0.h()),
-                    const LoginTitle(),
-                    SizedBox(height: 32.0.h()),
-
-                    LoginTextField(
-                      controller: _viewModel.usernameController,
-                      focusNode: _viewModel.usernameFocus,
-                      label: AppStrings.usernameLabel,
-                      iconPath: AssetsManager.userIcon,
-                      fieldHeight: 60.0.h(),
-                      borderRedus: 4.0.w(),
-                      prefixIconPadding: 4.0.w(),
-                    ),
-                    SizedBox(height: 16.0.h()),
-
-                    LoginTextField(
-                      controller: _viewModel.passwordController,
-                      focusNode: _viewModel.passwordFocus,
-                      label: AppStrings.passwordLabel,
-                      iconPath: AssetsManager.passwordIcon,
-                      prefixIconPadding: 4.0.w(),
-                      isPassword: true,
-                      obscureText: _viewModel.obscurePassword,
-                      fieldHeight: 60.0.h(),
-                      onToggleVisibility: _viewModel.togglePasswordVisibility,
-                      borderRedus: 4.0.w(),
-                    ),
-                    SizedBox(height: 32.0.h()),
-
-                    BaseButton(
-                      isEnabled: _viewModel.isLoginEnabled,
-                      onPressed: _viewModel.isLoginEnabled
-                          ? () => HomeRouteData().go(context)
-                          : null,
-                    ),
-                  ],
-                );
-              },
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/login/login_mobile_screen.dart

@@ -1,88 +0,0 @@
-// lib/views/login_screen.dart
-import 'package:flutter/material.dart';
-import 'package:tm_app/core/routes/app_routes.dart';
-
-import '../../core/constants/assets.dart';
-import '../../core/constants/strings.dart';
-import '../../core/utils/size_config.dart';
-import 'widgets/widgets.dart';
-import '../../view_models/login_view_model.dart';
-
-class LoginMobileScreen extends StatefulWidget {
-  const LoginMobileScreen({super.key});
-
-  @override
-  State<LoginMobileScreen> createState() => _LoginMobileScreenState();
-}
-
-class _LoginMobileScreenState extends State<LoginMobileScreen> {
-  late final LoginViewModel _viewModel;
-
-  @override
-  void initState() {
-    super.initState();
-    _viewModel = LoginViewModel();
-  }
-
-  @override
-  void dispose() {
-    _viewModel.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    SizeConfig.init(context);
-
-    return Scaffold(
-      backgroundColor: Colors.white,
-      body: Center(
-        child: SingleChildScrollView(
-          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
-          child: ListenableBuilder(
-            listenable: _viewModel,
-            builder: (context, _) {
-              return Column(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  LoginLogo(width: 190.0.w(), height: 88.0.h()),
-                  SizedBox(height: 32.0.h()),
-                  const LoginTitle(),
-                  SizedBox(height: 32.0.h()),
-
-                  LoginTextField(
-                    controller: _viewModel.usernameController,
-                    focusNode: _viewModel.usernameFocus,
-                    label: AppStrings.usernameLabel,
-                    iconPath: AssetsManager.userIcon,
-                  ),
-                  SizedBox(height: 16.0.h()),
-
-                  LoginTextField(
-                    controller: _viewModel.passwordController,
-                    focusNode: _viewModel.passwordFocus,
-                    label: AppStrings.passwordLabel,
-                    iconPath: AssetsManager.passwordIcon,
-                    isPassword: true,
-                    obscureText: _viewModel.obscurePassword,
-                    onToggleVisibility: _viewModel.togglePasswordVisibility,
-                  ),
-                  SizedBox(height: 32.0.h()),
-
-                  BaseButton(
-                    isEnabled: _viewModel.isLoginEnabled,
-                    onPressed: _viewModel.isLoginEnabled
-                        ? () {
-                            HomeRouteData().go(context);
-                          }
-                        : null,
-                  ),
-                ],
-              );
-            },
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/login/login_screen.dart

@@ -1,24 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:tm_app/core/utils/display_size_detector.dart';
-import 'package:tm_app/views/login/login_desktop_screen.dart';
-import 'package:tm_app/views/login/login_mobile_screen.dart';
-import 'package:tm_app/views/login/login_tablet_screen.dart';
-
-class LoginScreen extends StatelessWidget {
-  const LoginScreen({super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    final displaySize = MediaQuery.of(context).size.displaySize;
-
-    switch (displaySize) {
-      case DisplaySize.large:
-      case DisplaySize.medium:
-        return const LoginDesktopScreen();
-      case DisplaySize.small:
-        return const LoginTabletScreen();
-      case DisplaySize.extraSmall:
-        return const LoginMobileScreen();
-    }
-  }
-}

lib/views/login/login_tablet_screen.dart

@@ -1,94 +0,0 @@
-// lib/views/login_tablet_screen.dart
-import 'package:flutter/material.dart';
-import 'package:tm_app/core/routes/app_routes.dart';
-
-import '../../core/constants/assets.dart';
-import '../../core/constants/strings.dart';
-import '../../core/utils/size_config.dart';
-import 'widgets/widgets.dart';
-import '../../view_models/login_view_model.dart';
-
-class LoginTabletScreen extends StatefulWidget {
-  const LoginTabletScreen({super.key});
-
-  @override
-  State<LoginTabletScreen> createState() => _LoginTabletScreenState();
-}
-
-class _LoginTabletScreenState extends State<LoginTabletScreen> {
-  late final LoginViewModel _viewModel;
-
-  @override
-  void initState() {
-    super.initState();
-    _viewModel = LoginViewModel();
-  }
-
-  @override
-  void dispose() {
-    _viewModel.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    SizeConfig.init(context);
-    return Scaffold(
-      backgroundColor: Colors.white,
-      body: Center(
-        child: SingleChildScrollView(
-          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
-          child: SizedBox(
-            width: 120.0.w(),
-            child: ListenableBuilder(
-              listenable: _viewModel,
-              builder: (context, _) {
-                return Column(
-                  mainAxisSize: MainAxisSize.min,
-                  children: [
-                    LoginLogo(width: 190.0.w(), height: 88.0.h()),
-                    SizedBox(height: 32.0.h()),
-                    const LoginTitle(),
-                    SizedBox(height: 32.0.h()),
-
-                    LoginTextField(
-                      controller: _viewModel.usernameController,
-                      focusNode: _viewModel.usernameFocus,
-                      label: AppStrings.usernameLabel,
-                      iconPath: AssetsManager.userIcon,
-                      fieldHeight: 60.0.h(),
-                      borderRedus: 4.0.w(),
-                      prefixIconPadding: 4.0.w(),
-                    ),
-                    SizedBox(height: 16.0.h()),
-
-                    LoginTextField(
-                      controller: _viewModel.passwordController,
-                      focusNode: _viewModel.passwordFocus,
-                      label: AppStrings.passwordLabel,
-                      iconPath: AssetsManager.passwordIcon,
-                      prefixIconPadding: 4.0.w(),
-                      isPassword: true,
-                      obscureText: _viewModel.obscurePassword,
-                      fieldHeight: 60.0.h(),
-                      onToggleVisibility: _viewModel.togglePasswordVisibility,
-                      borderRedus: 4.0.w(),
-                    ),
-                    SizedBox(height: 32.0.h()),
-
-                    BaseButton(
-                      isEnabled: _viewModel.isLoginEnabled,
-                      onPressed: _viewModel.isLoginEnabled
-                          ? () => HomeRouteData().go(context)
-                          : null,
-                    ),
-                  ],
-                );
-              },
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/views/login/pages/login_desktop_page.dart

@@ -0,0 +1,90 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/routes/app_routes.dart';
+import 'package:tm_app/core/theme/colors.dart';
+
+import '../../../core/constants/assets.dart';
+import '../../../core/constants/strings.dart';
+import '../../../core/utils/size_config.dart';
+import '../../../view_models/auth_view_model.dart';
+import '../widgets/widgets.dart';
+
+class LoginDesktopPage extends StatelessWidget {
+  const LoginDesktopPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SizeConfig.init(context);
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      body: Center(
+        child: SingleChildScrollView(
+          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
+          child: SizedBox(
+            width: 526,
+            child: Consumer<AuthViewModel>(
+              builder: (context, viewModel, _) {
+                return Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    LoginLogo(width: 190.0.w(), height: 88.0.h()),
+                    SizedBox(height: 32.0.h()),
+                    const LoginTitle(),
+                    SizedBox(height: 32.0.h()),
+
+                    LoginTextField(
+                      controller: viewModel.usernameController,
+                      focusNode: viewModel.usernameFocus,
+                      label: AppStrings.usernameLabel,
+                      iconPath: AssetsManager.userIcon,
+                      fieldHeight: 60.0.h(),
+                      borderRedus: 4.0.w(),
+                      prefixIconPadding: 4.0.w(),
+                    ),
+                    SizedBox(height: 16.0.h()),
+
+                    LoginTextField(
+                      controller: viewModel.passwordController,
+                      focusNode: viewModel.passwordFocus,
+                      label: AppStrings.passwordLabel,
+                      iconPath: AssetsManager.passwordIcon,
+                      prefixIconPadding: 4.0.w(),
+                      isPassword: true,
+                      obscureText: viewModel.obscurePassword,
+                      fieldHeight: 60.0.h(),
+                      onToggleVisibility: viewModel.togglePasswordVisibility,
+                      borderRedus: 4.0.w(),
+                    ),
+                    SizedBox(height: 32.0.h()),
+
+                    if (viewModel.isLoading)
+                      const CircularProgressIndicator()
+                    else
+                      BaseButton(
+                        isEnabled: viewModel.isLoginEnabled,
+                        onPressed:
+                            viewModel.isLoginEnabled
+                                ? () async {
+                                  await viewModel.login();
+                                  if (viewModel.loggedInUser != null) {
+                                    HomeRouteData().go(context);
+                                  } else if (viewModel.errorMessage != null) {
+                                    ScaffoldMessenger.of(context).showSnackBar(
+                                      SnackBar(
+                                        content: Text(viewModel.errorMessage!),
+                                      ),
+                                    );
+                                  }
+                                }
+                                : null,
+                      ),
+                  ],
+                );
+              },
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/login/pages/login_mobile_page.dart

@@ -0,0 +1,82 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/routes/app_routes.dart';
+import 'package:tm_app/core/theme/colors.dart';
+
+import '../../../core/constants/assets.dart';
+import '../../../core/constants/strings.dart';
+import '../../../core/utils/size_config.dart';
+import '../../../view_models/auth_view_model.dart';
+import '../widgets/widgets.dart';
+
+class LoginMobilePage extends StatelessWidget {
+  const LoginMobilePage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SizeConfig.init(context);
+
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      body: Center(
+        child: SingleChildScrollView(
+          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
+          child: Consumer<AuthViewModel>(
+            builder: (context, viewModel, _) {
+              return Column(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  LoginLogo(width: 190.0.w(), height: 88.0.h()),
+                  SizedBox(height: 32.0.h()),
+                  const LoginTitle(),
+                  SizedBox(height: 32.0.h()),
+
+                  LoginTextField(
+                    controller: viewModel.usernameController,
+                    focusNode: viewModel.usernameFocus,
+                    label: AppStrings.usernameLabel,
+                    iconPath: AssetsManager.userIcon,
+                  ),
+                  SizedBox(height: 16.0.h()),
+
+                  LoginTextField(
+                    controller: viewModel.passwordController,
+                    focusNode: viewModel.passwordFocus,
+                    label: AppStrings.passwordLabel,
+                    iconPath: AssetsManager.passwordIcon,
+                    isPassword: true,
+                    obscureText: viewModel.obscurePassword,
+                    onToggleVisibility: viewModel.togglePasswordVisibility,
+                  ),
+                  SizedBox(height: 32.0.h()),
+
+                  if (viewModel.isLoading)
+                    const CircularProgressIndicator()
+                  else
+                    BaseButton(
+                      isEnabled: viewModel.isLoginEnabled,
+                      onPressed:
+                          viewModel.isLoginEnabled
+                              ? () async {
+                                await viewModel.login();
+                                if (viewModel.loggedInUser != null) {
+                                  HomeRouteData().go(context);
+                                } else if (viewModel.errorMessage != null) {
+                                  ScaffoldMessenger.of(context).showSnackBar(
+                                    SnackBar(
+                                      content: Text(viewModel.errorMessage!),
+                                    ),
+                                  );
+                                }
+                              }
+                              : null,
+                    ),
+                ],
+              );
+            },
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/login/pages/login_screen.dart

@@ -0,0 +1,20 @@
+import 'package:flutter/material.dart';
+import 'package:tm_app/core/utils/size_config.dart';
+import 'package:tm_app/views/login/pages/login_desktop_page.dart';
+import 'package:tm_app/views/login/pages/login_mobile_page.dart';
+import 'package:tm_app/views/login/pages/login_tablet_page.dart';
+import 'package:tm_app/views/shared/responsive_builder.dart';
+
+class LoginScreen extends StatelessWidget {
+  const LoginScreen({super.key});
+
+    @override
+  Widget build(BuildContext context) {
+    SizeConfig.init(context);
+    return ResponsiveBuilder(
+      mobile: LoginMobilePage(), 
+      tablet: LoginTabletPage(),
+      desktop: LoginDesktopPage(),
+    );
+  }
+}

lib/views/login/pages/login_tablet_page.dart

@@ -0,0 +1,90 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:tm_app/core/routes/app_routes.dart';
+import 'package:tm_app/core/theme/colors.dart';
+
+import '../../../core/constants/assets.dart';
+import '../../../core/constants/strings.dart';
+import '../../../core/utils/size_config.dart';
+import '../../../view_models/auth_view_model.dart';
+import '../widgets/widgets.dart';
+
+class LoginTabletPage extends StatelessWidget {
+  const LoginTabletPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SizeConfig.init(context);
+    return Scaffold(
+      backgroundColor: AppColors.backgroundColor,
+      body: Center(
+        child: SingleChildScrollView(
+          padding: EdgeInsets.symmetric(horizontal: 24.0.w()),
+          child: SizedBox(
+            width: 526,
+            child: Consumer<AuthViewModel>(
+              builder: (context, viewModel, _) {
+                return Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    LoginLogo(width: 190.0.w(), height: 88.0.h()),
+                    SizedBox(height: 32.0.h()),
+                    const LoginTitle(),
+                    SizedBox(height: 32.0.h()),
+
+                    LoginTextField(
+                      controller: viewModel.usernameController,
+                      focusNode: viewModel.usernameFocus,
+                      label: AppStrings.usernameLabel,
+                      iconPath: AssetsManager.userIcon,
+                      fieldHeight: 60.0.h(),
+                      borderRedus: 4.0.w(),
+                      prefixIconPadding: 4.0.w(),
+                    ),
+                    SizedBox(height: 16.0.h()),
+
+                    LoginTextField(
+                      controller: viewModel.passwordController,
+                      focusNode: viewModel.passwordFocus,
+                      label: AppStrings.passwordLabel,
+                      iconPath: AssetsManager.passwordIcon,
+                      prefixIconPadding: 4.0.w(),
+                      isPassword: true,
+                      obscureText: viewModel.obscurePassword,
+                      fieldHeight: 60.0.h(),
+                      onToggleVisibility: viewModel.togglePasswordVisibility,
+                      borderRedus: 4.0.w(),
+                    ),
+                    SizedBox(height: 32.0.h()),
+
+                    if (viewModel.isLoading)
+                      const CircularProgressIndicator()
+                    else
+                      BaseButton(
+                        isEnabled: viewModel.isLoginEnabled,
+                        onPressed:
+                            viewModel.isLoginEnabled
+                                ? () async {
+                                  await viewModel.login();
+                                  if (viewModel.loggedInUser != null) {
+                                    HomeRouteData().go(context);
+                                  } else if (viewModel.errorMessage != null) {
+                                    ScaffoldMessenger.of(context).showSnackBar(
+                                      SnackBar(
+                                        content: Text(viewModel.errorMessage!),
+                                      ),
+                                    );
+                                  }
+                                }
+                                : null,
+                      ),
+                  ],
+                );
+              },
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/login/widgets/login_button.dart

@@ -14,6 +14,7 @@ class BaseButton extends StatelessWidget {
   final double? borderWidth;
   final double? borderRadius;
   final double? elevation;
+  final double? width;
 
   const BaseButton({
     required this.isEnabled,
@@ -25,21 +26,22 @@ class BaseButton extends StatelessWidget {
     this.borderWidth,
     this.borderRadius,
     this.elevation,
+    this.width,
     super.key,
   });
 
   @override
   Widget build(BuildContext context) {
     return SizedBox(
-      width: double.infinity,
+      width: width ?? double.infinity,
       height: 55.0.h(),
       child: ElevatedButton(
         onPressed: isEnabled ? onPressed : null,
         style: ElevatedButton.styleFrom(
           backgroundColor:
               backgroundColor ??
-              (isEnabled ? AppColors.mainBlue : Colors.grey[300]),
-          foregroundColor: textColor ?? Colors.white,
+              (isEnabled ? AppColors.mainBlue : AppColors.backgroundColor),
+          foregroundColor: textColor ?? AppColors.backgroundColor,
           elevation: elevation ?? 0,
           shape: RoundedRectangleBorder(
             borderRadius: BorderRadius.circular(borderRadius ?? 28.0.w()),
@@ -54,7 +56,7 @@ class BaseButton extends StatelessWidget {
           style: TextStyle(
             fontSize: 16.0.sp(),
             fontWeight: FontWeight.bold,
-            color: textColor ?? Colors.white,
+            color: textColor ?? AppColors.backgroundColor,
           ),
         ),
       ),

lib/views/login/widgets/login_textfield.dart

@@ -52,7 +52,7 @@ class LoginTextField extends StatelessWidget {
               width: 24.0.w(),
               height: 24.0.h(),
               colorFilter: ColorFilter.mode(
-                focusNode.hasFocus ? Colors.black87 : Colors.grey,
+                focusNode.hasFocus ? AppColors.grey80 : AppColors.grey60,
                 BlendMode.srcIn,
               ),
             ),
@@ -68,7 +68,7 @@ class LoginTextField extends StatelessWidget {
                       width: 24.0.w(),
                       height: 24.0.h(),
                       colorFilter: ColorFilter.mode(
-                        focusNode.hasFocus ? Colors.black87 : Colors.grey,
+                        focusNode.hasFocus ? AppColors.grey80 : AppColors.grey60,
                         BlendMode.srcIn,
                       ),
                     ),

lib/views/login/widgets/login_title.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:tm_app/core/theme/colors.dart';
 
 import '../../../core/constants/strings.dart';
 import '../../../core/utils/size_config.dart';
@@ -20,7 +21,7 @@ class LoginTitle extends StatelessWidget {
           style: TextStyle(
             fontSize: 14.0.sp(),
             fontWeight: FontWeight.w400,
-            color: Colors.grey,
+            color: AppColors.grey60, 
           ),
           textAlign: TextAlign.center,
         ),