Lyrics View

// Lyrics View · syxUI · https://syxui.dev/components/media2-lyrics
// Free in any project. Keep this line and credit syxUI where a person can read it.

import SwiftUI

let medGreen = Color(red: 0.16, green: 0.66, blue: 0.40)

// Lyrics view
struct LyricsCard: View {
    let lines = [("I've been tryin' to find the words", false), ("To tell you how I feel inside", false), ("Golden hour, faded into blue", true), ("And I've been dreamin' about you", false), ("Every single night", false)]
    var body: some View {
        VStack(alignment: .leading, spacing: 14) {
            HStack { Image(systemName: "quote.bubble.fill").foregroundStyle(medGreen); Text("Lyrics").font(.system(size: 15, weight: .semibold)); Spacer() }
            VStack(alignment: .leading, spacing: 12) {
                ForEach(Array(lines.enumerated()), id: \.offset) { _, l in
                    Text(l.0).font(.system(size: 16, weight: .bold)).foregroundStyle(l.1 ? Color.primary : Color.secondary.opacity(0.4))
                }
            }
        }.padding(20).frame(width: 300, alignment: .leading).background(medGreen.opacity(0.1), in: RoundedRectangle(cornerRadius: 18, style: .continuous))
    }
}