Make button light up while popover is open

components/JobImage/index.scss

@@ -59,7 +59,8 @@
     height: auto;
     z-index: 10;
 
-    &:hover .Accessory svg {
+    &:hover .Accessory svg,
+    &.Selected .Accessory svg {
       fill: var(--button-text-hover);
     }
 

components/JobImage/index.tsx

@@ -8,6 +8,7 @@ import ShieldIcon from '~public/icons/Shield.svg'
 import ManaturaIcon from '~public/icons/Manatura.svg'
 
 import './index.scss'
+import classNames from 'classnames'
 
 interface Props {
   job?: Job
@@ -53,6 +54,11 @@ const JobImage = ({
   const hasAccessory = job && job.accessory
   const image = <img alt={job?.name[locale]} src={imageUrl()} />
 
+  const classes = classNames({
+    JobAccessory: true,
+    Selected: open,
+  })
+
   function handleAccessoryButtonClicked() {
     setOpen(!open)
   }
@@ -71,7 +77,7 @@ const JobImage = ({
     return (
       <Button
         accessoryIcon={icon}
-        className="JobAccessory"
+        className={classes}
         onClick={handleAccessoryButtonClicked}
         ref={buttonRef}
       />