From b4353000d8de675561b7d592f641ec7a557c8b7e Mon Sep 17 00:00:00 2001
From: Matt Bruce <mbrucedogs@gmail.com>
Date: Sat, 19 Jul 2025 11:40:49 -0500
Subject: [PATCH] Signed-off-by: Matt Bruce <mbrucedogs@gmail.com>

---
 src/components/common/SongItem.tsx       | 2 ++
 src/components/common/TwoLineDisplay.tsx | 3 +++
 2 files changed, 5 insertions(+)

diff --git a/src/components/common/SongItem.tsx b/src/components/common/SongItem.tsx
index 2a3ce19..1d34ddb 100644
--- a/src/components/common/SongItem.tsx
+++ b/src/components/common/SongItem.tsx
@@ -17,6 +17,8 @@ const extractFilename = (path: string): string => {
 };
 
 // Song Information Display Component
+// NOTE: The first two lines (title and artist) should match the styling of TwoLineDisplay component
+// If you change the styling here, also update TwoLineDisplay to keep them in sync
 export const SongInfoDisplay: React.FC<{ 
   song: Song; 
   showPath?: boolean;
diff --git a/src/components/common/TwoLineDisplay.tsx b/src/components/common/TwoLineDisplay.tsx
index 53b6d40..bc37471 100644
--- a/src/components/common/TwoLineDisplay.tsx
+++ b/src/components/common/TwoLineDisplay.tsx
@@ -10,6 +10,9 @@ interface TwoLineDisplayProps {
   secondarySize?: string;
 }
 
+// Two Line Display Component
+// NOTE: This component should match the styling of the first two lines (title and artist) in SongInfoDisplay
+// If you change the styling here, also update SongInfoDisplay to keep them in sync
 export const TwoLineDisplay: React.FC<TwoLineDisplayProps> = ({
   primaryText,
   secondaryText,