updated label height calc

w3c · Nov 15, 2023 · 240c65c · 240c65c
1 parent 46cb2bb
commit 240c65c
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/content/patterns/slider/examples/css/slider-rating.css b/content/patterns/slider/examples/css/slider-rating.css
@@ -27,11 +27,13 @@
 
 .rating-slider svg .label {
   font-size: 90%;
+  font-family: sans-serif;
   fill: currentcolor;
 }
 
 .rating-slider svg .description {
   font-size: 90%;
+  font-family: sans-serif;
   fill: canvasText;
 }
 

diff --git a/content/patterns/slider/examples/js/slider-rating.js b/content/patterns/slider/examples/js/slider-rating.js
@@ -192,8 +192,11 @@ class RatingSlider {
       rect.setAttribute('height', RAIL_HEIGHT);
       rect.removeAttribute('rx');
 
-      const labelWidth = label.getBBox().width;
-      const labelHeight = label.getBBox().height;
+      const labelWidth = Math.round(label.getBBox().width);
+      const labelHeight = Math.round(label.getBBox().height);
+
+      label.setAttribute('data-width', labelWidth);
+      label.setAttribute('data-height', labelHeight);
 
       label.setAttribute(
         'x',