From ef7831188b48329935771136a772b88cbcdf3d62 Mon Sep 17 00:00:00 2001
From: Bonnette <bonnetteumu@gmail.com>
Date: Fri, 26 Sep 2025 23:49:41 +0300
Subject: [PATCH] fixed the responsiveness

---
 carbontrack/src/app/emissions/page.tsx | 6 +++---
 carbontrack/src/app/factory/page.tsx   | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/carbontrack/src/app/emissions/page.tsx b/carbontrack/src/app/emissions/page.tsx
index 63386bf..9a18971 100644
--- a/carbontrack/src/app/emissions/page.tsx
+++ b/carbontrack/src/app/emissions/page.tsx
@@ -72,13 +72,13 @@ export default function EmissionsHeatmapPage() {
     const selectedDateObj = selectedDate ? new Date(selectedDate) : null;
     return (
         <SidebarLayout>
-            <div className="flex flex-col items-center min-h-[calc(100vh-60px)] p-10">
-                <div className="flex justify-end w-16 ml-350 space-x-4">
+            <div className="flex flex-col items-center min-h-[calc(100vh-60px)] 2xl:w-[100%] xl:w-[80%] 2xl:p-10 xl:p-7">
+                <div className="flex justify-end 2xl:p-10w-16 2xl:ml-350 xl:ml-150 space-x-4">
                     <Link href=""><IoSettingsOutline className="text-[#F79B72] w-7 h-7 cursor-pointer hover:text-[#2A4759]" /></Link>
                     <Link href="/ktda-profile"><IoPersonOutline className="text-[#F79B72] w-7 h-7 cursor-pointer hover:text-[#2A4759]" /></Link>
                 </div>
                 <div className="font-bold 2xl:text-[48px] xl:text-[40px] lg:text-[19px] 2xl:ml-0 xl:ml-0 lg:ml-12 2xl:mb-[15px] xl:mb-[10px] lg:mb-[0px] tracking-wide w-full">Factory Emissions</div>
-                <div className="bg-[#161C22] text-white rounded-[18px] shadow-[0_2px_24px_#0003] 2xl:p-[36px_40px] xl:p-[36px_40px] lg:p-[0px_0px] flex flex-col w-full 2xl:max-w-screen-2xl xl:max-w-screen-xl lg:max-w-screen-0.5xl 2xl:mt-10 xl:mt-1 lg:mt-0">
+                <div className="bg-[#161C22] text-white rounded-[18px] shadow-[0_2px_24px_#0003] 2xl:p-[36px_40px] xl:p-[10px_10px] lg:p-[0px_0px] flex flex-col w-full 2xl:max-w-screen-2xl xl:max-w-screen-xl lg:max-w-screen-0.5xl 2xl:mt-10 xl:mt-1 lg:mt-0">
                     <div className="2xl:mb-6 xl:mb-1 lg:mb-0 2xl:ml-0 xl:ml-0 lg:ml-5 2xl:pt-0 xl:pt-0 lg:pt-0.5  flex items-center">
                         <Calendar
                             selectedDate={selectedDateObj}
diff --git a/carbontrack/src/app/factory/page.tsx b/carbontrack/src/app/factory/page.tsx
index 6484807..560e400 100644
--- a/carbontrack/src/app/factory/page.tsx
+++ b/carbontrack/src/app/factory/page.tsx
@@ -38,7 +38,7 @@ export default function FactoryEmissionLeaderboard() {
     return (
         <SidebarLayout>
             <div className="p-2 min-h-screen text-white mx-auto ml-10 pt-9">
-                <div className="flex justify-end w-16 ml-350 space-x-4">
+                <div className="flex justify-end w-16 2xl:ml-350 xl:ml-200 space-x-4">
                    
                     <Link href="/ktda-profile">
                         <IoPersonOutline className="text-[#F79B72] w-7 h-7 cursor-pointer hover:text-[#2A4759]" />
@@ -56,7 +56,7 @@ export default function FactoryEmissionLeaderboard() {
                         />
                     </div>
                 </div>
-                <table className="2xl:w-[80vw] xl:w-[75vw] lg:w-[75vw] table-fixed border-collapse border border-gray-700 text-left rounded-[10px]">
+                <table className="2xl:w-[80vw] xl:w-[65vw] lg:w-[75vw] table-fixed border-collapse border border-gray-700 text-left rounded-[10px]">
                     <thead>
                         <tr className="bg-[#2A4759] text-white border border-gray-700 2xl:text-[16px] xl:text-[16px] lg:text-[13px]">
                             <th className="2xl:p-5 xl:p-4 lg:p-3 w-1/3 border border-gray-700 ">Factory</th>