feat: progressbar everywhere

src/components/ui/progress-bar.tsx

@@ -1,16 +1,20 @@
 interface ProgressBarProps {
   progress: number;
   total: number;
+  type: "series" | "book";
 }
 
-export function ProgressBar({ progress, total }: ProgressBarProps) {
+export function ProgressBar({ progress, total, type }: ProgressBarProps) {
   const percentage = Math.round((progress / total) * 100);
   
+  const barColor = type === "series" 
+    ? "bg-gradient-to-r from-purple-500 to-pink-500" 
+    : "bg-gradient-to-r from-blue-500 to-cyan-500";
   return (
     <div className="absolute bottom-0 left-0 right-0 px-3 py-2 bg-black/50 backdrop-blur-sm border-t border-white/10">
       <div className="h-2 bg-white/30 rounded-full overflow-hidden">
         <div
-          className="h-full bg-white rounded-full transition-all duration-300"
+          className={`h-full transition-all duration-300 ${barColor}`}
           style={{ width: `${percentage}%` }}
         />
       </div>