update src/components/CustomSelectBox/index.js, src/components/RadioButton/index.js and src/components/Settingss/index.js

master
mahdi 2 years ago
parent fa0d709565
commit 3efe399fe8
  1. 2
      src/components/CustomSelectBox/index.js
  2. 9
      src/components/RadioButton/index.js
  3. 62
      src/components/Settingss/index.js

@ -2,7 +2,7 @@ import React from "react";
const CustomSelectBox = ({ options }) => { const CustomSelectBox = ({ options }) => {
return ( return (
<select className="customizeSelect rounded text-xs text-[#00253A] py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent"> <select className="customizeSelect w-full rounded text-xs text-[#00253A] py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent">
{options.map((option, index) => ( {options.map((option, index) => (
<option className="text-black" key={index}> <option className="text-black" key={index}>
{option.title} {option.title}

@ -2,14 +2,16 @@ import React from "react";
const RadioButton = () => { const RadioButton = () => {
return ( return (
<div className="relative flex items-center justify-between rounded py-4 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent divide-x-2 divide-[#E3E3E3] divide-x-reverse"> <div className="relative">
<div className="flex items-center justify-between rounded py-4 bg-[#FBFBFB] focus:bg-[#f5f5f5] border border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex items-center justify-center flex-1 pl-5"> <div className="flex items-center justify-center flex-1 pl-5">
<input <input
id="default-radio-1" id="default-radio-1"
type="radio" type="radio"
value="" value=""
name="default-radio" name="default-radio"
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600" class="w-4 h-4 cursor-pointer"
checked="checked"
/> />
<label for="default-radio-1" class="mr-2 text-xs text-[#00253A]"> <label for="default-radio-1" class="mr-2 text-xs text-[#00253A]">
بله بله
@ -21,12 +23,13 @@ const RadioButton = () => {
type="radio" type="radio"
value="" value=""
name="default-radio" name="default-radio"
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600" class="w-4 h-4 cursor-pointer"
/> />
<label for="default-radio-2" class="mr-2 text-xs text-[#00253A]"> <label for="default-radio-2" class="mr-2 text-xs text-[#00253A]">
خیر خیر
</label> </label>
</div> </div>
</div>
<div class="absolute top-0 transform -translate-y-2.5 -translate-x-2 px-2 z-10 bg-white"> <div class="absolute top-0 transform -translate-y-2.5 -translate-x-2 px-2 z-10 bg-white">
<p className="text-xs text-[#00253A]">آیا قابلیت ارجاع دارد؟</p> <p className="text-xs text-[#00253A]">آیا قابلیت ارجاع دارد؟</p>
</div> </div>

@ -10,9 +10,8 @@ const Settingss = ({ status }) => {
const { register, getValues } = useForm(); const { register, getValues } = useForm();
return ( return (
<div className="w-full flex flex-row items-start justify-between mx-auto rounded-sm shadow-sm divide-x-2 divide-[#E3E3E3] divide-x-reverse"> <div className="w-full flex flex-row items-start justify-between mx-auto divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex-grow flex-1 flex flex-col pl-5"> <div className="flex-grow flex-1 flex flex-col gap-y-7 pl-5">
<div className="flex flex-col gap-y-7">
<CustomSelectBox <CustomSelectBox
options={[ options={[
{ title: "نام فرآیند" }, { title: "نام فرآیند" },
@ -55,13 +54,62 @@ const Settingss = ({ status }) => {
</div> </div>
</div> </div>
<RadioButton /> <RadioButton />
<CustomSelectBox
options={[
{ title: "انتخاب نقش های قابل ارجاع" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "انتخاب نقش انجام دهنده" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
</div> </div>
<div className="flex-grow flex-1 flex flex-col pr-5 gap-y-7">
<CustomSelectBox
options={[
{ title: "فرآیند مرجع" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "فرآیندهای لینک" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<div className="w-full flex items-center gap-x-3">
<CustomSelectBox
options={[
{ title: "زمان تاخیر" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "مهلت انجام" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
</div> </div>
<div className="flex-grow flex-1 flex flex-col pr-5"> <div className="w-full flex items-center gap-x-3">
<div className="flex flex-col gap-y-7">
<CustomSelectBox <CustomSelectBox
options={[ options={[
{ title: "انتخاب سرویس" }, { title: "تایید خودکار" },
{ title: "شماره 1" }, { title: "شماره 1" },
{ title: "شماره 2" }, { title: "شماره 2" },
{ title: "شماره 3" }, { title: "شماره 3" },
@ -69,7 +117,7 @@ const Settingss = ({ status }) => {
/> />
<CustomSelectBox <CustomSelectBox
options={[ options={[
{ title: "انتخاب تابع" }, { title: "انقضا" },
{ title: "شماره 1" }, { title: "شماره 1" },
{ title: "شماره 2" }, { title: "شماره 2" },
{ title: "شماره 3" }, { title: "شماره 3" },

Loading…
Cancel
Save