corpus

commit 096e7ad5ffa73313e5695abc320a2eda81310ac4
parent ca89de9841db55e7805180efcbf2abd73ab9f3d5
Author: mtmn <miro@haravara.org>
Date:   Sun, 12 Apr 2026 20:51:55 +0200

fix: open cover on click, genre tag css

Diffstat:
M
src/Client.purs
 | 
13
++++++-------
M
src/Main.purs
 | 
10
+++++++---

2 files changed, 13 insertions(+), 10 deletions(-)
diff --git a/src/Client.purs b/src/Client.purs
@@ -50,7 +50,7 @@ type State =
   , loading :: Boolean
   , currentTime :: Maybe Milliseconds
   , failedCovers :: Set String
-  , hoveredCover :: Maybe String
+  , hoveredCover :: Maybe Int
   , offset :: Int
   , limit :: Int
   , activeTab :: Tab
@@ -68,7 +68,7 @@ data Action
   | SwitchTab Tab
   | FilterBy String String
   | ClearFilter
-  | HoverCover String
+  | HoverCover Int
   | UnhoverCover
 
 component :: forall query input output m. MonadAff m => H.Component query input output m
@@ -203,9 +203,9 @@ component =
         HH.ul_ [ HH.li [ HP.class_ (H.ClassName "error") ] [ HH.text err ] ]
     | otherwise =
         HH.ul [ HP.id "tracks-container" ]
-          (mapWithIndex (renderListen state.currentTime state.failedCovers) state.listens)
+          (mapWithIndex (renderListen state.currentTime state.failedCovers state.hoveredCover) state.listens)
 
-  renderListen currentTime failedCovers _ (Listen { trackMetadata: TrackMetadata track, listenedAt }) =
+  renderListen currentTime failedCovers hoveredCover idx (Listen { trackMetadata: TrackMetadata track, listenedAt }) =
     let
       release = fromMaybe "" track.releaseName
       artist = fromMaybe "" track.artistName
@@ -253,12 +253,11 @@ component =
         , HH.div [ HP.class_ (H.ClassName "cover-wrapper") ]
             [ if Set.member coverUrl failedCovers then HH.text ""
               else HH.img
-                [ HP.class_ (H.ClassName "track-cover")
+                [ HP.class_ (H.ClassName $ "track-cover" <> if hoveredCover == Just idx then " zoomed" else "")
                 , HP.src coverUrl
                 , HP.alt release
                 , HE.onError \_ -> ImageError coverUrl
-                , HE.onMouseEnter \_ -> HoverCover coverUrl
-                , HE.onMouseLeave \_ -> UnhoverCover
+                , HE.onClick \_ -> if hoveredCover == Just idx then UnhoverCover else HoverCover idx
                 ]
             , case track.genre of
                 Just g -> HH.div [ HP.class_ (H.ClassName "genre-tag") ] [ HH.text g ]
diff --git a/src/Main.purs b/src/Main.purs
@@ -266,7 +266,7 @@ indexHtml =
             cursor: pointer;
         }
         
-        .track-cover:hover {
+        .track-cover.zoomed {
             transform: scale(5.0);
             z-index: 10;
             position: relative;
@@ -461,9 +461,14 @@ indexHtml =
             margin-left: 15px;
             gap: 4px;
             flex-shrink: 0;
+            position: relative;
         }
 
         .genre-tag {
+            position: absolute;
+            top: 100%;
+            left: 50%;
+            transform: translateX(-50%);
             font-size: 10px;
             color: #9fbfe7;
             text-align: center;
@@ -478,13 +483,12 @@ indexHtml =
             max-width: none;
             overflow: visible;
             text-overflow: clip;
-            position: absolute;
             background: #521e40;
             border: 1px solid #50447f;
             border-radius: 4px;
             padding: 2px 6px;
             z-index: 100;
-            white-space: nowrap;
+            opacity: 1;
         }
 
         .stat-row {