From c90f66f0cd76e7888f21a78bd35dc2b96bedcb3b Mon Sep 17 00:00:00 2001
From: Nathan Vasse <nathan.vasse@gmail.com>
Date: Mon, 4 Sep 2023 15:40:39 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84(react)=20hide=20input=20number=20a?=
 =?UTF-8?q?rrows?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

During our last meeting regarding the QA the designer told us to remove
the arrows on the number input. We can still change the value with the
keyboard arrows, so it does not cause a11y issues.
---
 .changeset/nice-apricots-sneeze.md                   | 5 +++++
 packages/react/src/components/Forms/Input/index.scss | 9 +++++++++
 2 files changed, 14 insertions(+)
 create mode 100644 .changeset/nice-apricots-sneeze.md

diff --git a/.changeset/nice-apricots-sneeze.md b/.changeset/nice-apricots-sneeze.md
new file mode 100644
index 0000000..2b82b72
--- /dev/null
+++ b/.changeset/nice-apricots-sneeze.md
@@ -0,0 +1,5 @@
+---
+"@openfun/cunningham-react": minor
+---
+
+hide input number arrows
diff --git a/packages/react/src/components/Forms/Input/index.scss b/packages/react/src/components/Forms/Input/index.scss
index 09458fa..07df6b3 100644
--- a/packages/react/src/components/Forms/Input/index.scss
+++ b/packages/react/src/components/Forms/Input/index.scss
@@ -34,6 +34,15 @@
       align-items: center;
     }
 
+    &::-webkit-outer-spin-button, &::-webkit-inner-spin-button {
+      -webkit-appearance: none;
+      margin: 0;
+    }
+
+    &[type=number] {
+      -moz-appearance: textfield;
+    }
+
     &--medium {
       min-width: 150px;
     }