From c1204473ec59d71e45a642f0387cd1a0596c10f4 Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Tue, 13 Aug 2024 14:31:45 +0500
Subject: [PATCH] fix: Chip icon is too big on mobile

---
 app/components/Chip/Chip.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/components/Chip/Chip.tsx b/app/components/Chip/Chip.tsx
index 197aa49..f8282f0 100644
--- a/app/components/Chip/Chip.tsx
+++ b/app/components/Chip/Chip.tsx
@@ -14,9 +14,13 @@ export const Chip = (props: {
     >
       {props.icon_name && (
         <span
-          className={`iconify w-6 h-6 ${props.icon_name} fill-${
-            props.icon_color || "white"
-          }`}
+          className={`iconify w-4 h-4 sm:w-6 sm:h-6 ${props.icon_name}`}
+          style={
+            {
+              "color": "var(--icon-color)",
+              "--icon-color": props.icon_color || "#fff",
+            } as React.CSSProperties
+          }
         ></span>
       )}
       <p className="text-xs text-white xl:text-base">