Adding hover state (#212)

bcgov · Dec 1, 2023 · 80a0372 · 80a0372
1 parent 3b0ea64
commit 80a0372
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 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
@@ -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
@@ -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;