style: enhance hover effect on media elements with smoother transitions
This commit is contained in:
parent
d5dfeac9c0
commit
9240263490
1 changed files with 4 additions and 3 deletions
|
@ -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" && (
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue