Initial commit

src/components/ProInputCard/ProInputCard.module.css

@@ -0,0 +1,7 @@
+.ProInputCard {
+  background-color: white;
+}
+
+:global(.darkApp) .ProInputCard {
+  background-color: #0a0a0a;
+}

src/components/ProInputCard/ProInputCard.tsx

@@ -0,0 +1,40 @@
+import { Card, Divider } from "antd";
+import { FunctionComponent, ReactNode } from "react";
+import ProTitle from "../ProTitle";
+import styles from "./ProInputCard.module.css";
+
+interface ProInputCardProps {
+  children?: ReactNode;
+  title?: string | ReactNode;
+  titleRight?: ReactNode;
+  className?: string;
+}
+
+const ProInputCard: FunctionComponent<ProInputCardProps> = ({
+  children,
+  title,
+  titleRight,
+  className,
+}) => {
+  return (
+    <Card className={`${styles.ProInputCard} ${className}`}>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "row",
+          justifyContent: "space-between",
+        }}
+      >
+        {title && typeof title === "string" && (
+          <ProTitle style={{ fontSize: 18 }}> {title} </ProTitle>
+        )}
+        {title && typeof title !== "string" && title}
+        <div style={{ position: "relative", top: 0 }}>{titleRight}</div>
+      </div>
+      <Divider style={{ margin: "5px 0 15px 0" }} />
+      {children}
+    </Card>
+  );
+};
+
+export default ProInputCard;