first commit

app/src/components/ui/realTimeVis/floating/SimpleCard.tsx

@@ -0,0 +1,33 @@
+import React from "react";
+
+interface SimpleCardProps {
+  header: string;
+  icon: React.ComponentType<React.SVGProps<SVGSVGElement>>; // React component for SVG icon
+  value: string;
+  per: string; // Percentage change
+}
+
+const SimpleCard: React.FC<SimpleCardProps> = ({
+  header,
+  icon: Icon,
+  value,
+  per,
+}) => {
+  return (
+    <div className="floating total-card" draggable>
+      <div className="header-wrapper">
+        <div className="header">{header}</div>
+        <div className="data-values">
+          <div className="value">{value}</div>
+          <div className="per">{per}</div>
+        </div>
+      </div>
+
+      <div className="icon">
+        <Icon />
+      </div>
+    </div>
+  );
+};
+
+export default SimpleCard;