v.korobtsev/next-enterprise
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

styling

Browse source
This commit is contained in:
Jesus Vasquez 2024-03-04 20:50:32 -05:00
parent 59a7bcc224
commit fadaa0fe4a
11 changed files with 94 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

17
components/Form/RadioGroup.tsx
View file

@ -3,6 +3,7 @@ import { useField } from "formik"
import React from "react"
import ErrorMessage from "./ErrorMessage"
import RequiredAsterisk from "./RequiredAsterisk"
import Separator from "./Separator"
const RadioGroupField = ({
name,
@ -23,11 +24,15 @@ const RadioGroupField = ({
}
return (
<div className="mb-4">
<label className="text-md" htmlFor={label}>
{label}
</label>
<RequiredAsterisk required={required} />
<div className="flex flex-col gap-3">
<div className="flex flex-col gap-4">
<Separator/>
<label className="text-md" htmlFor={label}>
{label}
<RequiredAsterisk required={required} />
</label>
</div>
<RadioGroup.Root className="flex gap-3" value={field.value} onValueChange={handleChange} aria-label={label}>
{options.map((option) => (
<div className="flex items-center" key={option}>
@ -36,7 +41,7 @@ const RadioGroupField = ({
value={option}
id={`${name}-${option}`}
>
<RadioGroup.Indicator className="relative flex h-full w-full items-center justify-center after:block after:h-[11px] after:w-[11px] after:rounded-[50%] after:bg-violet-400 after:content-['']" />
<RadioGroup.Indicator className="relative flex h-full w-full items-center justify-center after:block after:h-[11px] after:w-[11px] after:rounded-[50%] after:bg-blue-950 after:content-['']" />
</RadioGroup.Item>
<label className="pl-[15px] text-[15px] leading-none" htmlFor={`${name}-${option}`}>
{option}