improve responsiveness

This commit is contained in:
counterweight 2025-05-24 23:09:46 +02:00
parent e39239b9b5
commit 9a976a8be5
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
2 changed files with 10 additions and 9 deletions

View file

@ -4,23 +4,24 @@ const BaseInput = ({
onChangeCallback,
placeholder = "",
suffix,
inputMode,
inputWidth = "w-[60px]",
inputClassName = "",
}) => {
return (
<div className="flex">
<label className="my-1" htmlFor="">
<div className="flex md:flex-row flex-col items-center my-1">
<label className="" htmlFor="">
{label}
</label>
<div className="flex mx-auto">
<input
className={`ml-3 ${inputWidth} bg-white rounded-tl-md rounded-bl-md text-black text-right p-1 ${inputClassName}`}
className={`md:ml-3 my-0 ${inputWidth} bg-white rounded-tl-md rounded-bl-md text-black text-right p-1 ${inputClassName}`}
value={value}
placeholder={placeholder}
onChange={onChangeCallback}
/>
</label>
<div className="w-[60px] place-self-center p-1 rounded-tr-md rounded-br bg-gray-600 font-light">
{suffix}
<div className="w-[60px] place-self-center p-1 rounded-tr-md rounded-br bg-gray-600 font-light">
{suffix}
</div>
</div>
</div>
);

View file

@ -57,8 +57,8 @@ const LoanPanel = () => {
return (
<>
<div className="p-5 bg-gray-50 rounded-3xl border border-gray-400">
<form className="flex flex-col justify-end items-end my-5 text-white bg-blue-600 p-5 rounded-3xl shadow-[0_4px_0_rgba(0,255,255,1)]">
<div className=" mb p-5 bg-gray-50 rounded-3xl border border-gray-400">
<form className="flex flex-col justify-end md:items-end my-5 text-white bg-blue-600 p-5 rounded-3xl shadow-[0_4px_0_rgba(0,255,255,1)]">
<LoanPrincipalInput
onChangeCallback={handleLoanPrincipalChange}
loanPrincipal={loanPrincipal}