style: enhance hover effect on media elements with smoother transitions

This commit is contained in:
grngxd 2025-07-30 11:36:14 +01:00
parent d5dfeac9c0
commit 9240263490

View file

@ -64,11 +64,12 @@ const Files = component$<{
return (
<div class="w-full h-max object-cover flex-grow relative overflow-clip">
{fileType.value === "image" && (
// eslint-disable-next-line qwik/jsx-img
<img
width={400}
src={`/api/${file.ID}`}
alt={file.Name}
class="w-full min-h-30 object-cover flex-grow hover:scale-105 transition-all duration-300"
class="w-full min-h-30 object-cover flex-grow hover:scale-[102.5%] transition-all duration-500"
/>
)}
{fileType.value === "video" && (
@ -76,14 +77,14 @@ const Files = component$<{
width={400}
src={`/api/${file.ID}`}
controls
class="w-full min-h-30 object-cover flex-grow hover:scale-105 transition-all duration-300"
class="w-full min-h-30 object-cover flex-grow hover:scale-[102.5%] transition-all duration-500"
/>
)}
{fileType.value === "audio" && (
<audio
src={`/api/${file.ID}`}
controls
class="w-full min-h-30 object-cover flex-grow hover:scale-105 transition-all duration-300"
class="w-full min-h-30 object-cover flex-grow hover:scale-[102.5%] transition-all duration-500"
/>
)}
{fileType.value === "other" && (