Add offset effect on hover to the doughnut charts

We need to add a small padding to avoid "clipping" the arc/slice.
This happens because when an arc/slice expands, it grows beyond the canvas
limits and get clipped.

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>

scripts/js/index.js

@@ -890,6 +890,8 @@ $(() => {
         elements: {
           arc: {
             borderColor: $(".box").css("background-color"),
+            hoverBorderColor: $(".box").css("background-color"),
+            hoverOffset: 10,
           },
         },
         plugins: {
@@ -914,6 +916,9 @@ $(() => {
         animation: {
           duration: 750,
         },
+        layout: {
+          padding: 10,
+        },
       },
     });
 
@@ -936,6 +941,8 @@ $(() => {
         elements: {
           arc: {
             borderColor: $(".box").css("background-color"),
+            hoverBorderColor: $(".box").css("background-color"),
+            hoverOffset: 10,
           },
         },
         plugins: {
@@ -960,6 +967,9 @@ $(() => {
         animation: {
           duration: 750,
         },
+        layout: {
+          padding: 10,
+        },
       },
     });