Website: smoothly select rows in bar chart

If you scrub your cursor slowly down the benchmark chart, the benchmark
table appears to flicker. This is because, if the cursor is between two
chart rows, no row is selected, so every row of the table is saturated.

Fix this issue by removing the cursor dead zones between chart rows.

This commit in theory shouldn't change the visuals, but it does move
things around slightly (at least in Firefox). As best as I could, I
tried to change the hit boxes while keeping everything the same size as
before.

Author: strager

website/public/benchmarks/benchmark.css

@@ -39,6 +39,7 @@ body.javascript .javascript-only {
 .chart {
   --x-axis-label-line-height: 1.4em;
   overflow: hidden;
+  padding-top: 0.25em;
   position: relative;
 
   /* Make space for the "0 ms" and "1000 ms" labels. */
@@ -47,18 +48,16 @@ body.javascript .javascript-only {
   padding-left: var(--chart-padding-left);
   padding-right: var(--chart-padding-right);
 
-  /* Force bottom and top margins of .series to show by setting a non-zero
-     padding-bottom and padding-top. */
-  padding-top: 0.1px;
-
   /* Make room for X-axis labels. */
-  padding-bottom: calc(var(--x-axis-label-line-height) * 3);
+  padding-bottom: calc(var(--x-axis-label-line-height) * 3 + 0.25em);
 }
 
 .chart .series {
-  height: 1.75em;
-  line-height: 1.75em;
-  margin: 0.25em 0;
+  --series-vertical-padding: 0.125em;
+
+  height: 1.625em;
+  line-height: 1.625em;
+  padding: var(--series-vertical-padding) 0;
   position: relative;
   width: 100%;
 
@@ -67,9 +66,9 @@ body.javascript .javascript-only {
 }
 
 .chart .series .label {
-  bottom: 0;
+  bottom: var(--series-vertical-padding);
   position: absolute;
-  top: 0;
+  top: var(--series-vertical-padding);
   padding-left: 0.5em;
   padding-right: 0.5em;
 }
@@ -108,10 +107,10 @@ body.javascript .javascript-only {
 }
 
 .chart .series .bar {
-  bottom: 0;
+  bottom: var(--series-vertical-padding);
   left: 0;
   position: absolute;
-  top: 0;
+  top: var(--series-vertical-padding);
   width: calc(
     100% * (var(--average-x) / var(--chart-max-x)) - var(--border-width)
   );