fix: chage designed and props

app/components/dashboard/project-management/digital-innovation-page.tsx

@@ -623,19 +623,11 @@ export function DigitalInnovationPage() {
     }
   };
 
-  // const calculateAverage = (data: Array<ProcessInnovationData>) => {
-  //   let number = 0;
-  //   data.map(
-  //     (item: ProcessInnovationData) => (number = number + +item.project_rating)
-  //   );
-  //   setAvarage(number / data.length);
-  // };
-
   return (
     <DashboardLayout title="نوآوری دیجیتال">
       <div className="grid grid-cols-2 gap-8 justify-between p-6 space-y-4 h-full">
         {/* Stats Cards */}
-        <div className="flex flex-col justify-between gap-5 w-full mb-0 h-[calc(90vh-12rem)]">
+        <div className="flex flex-col gap-6  w-full mb-0">
           <div className="space-y-6 w-full">
             {/* Stats Grid */}
             <div className="grid grid-cols-2 gap-5">
@@ -706,7 +698,7 @@ export function DigitalInnovationPage() {
           </div>
 
           {/* Process Impacts Chart */}
-          <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] h-[calc(90vh-12rem)] backdrop-blur-sm rounded-lg w-full overflow-hidden">
+          <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)]  backdrop-blur-sm rounded-lg w-full overflow-hidden">
             {/* <CardContent > */}
             <CustomBarChart
               title="تاثیرات نوآوری دیجیتال به صورت درصد مقایسه ای"
@@ -746,10 +738,10 @@ export function DigitalInnovationPage() {
         </div>
 
         {/* Data Table */}
-        <Card className="bg-transparent backdrop-blur-sm rounded-lg overflow-hidden w-full h-max">
+        <Card className="bg-transparent backdrop-blur-sm rounded-lg overflow-hidden w-full h-[39.7rem]">
           <CardContent className="p-0">
             <div className="relative h-full">
-              <Table containerClassName="overflow-auto custom-scrollbar w-full h-[calc(90vh-15rem)]">
+              <Table containerClassName="overflow-auto custom-scrollbar w-full h-[36.8rem] ">
                 <TableHeader>
                   <TableRow className="bg-[#3F415A]">
                     {columns.map((column) => (
@@ -870,7 +862,7 @@ export function DigitalInnovationPage() {
                 </div>
               </div>
 
-              <div className="flex  items-center flex-row gap-4 status w-1/2 justify-center">
+              <div className="flex  items-center flex-row gap-4 status w-3/5 justify-center">
                 <div className="flex flex-row-reverse">
                   <span className="block w-7 h-2.5 bg-violet-500 rounded-tl-xl rounded-bl-xl"></span>
                   <span className="block w-7 h-2.5 bg-purple-500 "></span>

app/components/dashboard/project-management/green-innovation-page.tsx

@@ -96,7 +96,7 @@ interface InnovationStats {
   pollution_reduction: number;
   pollution_reduction_percent: number;
   waste_reduction: number;
-  waste_reduction_percent: number;
+  waste_reductionn_percent: number;
   water_recovery_reduction: number;
   water_recovery_reduction_percent: number;
   average_project_score: number;
@@ -497,9 +497,8 @@ export function GreenInnovationPage() {
 
         waste: {
           value: formatNumber(parseNum(stats.waste_reduction)),
-          percent: formatNumber(parseNum(stats.waste_reduction_percent)),
+          percent: formatNumber(parseNum(stats.waste_reductionn_percent)),
         },
-
         avarage: stats.average_project_score,
         countInnovationGreenProjects: stats.count_innovation_green_projects,
       };
@@ -683,8 +682,7 @@ export function GreenInnovationPage() {
       <div className="p-6 space-y-4">
         {/* Stats Cards */}
         <div className="flex gap-6 mb-5">
-          <div className="flex flex-col gap-11  h-full w-1/2">
+          <div className="flex flex-col justify-between h-[25.5rem] w-1/2">
-            {/* Stats Grid */}
             {loading || statsLoading
               ? // Loading skeleton for stats cards - matching new design
                 Array.from({ length: 2 }).map((_, index) => (
@@ -754,7 +752,7 @@ export function GreenInnovationPage() {
           {/* Process Impacts Chart */}
 
           {statsLoading ? (
-            <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)]  h-[calc(90vh-25rem)] backdrop-blur-sm rounded-lg w-full overflow-hidden">
+            <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)]  h-full backdrop-blur-sm rounded-lg w-full overflow-hidden">
               <CardContent className="p-0 h-full">
                 <div className="border-b-2 border-gray-500/20">
                   <div className="w-full p-4 px-6">
@@ -797,7 +795,7 @@ export function GreenInnovationPage() {
               </CardContent>
             </Card>
           ) : (
-            <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] h-[calc(90vh-27rem)] backdrop-blur-sm rounded-lg w-full overflow-hidden">
+            <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] h-full backdrop-blur-sm rounded-lg w-full overflow-hidden">
               <CardContent className="p-0 h-full overflow-hidden">
                 <div className="border-b-2 border-gray-500/20">
                   <div className="w-full p-4 px-6">

app/components/ui/custom-bar-chart.tsx

@@ -127,7 +127,7 @@ export function CustomBarChart({
                 }`}
               >
                 {item.valuePrefix || ""}
-                {formatNumber(parseFloat(displayValue))}
+                {formatNumber(parseFloat(displayValue))}%
                 {item.valueSuffix || ""}
               </span>
             </div>