A personal media tracker built on the AT Protocol
opnshelf.xyz
fix: update button opacity handling in SearchPage and ShelfPage for better hover responsiveness
+2
-2
+1
-1
apps/web/src/routes/search.tsx
+1
-1
apps/web/src/routes/search.tsx
···
163
163
className={`absolute top-2 right-2 p-2 rounded-full transition-opacity disabled:opacity-50 ${
164
164
isWatched
165
165
? 'bg-green-600 hover:bg-red-600 opacity-100'
166
-
: 'bg-purple-600 hover:bg-purple-700 opacity-0 group-hover:opacity-100'
166
+
: 'bg-purple-600 hover:bg-purple-700 [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:group-hover:opacity-100'
167
167
}`}
168
168
title={isWatched ? 'Remove from shelf' : 'Mark as watched'}
169
169
>
+1
-1
apps/web/src/routes/shelf.tsx
+1
-1
apps/web/src/routes/shelf.tsx
···
109
109
type="button"
110
110
onClick={() => unmarkMutation.mutate({ path: { movieId: tracked.movieId } })}
111
111
disabled={unmarkMutation.isPending}
112
-
className="absolute top-2 right-2 p-2 bg-red-600 hover:bg-red-700 rounded-full opacity-0 group-hover:opacity-100 transition-opacity disabled:opacity-50"
112
+
className="absolute top-2 right-2 p-2 bg-red-600 hover:bg-red-700 rounded-full [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:group-hover:opacity-100 transition-opacity disabled:opacity-50"
113
113
title="Remove from shelf"
114
114
>
115
115
<Trash2 className="w-4 h-4" />