From b4ab8cbff0c3e8db274538798f2ab4f550919b61 Mon Sep 17 00:00:00 2001
From: Pritimay Sarkar <pritimay@sminnovations.in>
Date: Mon, 7 Aug 2023 09:56:23 +0530
Subject: [PATCH] fix css for bar graph and main screen

---
 src/App.css                           |  4 ++--
 src/components/TestAnalyticsGraph.css | 14 ++++++++++++++
 src/components/TestAnalyticsGraph.js  |  7 ++++---
 src/components/TestAnalyticsPie.js    |  2 +-
 4 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/App.css b/src/App.css
index 9c01bfe..466b98d 100644
--- a/src/App.css
+++ b/src/App.css
@@ -289,7 +289,7 @@ body {
   }
 
   .cards-container {
-    height: 80vh;
+    height: 90vh;
     justify-content: center;
     align-items: center;
     display: flex;
@@ -356,7 +356,7 @@ body {
   }
 
   .cards-container {
-    height: 80vh;
+    height: 90vh;
     justify-content: center;
     align-items: center;
     display: flex;
diff --git a/src/components/TestAnalyticsGraph.css b/src/components/TestAnalyticsGraph.css
index ea2b3d8..0ab9377 100644
--- a/src/components/TestAnalyticsGraph.css
+++ b/src/components/TestAnalyticsGraph.css
@@ -58,4 +58,18 @@
    font-size: x-small;
    font-weight: 400;
    padding: 0.5em;
+}
+
+div#tests-count-graph {
+   height: 180px;
+   width: 430px;
+   /* border: 2px solid #000; */
+   overflow-y: auto;
+}
+
+svg#bargraph {
+   height: 180px; /* 500px; */
+   width: 700px; /* 1100px; */
+   /* border: 1px dotted #ccc; */
+   /* background-color: #ccc; */
 }
\ No newline at end of file
diff --git a/src/components/TestAnalyticsGraph.js b/src/components/TestAnalyticsGraph.js
index 36794be..26bf373 100644
--- a/src/components/TestAnalyticsGraph.js
+++ b/src/components/TestAnalyticsGraph.js
@@ -25,11 +25,12 @@ class TestAnalyticsGraph extends Component {
 
         data.reverse();
 
-        var margin = { top: 60, right: 20, bottom: 30, left: 10 },
-            width = 520 - margin.left - margin.right,
-            height = 220 - margin.top - margin.bottom;
+        var margin = { top: 30, right: 20, bottom: 50, left: 15 },
+            width = 700 - margin.left - margin.right,
+            height = 180 - margin.top - margin.bottom;
 
         var svg = d3.select("#tests-count-graph").append('svg')
+            .attr("id", "bargraph")
             .attr("width", width + margin.left + margin.right)
             .attr("height", height + margin.top + margin.bottom)
             .append("g").attr("transform",
diff --git a/src/components/TestAnalyticsPie.js b/src/components/TestAnalyticsPie.js
index d333657..3a9435b 100644
--- a/src/components/TestAnalyticsPie.js
+++ b/src/components/TestAnalyticsPie.js
@@ -24,7 +24,7 @@ class TestAnalyticsPie extends Component {
     drawChart(data) {
         if (!data) return;
 
-        var margin = { top: 15, right: 10, bottom: 25, left: 10 },
+        var margin = { top: 15, right: 10, bottom: 45, left: 10 },
             width = 480 - margin.left - margin.right,
             height = 250 - margin.top - margin.bottom,
             radius = Math.min(width, height) / 2;