From 591b194b2543132ae46beba43df2e2b661de638c Mon Sep 17 00:00:00 2001
From: vicrodh <103399283+vicrodh@users.noreply.github.com>
Date: Wed, 28 Jan 2026 19:42:53 -0600
Subject: [PATCH] Fix quality badges to match TrackRow simple text style

- Fix qobuzAdapters to use formatQuality for track quality (was showing Hi-Res)
- Update QualityBadge compact mode to simple text style:
  - font-size: 12px
  - color: #666666 (uniform gray)
  - width: 80px (fixed)
  - No background, border, or special hires styling
---
 src/lib/adapters/qobuzAdapters.ts      |  2 +-
 src/lib/components/QualityBadge.svelte | 22 +++++-----------------
 2 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/src/lib/adapters/qobuzAdapters.ts b/src/lib/adapters/qobuzAdapters.ts
index 444803b70..b83759bef 100644
--- a/src/lib/adapters/qobuzAdapters.ts
+++ b/src/lib/adapters/qobuzAdapters.ts
@@ -340,7 +340,7 @@ export function convertQobuzAlbum(album: QobuzAlbum): AlbumDetail {
       artist: track.performer?.name,
       duration: formatDuration(track.duration),
       durationSeconds: track.duration,
-      quality: track.hires_streamable ? 'Hi-Res' : 'CD',
+      quality: formatQuality(track.hires_streamable, track.maximum_bit_depth, track.maximum_sampling_rate),
       hires: track.hires_streamable,
       bitDepth: track.maximum_bit_depth,
       samplingRate: track.maximum_sampling_rate,
diff --git a/src/lib/components/QualityBadge.svelte b/src/lib/components/QualityBadge.svelte
index 95625aa65..4bda90e19 100644
--- a/src/lib/components/QualityBadge.svelte
+++ b/src/lib/components/QualityBadge.svelte
@@ -112,7 +112,7 @@
 </script>
 
 {#if compact}
-  <span class="quality-badge-compact" class:hires={isHiRes} title="{tierLabel}: {displayText}">
+  <span class="quality-badge-compact" title="{tierLabel}: {displayText}">
     {compactText}
   </span>
 {:else}
@@ -134,28 +134,16 @@
 {/if}
 
 <style>
-  /* Compact mode styles */
+  /* Compact mode styles - simple text like TrackRow */
   .quality-badge-compact {
     display: inline-block;
-    font-size: 11px;
-    font-weight: 600;
-    padding: 3px 8px;
-    border-radius: 6px;
-    background: var(--alpha-10);
-    color: var(--alpha-85);
-    border: 1px solid var(--alpha-15);
-    min-width: 90px;
+    font-size: 12px;
+    color: #666666;
+    width: 80px;
     text-align: center;
-    box-sizing: border-box;
     white-space: nowrap;
   }
 
-  .quality-badge-compact.hires {
-    background: linear-gradient(135deg, #fbbf24 0%, #b8860b 100%);
-    color: #1a1a1a;
-    border-color: transparent;
-  }
-
   /* Full mode styles */
   .quality-badge {
     display: inline-flex;