From 479689ff462fc7d9e097fa7f42cb706b51a7aaeb Mon Sep 17 00:00:00 2001
From: Kenrick Tandrian <kenricktan11@gmail.com>
Date: Tue, 23 Dec 2025 00:17:54 +0700
Subject: [PATCH 1/2] fix(a11y): make the inner wrapper as a link

---
 static/scenes/modvil/elements/modvil-tracker-photo.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/static/scenes/modvil/elements/modvil-tracker-photo.js b/static/scenes/modvil/elements/modvil-tracker-photo.js
index 4633d9c54..b9b027581 100644
--- a/static/scenes/modvil/elements/modvil-tracker-photo.js
+++ b/static/scenes/modvil/elements/modvil-tracker-photo.js
@@ -56,12 +56,12 @@ class ModvilTrackerPhotoElement extends LitElement {
 
   render() {
     return html`
-<div class="inner">
+<a class="inner" target="_blank" href=${ifDefined(this._href)} aria-label="${this._author}">
   <slot></slot>
   <div class="attribution ${this.brand ? 'brand' : ''}">
-    <a target="_blank" href=${ifDefined(this._href)}>${this._author}</a>
+    <span>${this._author}</span>
   </div>
-</div>
+</a>
     `;
   }
 }

From 8c1c22ea691ca0f7722d3a03d3750b791fba0d82 Mon Sep 17 00:00:00 2001
From: Kenrick Tandrian <kenricktan11@gmail.com>
Date: Tue, 23 Dec 2025 00:18:25 +0700
Subject: [PATCH 2/2] fix(css): update styles

---
 .../modvil/elements/modvil-tracker-photo.scss      | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/static/scenes/modvil/elements/modvil-tracker-photo.scss b/static/scenes/modvil/elements/modvil-tracker-photo.scss
index 703d1b9c9..32a2369ae 100644
--- a/static/scenes/modvil/elements/modvil-tracker-photo.scss
+++ b/static/scenes/modvil/elements/modvil-tracker-photo.scss
@@ -28,6 +28,9 @@
   position: relative;
   transition: transform 0.4s ease-in-out, opacity 0.2s ease-in-out;
   overflow: hidden;
+  display: block;
+  color: inherit;
+  text-decoration: none;
 
   &::after {
     content: '';
@@ -53,6 +56,11 @@
   :host([destroy]) & {
     transform: translateY(0) scale(0);
   }
+
+  // Show underline on the text when the parent card (.inner) is hovered
+  &:hover>.attribution>span {
+    text-decoration: underline;
+  }
 }
 
 .attribution {
@@ -72,16 +80,12 @@
   align-items: flex-end;
   justify-content: space-between;
 
-  a {
+  span {
     color: inherit;
     text-decoration: none;
     padding: 0 10px 8.5px;
     flex-grow: 100;
 
-    &[href]:hover {
-      text-decoration: underline;
-    }
-
     &::after {
       // big click target
       content: '';