Update styling and heading levels.

src/components/charts/LineChart.tsx

@@ -21,25 +21,26 @@ const LineChartComponent = ({
 }: LineChartComponentProps): JSX.Element => {
   const chart = useChart({
     data: [...data],
-    series: [{ name: label, color: "blue.700" }]
+    series: [{ name: label, color: "teal.500" }]
   });
 
   return (
-    <Chart.Root maxH="xs" chart={chart} maxW="100%">
+    <Chart.Root maxH="xs" chart={chart} maxW="100vw">
       <LineChart data={chart.data}>
         <CartesianGrid stroke={chart.color("border")} vertical={false} />
         <XAxis
-          // axisLine={false}
+          axisLine={false}
           dataKey={chart.key("day")}
           stroke={chart.color("border")}
-          // label={{ value: "Day", position: "bottom" }}
+        // label={{ value: "Day", position: "bottom" }}
         />
         <YAxis
-          // axisLine={false}
+          width="auto"
+          axisLine={false}
           tickLine={false}
           tickMargin={10}
           stroke={chart.color("border")}
-          // label={{ value: label, position: "left", angle: -90 }}
+        // label={{ value: label, position: "left", angle: -90 }}
         />
         <Tooltip
           animationDuration={100}