Upload folder using huggingface_hub

client/src/pages/TutorialTasks.tsx

@@ -1086,7 +1086,7 @@ const TutorialTasks: React.FC = () => {
                 <button
                   key={week}
                   onClick={() => handleWeekChange(week)}
-                  className={`relative inline-flex items-center justify-center rounded-2xl px-4 py-1.5 whitespace-nowrap transition-all duration-300 ease-out ring-1 ring-inset ring-white/30 backdrop-blur-md isolate shadow-[inset_0_0.5px_0_rgba(255,255,255,0.5),inset_0_-1px_1.5px_rgba(0,0,0,0.12)]`}
+                  className={`relative inline-flex items-center justify-center rounded-2xl px-4 py-1.5 whitespace-nowrap transition-all duration-300 ease-out ring-1 ring-inset ${isActive ? 'ring-white/50 backdrop-brightness-110 backdrop-saturate-150' : 'ring-white/30'} backdrop-blur-md isolate shadow-[inset_0_0.5px_0_rgba(255,255,255,0.5),inset_0_-1px_1.5px_rgba(0,0,0,0.12)]`}
                   style={{ background: 'rgba(255,255,255,0.10)' }}
                 >
                   {/* Rim washes */}
@@ -1096,10 +1096,12 @@ const TutorialTasks: React.FC = () => {
                   {/* Tiny hotspot near TL */}
                   <div className="pointer-events-none absolute rounded-full" style={{ width: '28px', height: '28px', left: '8px', top: '6px', background: 'radial-gradient(16px_16px_at_10px_10px,rgba(255,255,255,0.5),rgba(255,255,255,0)_60%)', opacity: 0.45 }} />
                   {/* Center darken for depth */}
-                  <div className="pointer-events-none absolute inset-0 rounded-2xl" style={{ background: 'radial-gradient(120%_120%_at_50%_55%,rgba(0,0,0,0.04),rgba(0,0,0,0)_60%)', opacity: 0.9 }} />
+                  {!isActive && (
+                    <div className="pointer-events-none absolute inset-0 rounded-2xl" style={{ background: 'radial-gradient(120%_120%_at_50%_55%,rgba(0,0,0,0.04),rgba(0,0,0,0)_60%)', opacity: 0.9 }} />
+                  )}
                   {/* Blue tint overlay to match brand */}
-                  <div className={`pointer-events-none absolute inset-0 rounded-2xl ${isActive ? 'bg-sky-600/45 mix-blend-normal opacity-90' : 'bg-sky-500/30 mix-blend-overlay opacity-35'}`} />
-                  <span className={`relative z-10 text-sm font-medium ${isActive ? 'text-black' : 'text-black'}`}>Week {week}</span>
+                  <div className={`pointer-events-none absolute inset-0 rounded-2xl ${isActive ? 'bg-sky-600/70 mix-blend-normal opacity-100' : 'bg-sky-500/30 mix-blend-overlay opacity-35'}`} />
+                  <span className={`relative z-10 text-sm font-medium ${isActive ? 'text-white' : 'text-black'}`}>Week {week}</span>
                 </button>
               );
             })}