From 5e703ea6910fbdb4b093708f4e1318cd5ad08212 Mon Sep 17 00:00:00 2001
From: Samuel Couillard <43917914+scouillard@users.noreply.github.com>
Date: Tue, 31 Jan 2023 16:04:44 -0500
Subject: [PATCH] Add hover effect to back button (#4695)

---
 app/assets/stylesheets/application.bootstrap.scss         | 6 ++++++
 app/javascript/components/admin/manage_users/EditUser.jsx | 2 +-
 app/javascript/components/admin/roles/EditRole.jsx        | 2 +-
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/application.bootstrap.scss b/app/assets/stylesheets/application.bootstrap.scss
index 174f77af..1e32287f 100644
--- a/app/assets/stylesheets/application.bootstrap.scss
+++ b/app/assets/stylesheets/application.bootstrap.scss
@@ -652,3 +652,9 @@ input[type="range"]:focus::-moz-range-thumb {
   width: 150px;
   height: 150px;
 }
+
+.back-button {
+  &:hover {
+    color: var(--brand-color) !important;
+  }
+}
diff --git a/app/javascript/components/admin/manage_users/EditUser.jsx b/app/javascript/components/admin/manage_users/EditUser.jsx
index efa42d4b..c6d92052 100644
--- a/app/javascript/components/admin/manage_users/EditUser.jsx
+++ b/app/javascript/components/admin/manage_users/EditUser.jsx
@@ -42,7 +42,7 @@ export default function EditUser() {
                         <h3>{ t('admin.manage_users.edit_user')}</h3>
                       </div>
                       <Stack
-                        className="d-inline-block float-end cursor-pointer pe-2 pt-2 text-muted"
+                        className="d-inline-block float-end cursor-pointer pe-2 pt-2 text-muted back-button"
                         aria-hidden="true"
                         onClick={() => navigate('/admin/users')}
                       >
diff --git a/app/javascript/components/admin/roles/EditRole.jsx b/app/javascript/components/admin/roles/EditRole.jsx
index 5523f5db..89ac756e 100644
--- a/app/javascript/components/admin/roles/EditRole.jsx
+++ b/app/javascript/components/admin/roles/EditRole.jsx
@@ -50,7 +50,7 @@ export default function EditRole() {
                       </Breadcrumb>
                     </Stack>
                     <Stack
-                      className="d-inline-block float-end cursor-pointer pe-2 pt-2 text-muted"
+                      className="d-inline-block float-end cursor-pointer pe-2 pt-2 text-muted back-button"
                       aria-hidden="true"
                       onClick={() => navigate('/admin/roles')}
                     >
-- 
GitLab