From 87c268d28e56b675fe0961f49bff8cec9e52ab6a Mon Sep 17 00:00:00 2001
From: jyswee <jyswee@gmail.com>
Date: Thu, 23 Jul 2026 23:00:02 +0000
Subject: [PATCH] Seed: music template (13 files)

---
 src/pages/About.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index cd92366..5e96218 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -94,7 +94,7 @@ export default function AboutPage() {
           <h2 className="text-3xl font-bold text-center mb-12 animate-fade-up">Gallery</h2>
           <div className="grid grid-cols-2 md:grid-cols-3 gap-4 stagger">
             {gallery.map((img, i) => (
-              <button key={i} onClick={() => setLightbox(i)} className={`aspect-square rounded-xl bg-gradient-to-br \${img.gradient} hover:scale-[1.02] transition-transform duration-300 cursor-pointer focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 focus:ring-offset-slate-950`} aria-label={img.alt} />
+              <button key={i} onClick={() => setLightbox(i)} className={`aspect-square rounded-xl bg-gradient-to-br ${img.gradient} hover:scale-[1.02] transition-transform duration-300 cursor-pointer focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 focus:ring-offset-slate-950`} aria-label={img.alt} />
             ))}
           </div>
         </div>
@@ -105,7 +105,7 @@ export default function AboutPage() {
         <div className="fixed inset-0 z-50 bg-black/90 flex items-center justify-center p-6" onClick={() => setLightbox(null)}>
           <Button variant="ghost" size="icon" className="absolute top-4 right-4 text-white hover:bg-white/10" onClick={() => setLightbox(null)}><X className="h-6 w-6" /></Button>
           <Button variant="ghost" size="icon" className="absolute left-4 top-1/2 -translate-y-1/2 text-white hover:bg-white/10" onClick={(e) => { e.stopPropagation(); setLightbox((lightbox - 1 + gallery.length) % gallery.length); }}><ChevronLeft className="h-6 w-6" /></Button>
-          <div className={`w-full max-w-2xl aspect-square rounded-2xl bg-gradient-to-br \${gallery[lightbox].gradient}`} onClick={(e) => e.stopPropagation()} />
+          <div className={`w-full max-w-2xl aspect-square rounded-2xl bg-gradient-to-br ${gallery[lightbox].gradient}`} onClick={(e) => e.stopPropagation()} />
           <Button variant="ghost" size="icon" className="absolute right-4 top-1/2 -translate-y-1/2 text-white hover:bg-white/10" onClick={(e) => { e.stopPropagation(); setLightbox((lightbox + 1) % gallery.length); }}><ChevronRight className="h-6 w-6" /></Button>
           <div className="absolute bottom-6 text-center text-sm text-slate-400">{gallery[lightbox].alt} &mdash; {lightbox + 1} / {gallery.length}</div>
         </div>