minor refactoring to home page and graph widget

Author: Vivek Chib

lib/views/home_page.dart

@@ -119,6 +119,9 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
     final double spacing = screenMode.spacing;
 
     final animationWidget = Column(
+      spacing: spacing,
+      mainAxisAlignment: MainAxisAlignment.start,
+      mainAxisSize: MainAxisSize.min,
       children: [
         // Graph
         GraphWidget(
@@ -128,6 +131,7 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
 
         // Box Animations
         AnimationBoxes(curveAnimation: curveAnimation),
+        SizedBox(height: spacing * 2),
       ],
     );
 
@@ -214,30 +218,31 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
           ),
         ),
       ),
-      body: SingleChildScrollView(
-        child: Container(
-          alignment: Alignment.center,
-          width: MediaQuery.of(context).size.width,
-          padding: const EdgeInsets.symmetric(horizontal: 16.0),
+      body: Container(
+        alignment: Alignment.center,
+        padding: const EdgeInsets.symmetric(horizontal: 16.0),
+        width: double.infinity,
+        child: SingleChildScrollView(
           child: switch (ScreenModeWidget.of(context)) {
             ScreenMode.mobile => Column(
                 spacing: spacing,
                 children: [
                   animationWidget,
                   controlsWidget,
-                  const SizedBox(height: 10),
+                  SizedBox(height: spacing),
                 ],
               ),
             ScreenMode.tablet => Column(
                 spacing: spacing,
                 children: [
                   animationWidget,
                   controlsWidget,
-                  const SizedBox(height: 20),
+                  SizedBox(height: spacing),
                 ],
               ),
             ScreenMode.web => Row(
                 spacing: spacing,
+                mainAxisSize: MainAxisSize.min,
                 children: [
                   Expanded(
                     flex: 2,
@@ -247,6 +252,7 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
                     flex: 1,
                     child: controlsWidget,
                   ),
+                  SizedBox(width: spacing * 3),
                 ],
               ),
           },

lib/views/widgets/graph/graph_config.dart

@@ -16,7 +16,7 @@ class GraphConfiguration {
   const GraphConfiguration({
     this.xAxisLineCount = 10,
     this.yAxisLineCount = 10,
-    this.curveDivisions = 1000,
+    this.curveDivisions = 500,
     required this.axisColor,
     required this.curveLineColor,
     required this.graphMarkerColor,

lib/views/widgets/graph/graph_painter.dart

@@ -54,7 +54,7 @@ class GraphPainter extends CustomPainter {
     path.moveTo(0, (1 - points.first) * size.height);
 
     // Draw line segments based on the generated curve points
-    for (int i = 1; i < points.length; i++) {
+    for (int i = 0; i < points.length; i++) {
       // current point of the curve
       final currentX = controller.value * size.width;
       final currentY = (1 - points[i]) * size.height;

lib/views/widgets/graph/graph_widget.dart

@@ -33,7 +33,7 @@ class GraphWidget extends StatelessWidget {
 
     return SizedBox(
       width: screenSize.width * widthToTake,
-      height: screenSize.height / 2,
+      height: screenSize.height / 3,
       child: Center(
         child: CustomPaint(
           size: size,