Login and dashboard added

utils/badge.tsx

@@ -0,0 +1,14 @@
+export default function Badge({
+  children,
+  icon,
+}: {
+  children: React.ReactNode;
+  icon: React.ReactNode;
+}) {
+  return (
+    <div className="inline-flex w-fit items-center gap-2 rounded-full border border-slate-700 bg-[#0d1b2d] px-4 py-2 text-sm text-slate-300">
+      <span className="text-teal-400">{icon}</span>
+      {children}
+    </div>
+  );
+}

utils/button.tsx

@@ -0,0 +1,17 @@
+interface Props {
+  children: React.ReactNode;
+  onClick?: () => void;
+  className?: string;
+}
+
+export default function Button({
+  children,
+  onClick,
+  className,
+}: Props) {
+  return (
+    <button onClick={onClick} className={className}>
+      {children}
+    </button>
+  );
+}

utils/formInput.tsx

@@ -0,0 +1,25 @@
+interface Props {
+  label: string;
+  value?: string;
+  type?: string;
+}
+
+export default function FormInput({
+  label,
+  value,
+  type = "text",
+}: Props) {
+  return (
+    <div>
+      <label className="mb-2 block text-sm text-slate-400">
+        {label}
+      </label>
+
+      <input
+        type={type}
+        defaultValue={value}
+        className="h-10 w-full rounded-xl border border-slate-700 text-white px-5"
+      />
+    </div>
+  );
+}

utils/statCard.tsx

@@ -0,0 +1,16 @@
+export default function Stat({
+  number,
+  label,
+}: {
+  number: string;
+  label: string;
+}) {
+  return (
+    <div>
+      <h2 className="text-3xl font-bold">{number}</h2>
+      <p className="mt-2 text-xs tracking-[3px] text-slate-400">
+        {label}
+      </p>
+    </div>
+  );
+}