From 2c6a66b2201591c974ebae0c7031e4d33fc33cfd Mon Sep 17 00:00:00 2001
From: Nathan Vasse <nathan.vasse@gmail.com>
Date: Thu, 25 May 2023 15:43:00 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84(react)=20change=20pagination=20bor?=
 =?UTF-8?q?der=20color?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The pagination component's border color was different from the one
of other components, especially the DataGrid, which was not really
homogenous.
---
 .changeset/nasty-deers-yell.md                      | 5 +++++
 packages/react/src/components/Pagination/index.scss | 2 +-
 packages/react/src/cunningham-tokens.css            | 4 ++--
 3 files changed, 8 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/nasty-deers-yell.md

diff --git a/.changeset/nasty-deers-yell.md b/.changeset/nasty-deers-yell.md
new file mode 100644
index 0000000..6381c84
--- /dev/null
+++ b/.changeset/nasty-deers-yell.md
@@ -0,0 +1,5 @@
+---
+"@openfun/cunningham-react": patch
+---
+
+change pagination border color
diff --git a/packages/react/src/components/Pagination/index.scss b/packages/react/src/components/Pagination/index.scss
index 74826ca..90f3e38 100644
--- a/packages/react/src/components/Pagination/index.scss
+++ b/packages/react/src/components/Pagination/index.scss
@@ -5,7 +5,7 @@
     &__list {
         display: flex;
         align-items: center;
-        border: 1px var(--c--theme--colors--greyscale-200) solid;
+        border: 1px var(--c--theme--colors--greyscale-300) solid;
         border-radius: 2px;
         padding: var(--c--theme--spacings--st);
         background: var(--c--theme--colors--greyscale-000);
diff --git a/packages/react/src/cunningham-tokens.css b/packages/react/src/cunningham-tokens.css
index ad1b1d9..ed2fa2d 100644
--- a/packages/react/src/cunningham-tokens.css
+++ b/packages/react/src/cunningham-tokens.css
@@ -111,7 +111,7 @@
 	--c--components--forms-select--border-radius--focus: 2px;
 	--c--components--forms-select--border-radius--hover: 2px;
 	--c--components--forms-select--border-style: solid;
-	--c--components--forms-select--border-width: 2px;
+	--c--components--forms-select--border-width: 1px;
 	--c--components--forms-select--color: #303C4B;
 	--c--components--forms-select--font-size: 1rem;
 	--c--components--forms-select--height: 3.5rem;
@@ -130,7 +130,7 @@
 	--c--components--forms-input--border-radius: 8px;
 	--c--components--forms-input--border-radius--hover: 2px;
 	--c--components--forms-input--border-radius--focus: 2px;
-	--c--components--forms-input--border-width: 2px;
+	--c--components--forms-input--border-width: 1px;
 	--c--components--forms-input--border-color: #E7E8EA;
 	--c--components--forms-input--border-color--hover: #9EA3AA;
 	--c--components--forms-input--border-color--focus: #0556BF;