first commit

src/partials/fintech/FintechIntro.jsx

@@ -0,0 +1,65 @@
+import React from 'react';
+
+import UserImage from '../../images/user-64-14.jpg';
+import FintechIcon01 from '../../images/company-icon-01.svg';
+import FintechIcon02 from '../../images/company-icon-02.svg';
+import FintechIcon03 from '../../images/company-icon-03.svg';
+import FintechIcon04 from '../../images/company-icon-04.svg';
+
+function FintechIntro() {
+  return (
+    <div className="flex flex-col col-span-full bg-white shadow-lg rounded-sm border border-slate-200">
+      <div className="px-5 py-6">
+        <div className="md:flex md:justify-between md:items-center">
+          {/* Left side */}
+          <div className="flex items-center mb-4 md:mb-0">
+            {/* Avatar */}
+            <div className="mr-4">
+              <img className="inline-flex rounded-full" src={UserImage} width="64" height="64" alt="User" />
+            </div>
+            {/* User info */}
+            <div>
+              <div className="mb-2">
+                Hey <strong className="font-medium text-slate-800">Mary</strong> 👋, this is your current balance:
+              </div>
+              <div className="text-3xl font-bold text-emerald-500">$47,347.09</div>
+            </div>
+          </div>
+          {/* Right side */}
+          <ul className="shrink-0 flex flex-wrap justify-end md:justify-start -space-x-3 -ml-px">
+            <li>
+              <a className="block" href="#0">
+                <img className="w-9 h-9 rounded-full" src={FintechIcon01} width="36" height="36" alt="Account 01" />
+              </a>
+            </li>
+            <li>
+              <a className="block" href="#0">
+                <img className="w-9 h-9 rounded-full" src={FintechIcon02} width="36" height="36" alt="Account 02" />
+              </a>
+            </li>
+            <li>
+              <a className="block" href="#0">
+                <img className="w-9 h-9 rounded-full" src={FintechIcon03} width="36" height="36" alt="Account 03" />
+              </a>
+            </li>
+            <li>
+              <a className="block" href="#0">
+                <img className="w-9 h-9 rounded-full" src={FintechIcon04} width="36" height="36" alt="Account 04" />
+              </a>
+            </li>
+            <li>
+              <button className="flex justify-center items-center w-9 h-9 rounded-full bg-white border border-slate-200 hover:border-slate-300 text-indigo-500 shadow-sm transition duration-150">
+                <span className="sr-only">Add new user</span>
+                <svg className="w-4 h-4 fill-current" viewBox="0 0 16 16">
+                  <path d="M15 7H9V1c0-.6-.4-1-1-1S7 .4 7 1v6H1c-.6 0-1 .4-1 1s.4 1 1 1h6v6c0 .6.4 1 1 1s1-.4 1-1V9h6c.6 0 1-.4 1-1s-.4-1-1-1z" />
+                </svg>
+              </button>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default FintechIntro;