Move image click to frame and remove image selection

sas/static/sas/css/picture.scss

@@ -48,6 +48,9 @@
       height: 100%;
       max-width: 100%;
       object-fit: contain;
+      // Prevent ugly selection when
+      // clicking to change the image
+      user-select: none;
     }
   }
 }

sas/templates/sas/picture.jinja

@@ -82,13 +82,16 @@
 
     <div class="container" id="pict">
       <div class="main">
-        <div class="photo" :aria-busy="currentPicture.imageLoading">
+        <div
+          class="photo"
+          :aria-busy="currentPicture.imageLoading"
+          @click="currentPicture = (($event.offsetX > $event.target.getBoundingClientRect().width / 2) ? nextPicture : previousPicture) ?? currentPicture"
+        >
           <img
             :src="currentPicture.compressedUrl"
             :alt="currentPicture.name"
             id="main-picture"
             x-ref="mainPicture"
-            @click="currentPicture = (($event.offsetX > $el.offsetWidth / 2) ? nextPicture : previousPicture) ?? currentPicture"
           />
         </div>