Burndown styling improvements

docs/styles.md

@@ -104,11 +104,19 @@ Various Codicon icons have been used in this extension. Check [here](https://cod
 - `kanbn-burndown`
 - `kanbn-burndown-settings`
 - `kanbn-burndown-settings-sprint-select`
+- `kanbn-burndown-settings-input`
 - `kanbn-burndown-settings-start-date`
 - `kanbn-burndown-settings-end-date`
 - `kanbn-burndown-settings-sprint-mode`
 - `kanbn-burndown-settings-date-mode`
 - `kanbn-header-button-active`
 - `kanbn-header-button-inactive`
-- `kanbn-burndown-grid`
+- `kanbn-burndown-chart`
 - `kanbn-burndown-line`
+- `kanbn-burndown-point`
+- `kanbn-burndown-grid`
+- `kanbn-burndown-tooltip`
+- `kanbn-burndown-tooltip-date`
+- `kanbn-burndown-tooltip-workload`
+- `kanbn-burndown-tooltip-count`
+- `kanbn-burndown-tooltip-task`

src/Board.tsx

@@ -213,10 +213,10 @@ const Board = ({
                     });
                   }}
                   title={[
+                    'Start a new sprint',
                     currentSprint
-                      ? `${currentSprint.name}\nStarted ${formatDate(currentSprint.start, dateFormat)}`
+                      ? `Current sprint:\n  ${currentSprint.name}\n  Started ${formatDate(currentSprint.start, dateFormat)}`
                       : '',
-                    'Start a new sprint'
                   ].join('\n')}
                 >
                   <i className="codicon codicon-rocket"></i>

src/Burndown.tsx

@@ -80,12 +80,6 @@ const Burndown = ({ name, sprints, burndownData, dateFormat, vscode }: {
     refreshBurndownData({ sprintMode: false });
   };
   
-  const chartMin = burndownData.series.length > 0
-    ? Date.parse(burndownData.series[0].from)
-    : 'auto';
-  const chartMax = burndownData.series.length > 0
-    ? Date.parse(burndownData.series[0].to)
-    : 'auto';
   const chartData = burndownData.series.length > 0
     ? burndownData.series[0].dataPoints.map(dataPoint => ({
         x: Date.parse(dataPoint.x),
@@ -186,12 +180,19 @@ const Burndown = ({ name, sprints, burndownData, dateFormat, vscode }: {
       <div className="kanbn-burndown">
         <ResponsiveContainer width="100%" height="100%" className="kanbn-burndown-chart">
           <LineChart data={chartData}>
-            <Line className="kanbn-burndown-line" type="stepAfter" dataKey="y" />
+            <Line
+              className="kanbn-burndown-line"
+              type="stepAfter"
+              dataKey="y"
+              strokeWidth={2}
+              dot={{ className: 'kanbn-burndown-point' }}
+              isAnimationActive={false}
+            />
             <CartesianGrid className="kanbn-burndown-grid" strokeDasharray="5 5" vertical={false} />
             <XAxis
               dataKey="x"
               type="number"
-              domain={[chartMin, chartMax]}
+              domain={['dataMin', 'dataMax']}
               tickFormatter={formatXAxis}
               tickCount={6}
             />

src/index.css

@@ -546,6 +546,11 @@ body.vscode-dark .kanbn-burndown-settings-input[type="date"]::-webkit-calendar-p
     stroke: #3c7;
 }
 
+.kanbn-burndown-point {
+    stroke: var(--vscode-foreground);
+    fill: var(--vscode-editor-background);
+}
+
 .kanbn-burndown-tooltip {
     background-color: var(--vscode-menu-background);
     color: var(--vscode-menu-foreground);