feat(component): implement rounded output component

danilych · Feb 10, 2024 · f4cdd66 · f4cdd66
1 parent a35077b
commit f4cdd66
Showing 1 changed file with 21 additions and 0 deletions.
diff --git a/app/shared/Output/rounded-output.tsx b/app/shared/Output/rounded-output.tsx
@@ -0,0 +1,21 @@
+import clsx from 'clsx'
+import type { HTMLProps, ReactNode } from 'react'
+import React, { forwardRef, useImperativeHandle, useRef } from 'react'
+
+interface Props extends HTMLProps<HTMLInputElement> {
+  className?: string
+  children?: ReactNode
+}
+
+export function RoundedOutput({ className, children }: Props) {
+  return (
+    <div
+      className={clsx(
+        'text-[#4E4E51] py-[11px] h-[50px] bg-[#F6F6F6] rounded-[50px] outline-none text-sm font-manrope font-normal w-full border-0',
+        className
+      )}
+    >
+      <p className="ml-[18px] text-[#1f1f1f] text-base font-normal">{children}</p>
+    </div>
+  )
+}