feat: integrate payment functionality with new payment sheet and enhance supplier payments UI

2026-10-19 22:02:15 +05:30
parent a980e636f5
commit eb0b042f0c
5 changed files with 161 additions and 11 deletions
@@ -0,0 +1,44 @@
+'use client'
+
+export function TopLoader({ active }: { active: boolean }) {
+  if (!active) return null
+  return (
+    <div className="pointer-events-none absolute inset-x-0 top-0 h-[2px] overflow-hidden">
+      <div className="top-loader-bar">
+        <span className="top-loader-head" />
+      </div>
+      <style jsx>{`
+        .top-loader-bar {
+          position: absolute;
+          inset: 0;
+          background: linear-gradient(
+            90deg,
+            transparent 0%,
+            rgba(255, 60, 90, 0.45) 50%,
+            rgba(255, 90, 120, 0.9) 85%,
+            #ff2e63 100%
+          );
+          transform: translateX(-100%);
+          animation: top-loader-slide 1.1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
+        }
+        .top-loader-head {
+          position: absolute;
+          right: 0;
+          top: -2px;
+          height: 6px;
+          width: 10px;
+          border-radius: 9999px;
+          background: #ff6b8a;
+          box-shadow:
+            0 0 6px 1px #ff2e63,
+            0 0 14px 2px rgba(255, 46, 99, 0.75),
+            0 0 24px 4px rgba(255, 46, 99, 0.35);
+        }
+        @keyframes top-loader-slide {
+          0% { transform: translateX(-100%); }
+          100% { transform: translateX(100%); }
+        }
+      `}</style>
+    </div>
+  )
+}