From e53e52df1b6b0d7c907238976e52042ad62729c7 Mon Sep 17 00:00:00 2001
From: Moyasee <terranoiz@icloud.com>
Date: Mon, 20 Oct 2025 01:50:30 +0300
Subject: [PATCH] ci: another lint fixes

---
 .../fullscreen-image-modal.scss               | 12 +++++++
 .../fullscreen-image-modal.tsx                | 24 +++++---------
 .../pages/achievements/achievement-list.tsx   | 32 ++++++++-----------
 .../profile-content/profile-content.tsx       | 29 ++++++++---------
 4 files changed, 46 insertions(+), 51 deletions(-)

diff --git a/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.scss b/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.scss
index 439a05f0..31e65a84 100644
--- a/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.scss
+++ b/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.scss
@@ -12,6 +12,18 @@
   animation: fadeIn 0.2s ease-out;
   cursor: pointer;
 
+  &__backdrop {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: transparent;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+  }
+
   &__container {
     position: relative;
     max-width: 95vw;
diff --git a/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.tsx b/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.tsx
index fa0ca621..d4796083 100644
--- a/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.tsx
+++ b/src/renderer/src/components/fullscreen-image-modal/fullscreen-image-modal.tsx
@@ -35,27 +35,19 @@ export function FullscreenImageModal({
 
   if (!isOpen) return null;
 
-  const handleBackdropClick = (event: React.MouseEvent) => {
-    if (event.target === event.currentTarget) {
-      onClose();
-    }
-  };
-
-  const handleBackdropKeyDown = (event: React.KeyboardEvent) => {
-    if (event.key === 'Escape') {
-      onClose();
-    }
-  };
-
   return (
-    <div 
-      className="fullscreen-image-modal" 
-      onClick={handleBackdropClick}
-      onKeyDown={handleBackdropKeyDown}
+    <div
+      className="fullscreen-image-modal"
       role="dialog"
       aria-modal="true"
       tabIndex={-1}
     >
+      <button
+        type="button"
+        className="fullscreen-image-modal__backdrop"
+        onClick={onClose}
+        aria-label="Close fullscreen image"
+      />
       <div className="fullscreen-image-modal__container">
         <button
           className="fullscreen-image-modal__close-button"
diff --git a/src/renderer/src/pages/achievements/achievement-list.tsx b/src/renderer/src/pages/achievements/achievement-list.tsx
index 2cf79a2d..e7ec656b 100644
--- a/src/renderer/src/pages/achievements/achievement-list.tsx
+++ b/src/renderer/src/pages/achievements/achievement-list.tsx
@@ -66,31 +66,25 @@ export function AchievementList({
             {achievement.achievementImageUrl && achievement.unlocked && (
               <div className="achievements__item-image-container">
                 <div className="achievements__item-custom-image-wrapper">
-                  <img
-                    className="achievements__item-custom-image"
-                    src={achievement.achievementImageUrl}
-                    alt={`${achievement.displayName} screenshot`}
-                    loading="lazy"
+                  <button
+                    type="button"
+                    className="achievements__item-image-button"
                     onClick={() =>
                       handleImageClick(
-                        achievement.achievementImageUrl,
+                        achievement.achievementImageUrl!,
                         achievement.displayName
                       )
                     }
-                    onKeyDown={(e) => {
-                      if (e.key === 'Enter' || e.key === ' ') {
-                        e.preventDefault();
-                        handleImageClick(
-                          achievement.achievementImageUrl,
-                          achievement.displayName
-                        );
-                      }
-                    }}
-                    tabIndex={0}
-                    role="button"
                     aria-label={`View ${achievement.displayName} screenshot in fullscreen`}
-                    style={{ cursor: "pointer" }}
-                  />
+                    style={{ cursor: "pointer", padding: 0, border: "none", background: "transparent" }}
+                  >
+                    <img
+                      className="achievements__item-custom-image"
+                      src={achievement.achievementImageUrl}
+                      alt={`${achievement.displayName} screenshot`}
+                      loading="lazy"
+                    />
+                  </button>
                   <div className="achievements__item-custom-image-overlay">
                     <SearchIcon size={20} />
                   </div>
diff --git a/src/renderer/src/pages/profile/profile-content/profile-content.tsx b/src/renderer/src/pages/profile/profile-content/profile-content.tsx
index b2ecd031..f2f9eeff 100644
--- a/src/renderer/src/pages/profile/profile-content/profile-content.tsx
+++ b/src/renderer/src/pages/profile/profile-content/profile-content.tsx
@@ -226,28 +226,25 @@ export function ProfileContent() {
                         >
                           <div className="profile-content__souvenir-card-header">
                             <div className="profile-content__souvenir-achievement-image-wrapper">
-                              <img
-                                src={achievement.achievementImageUrl}
-                                alt={achievement.name}
-                                className="profile-content__souvenir-achievement-image"
-                                loading="lazy"
+                              <button
+                                type="button"
+                                className="profile-content__souvenir-image-button"
                                 onClick={() =>
                                   handleImageClick(
-                                    achievement.achievementImageUrl,
+                                    achievement.achievementImageUrl!,
                                     achievement.name
                                   )
                                 }
-                                onKeyDown={(e) => {
-                                  if (e.key === 'Enter' || e.key === ' ') {
-                                    e.preventDefault();
-                                    handleImageClick(achievement.achievementImageUrl, achievement.name);
-                                  }
-                                }}
-                                tabIndex={0}
-                                role="button"
                                 aria-label={`View ${achievement.name} screenshot in fullscreen`}
-                                style={{ cursor: "pointer" }}
-                              />
+                                style={{ cursor: "pointer", padding: 0, border: "none", background: "transparent" }}
+                              >
+                                <img
+                                  src={achievement.achievementImageUrl}
+                                  alt={achievement.name}
+                                  className="profile-content__souvenir-achievement-image"
+                                  loading="lazy"
+                                />
+                              </button>
                               <div className="profile-content__souvenir-achievement-image-overlay">
                                 <SearchIcon size={20} />
                               </div>