diff options
-rw-r--r-- | packages/demobank-ui/src/pages/business/CreateCashout.tsx | 88 |
1 files changed, 81 insertions, 7 deletions
diff --git a/packages/demobank-ui/src/pages/business/CreateCashout.tsx b/packages/demobank-ui/src/pages/business/CreateCashout.tsx index 80cb64c4c..1a5fad1b1 100644 --- a/packages/demobank-ui/src/pages/business/CreateCashout.tsx +++ b/packages/demobank-ui/src/pages/business/CreateCashout.tsx @@ -463,6 +463,82 @@ export function CreateCashout({ </div> </div> + <div class="sm:col-span-5"> + <label + class="block text-sm font-medium leading-6 text-gray-900" + for="subject" + > + {i18n.str`Currency`} + </label> + + <div class="mt-2"> + <button + type="button" + name="set 50" + class=" inline-flex p-4 text-sm items-center rounded-l-md bg-white text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-10" + onClick={(e) => { + e.preventDefault(); + form.isDebit = true; + updateForm(structuredClone(form)); + }} + > + {form.isDebit ? + <svg + class="self-center flex-none h-5 w-5 text-indigo-600" + viewBox="0 0 20 20" + fill="currentColor" + aria-hidden="true" + > + <path + fill-rule="evenodd" + d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" + clip-rule="evenodd" + /> + </svg> + + : + <svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5"> + <path d="M15 12H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> + </svg> + } + + <i18n.Translate>Send {regional_currency}</i18n.Translate> + </button> + <button + type="button" + name="set 25" + class=" -ml-px -mr-px inline-flex p-4 text-sm items-center rounded-r-md bg-white text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-10" + onClick={(e) => { + e.preventDefault(); + form.isDebit = false; + updateForm(structuredClone(form)); + }} + > + {!form.isDebit ? + <svg + class="self-center flex-none h-5 w-5 text-indigo-600" + viewBox="0 0 20 20" + fill="currentColor" + aria-hidden="true" + > + <path + fill-rule="evenodd" + d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" + clip-rule="evenodd" + /> + </svg> + + : + <svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5"> + <path d="M15 12H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> + </svg> + } + + <i18n.Translate>Receive {fiat_currency}</i18n.Translate> + </button> + </div> + </div> + {/* amount */} <div class="sm:col-span-5"> <div class="flex justify-between"> @@ -470,12 +546,10 @@ export function CreateCashout({ class="block text-sm font-medium leading-6 text-gray-900" for="amount" > - {form.isDebit - ? i18n.str`Amount to send` - : i18n.str`Amount to receive`} + {i18n.str`Amount`} <b style={{ color: "red" }}> *</b> </label> - <button + {/* <button type="button" data-enabled={form.isDebit} class="bg-indigo-600 data-[enabled=false]:bg-gray-200 relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2" @@ -493,7 +567,7 @@ export function CreateCashout({ data-enabled={form.isDebit} class="translate-x-5 data-[enabled=false]:translate-x-0 pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out" ></span> - </button> + </button> */} </div> <div class="mt-2"> <InputAmount @@ -729,7 +803,7 @@ export function CreateCashout({ </button> </div> </form> - </div> - </div> + </div > + </div > ); } |