From caf2f897d1939e43563f45ebfc0a828f3a2eaed5 Mon Sep 17 00:00:00 2001
From: clau <1281581+dualcnhq@users.noreply.github.com>
Date: Wed, 8 Jun 2022 08:21:49 +0800
Subject: [PATCH] Fix waveform height (#69)

* Fix waveform to full width

* Fix waveform thumbnail height

* Fix waveform image height

* Set hardcoded height for image

* Add dynamic imgWidth for waveform calc height

* Change waveform image height

* Update drop-shadow height
---
 src/styles/item-image-styles.ts | 5 +++++
 src/tiles/item-image.ts         | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/styles/item-image-styles.ts b/src/styles/item-image-styles.ts
index 75e5df194..973352af2 100644
--- a/src/styles/item-image-styles.ts
+++ b/src/styles/item-image-styles.ts
@@ -7,6 +7,7 @@ export const baseItemImageStyles = css`
   .drop-shadow {
     filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
     overflow: hidden;
+    height: 100%;
   }
 
   .list-box {
@@ -39,6 +40,10 @@ export const baseItemImageStyles = css`
 export const waveformGradientStyles = css`
   .waveform {
     mix-blend-mode: screen;
+    position: relative;
+    height: 62.5%;
+    top: 50%;
+    transform: translateY(-50%);
   }
 
   .waveform-grad0 {
diff --git a/src/tiles/item-image.ts b/src/tiles/item-image.ts
index 2a1c56407..1c21359e0 100644
--- a/src/tiles/item-image.ts
+++ b/src/tiles/item-image.ts
@@ -72,7 +72,7 @@ export class ItemImage extends LitElement {
 
   private get itemImageClass(): ClassInfo {
     return {
-      contain: !this.isCompactTile,
+      contain: !this.isCompactTile && !this.isWaveform,
       cover: this.isCompactTile,
       blur: this.model?.contentWarning || false,
       waveform: this.isWaveform,