From 80a03728e0c8b22934fb1023cf5c462cebfeda05 Mon Sep 17 00:00:00 2001
From: cnesmithsalus <69365683+cnesmithsalus@users.noreply.github.com>
Date: Fri, 1 Dec 2023 09:19:56 -0800
Subject: [PATCH] Adding hover state (#212)

---
 .../components/modal/instances/assign-officer-modal.tsx  | 2 +-
 frontend/src/assets/sass/layout.scss                     | 9 +++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/components/modal/instances/assign-officer-modal.tsx b/frontend/src/app/components/modal/instances/assign-officer-modal.tsx
index 3d6339c49..fac313907 100644
--- a/frontend/src/app/components/modal/instances/assign-officer-modal.tsx
+++ b/frontend/src/app/components/modal/instances/assign-officer-modal.tsx
@@ -102,7 +102,7 @@ export const AssignOfficerModal: FC<AssignOfficerModalProps> = ({
         </Modal.Header>
       )}
       <Modal.Body>
-        <div className="assign_officer_modal_profile_card">
+        <div className="assign_officer_modal_profile_card self-assign">
           <div className="assign_officer_modal_profile_card_column">
             <div className="assign_officer_modal_profile_card_profile-picture">
               <div
diff --git a/frontend/src/assets/sass/layout.scss b/frontend/src/assets/sass/layout.scss
index 63a63af6a..709962a3b 100644
--- a/frontend/src/assets/sass/layout.scss
+++ b/frontend/src/assets/sass/layout.scss
@@ -330,12 +330,21 @@ button.modal-buttons {
   align-self: stretch;
   flex-grow: 0;
   cursor: pointer;
+  &:hover {
+    background-color: #DEEBFF;
+    }
 }
 
 .selected {
   background-color: $gray-100;
 }
 
+.self-assign {
+  &:hover {
+    background-color: $white;
+    }
+}
+
 .assign_officer_modal_profile_card_column {
   display: flex;
   flex-direction: column;