From 81205da08cdf857a11d01d492c7dd200177fcd1d Mon Sep 17 00:00:00 2001
From: Quy_FE <ngocquywork99@gmail.com>
Date: Mon, 28 Apr 2025 16:04:25 +0700
Subject: [PATCH] Style : button-custom

---
 src/_components/boxChart/boxChart.scss |  4 ++--
 src/_components/renderIcon/index.js    | 16 +++++++++++-----
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/_components/boxChart/boxChart.scss b/src/_components/boxChart/boxChart.scss
index 493f533..b562dcf 100644
--- a/src/_components/boxChart/boxChart.scss
+++ b/src/_components/boxChart/boxChart.scss
@@ -22,8 +22,8 @@
   .doughnut-chart-content {}
 
   .custom-button {
-    padding: 0 32px;
-    height: 40px;
+    padding: 8px;
+    height: auto;
     border-radius: 20px;
     border: none;
     font-size: 16px;
diff --git a/src/_components/renderIcon/index.js b/src/_components/renderIcon/index.js
index 0bf0387..ec7d34a 100644
--- a/src/_components/renderIcon/index.js
+++ b/src/_components/renderIcon/index.js
@@ -139,15 +139,21 @@ export const renderIconSearchInput = () => {
     </svg>
   );
 };
-export const renderIconButton = () => {
+export const renderIconButton = (width = 24, height = 24) => {
   return (
-    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-dasharray="20" stroke-dashoffset="20" d="M3 12h17.5"><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.2s" values="20;0"/></path><path stroke-dasharray="12" stroke-dashoffset="12" d="M21 12l-7 7M21 12l-7 -7"><animate fill="freeze" attributeName="stroke-dashoffset" begin="0.2s" dur="0.2s" values="12;0"/></path></g></svg>
+    <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-dasharray="20" stroke-dashoffset="20" d="M3 12h17.5"><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.2s" values="20;0"/></path><path stroke-dasharray="12" stroke-dashoffset="12" d="M21 12l-7 7M21 12l-7 -7"><animate fill="freeze" attributeName="stroke-dashoffset" begin="0.2s" dur="0.2s" values="12;0"/></path></g></svg>
   )
 }
 
-export const renderIconButtonLeft = () => {
+export const renderIconButtonLeft = (width = 24, height = 24) => {
   return (
-    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      preserveAspectRatio="xMidYMid meet"
+    >
       <g fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" transform="rotate(180 12 12)">
         <path strokeDasharray="20" strokeDashoffset="20" d="M3 12h17.5">
           <animate fill="freeze" attributeName="stroke-dashoffset" dur="0.2s" values="20;0" />
@@ -158,7 +164,7 @@ export const renderIconButtonLeft = () => {
       </g>
     </svg>
   );
-}
+};
 
 export const renderIconDate = () => (
   <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 20 20">