From 55a704b008a96afc7a6fbefe8c4a8cff5b0d2f3d Mon Sep 17 00:00:00 2001
From: Arnaud <arnaud@status.im>
Date: Fri, 1 Nov 2024 15:35:23 +0100
Subject: [PATCH] Update button icon css class

---
 src/components/ButtonIcon/ButtonIcon.tsx |  4 ++--
 src/components/ButtonIcon/buttonIcon.css | 10 +++++-----
 src/components/Dropdown/Dropdown.tsx     |  3 +--
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/components/ButtonIcon/ButtonIcon.tsx b/src/components/ButtonIcon/ButtonIcon.tsx
index 0a8b08f..a2a687e 100644
--- a/src/components/ButtonIcon/ButtonIcon.tsx
+++ b/src/components/ButtonIcon/ButtonIcon.tsx
@@ -42,7 +42,7 @@ export function ButtonIcon({
   const [animationClassName, setAnimationClassName] = useState("");
 
   const onInternalClick = () => {
-    setAnimationClassName("buttonIcon--" + animation);
+    setAnimationClassName("button-icon--" + animation);
     onClick?.();
   };
 
@@ -50,7 +50,7 @@ export function ButtonIcon({
 
   return (
     <button
-      className={`buttonIcon buttonIcon--${variant} ${className}`}
+      className={`button-icon button-icon--${variant} ${className}`}
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
       onClick={onInternalClick}
diff --git a/src/components/ButtonIcon/buttonIcon.css b/src/components/ButtonIcon/buttonIcon.css
index 88ec7b0..e214207 100644
--- a/src/components/ButtonIcon/buttonIcon.css
+++ b/src/components/ButtonIcon/buttonIcon.css
@@ -1,4 +1,4 @@
-.buttonIcon {
+.button-icon {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -11,12 +11,12 @@
   transition: box-shadow 0.35s;
   border: none;
 
-  &.buttonIcon--big {
+  &.button-icon--big {
     width: 4rem;
     height: 4rem;
   }
 
-  &.buttonIcon--small {
+  &.button-icon--small {
     width: 2rem;
     height: 2rem;
   }
@@ -31,7 +31,7 @@
     cursor: not-allowed;
   }
 
-  &.buttonIcon--buzz {
+  &.button-icon--buzz {
     -webkit-animation-name: buzz;
     animation-name: buzz;
     -webkit-animation-duration: 0.45s;
@@ -42,7 +42,7 @@
     animation-iteration-count: 5;
   }
 
-  &.buttonIcon--bounce {
+  &.button-icon--bounce {
     -webkit-animation-name: bounce;
     animation-name: bounce;
     -webkit-animation-duration: 0.6s;
diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
index fcd3a50..5ea19e2 100644
--- a/src/components/Dropdown/Dropdown.tsx
+++ b/src/components/Dropdown/Dropdown.tsx
@@ -127,7 +127,6 @@ export function Dropdown({
 
         <Input
           ref={inputRef}
-          inputClassName={classnames(["dropdown-input"])}
           onChange={onChange}
           onFocus={onInternalFocus}
           onBlur={onInternalBlur}
@@ -140,7 +139,7 @@ export function Dropdown({
           id={id}
         />
 
-        <ul className="dropdown-panel" {...attr}>
+        <ul {...attr}>
           {filtered.length ? (
             filtered.map((o) => (
               <li onClick={() => onSelect(o)} key={o.title}>