BillEditForm: responsive width, white barcoder outline

This commit is contained in:
2024-02-13 11:52:25 +01:00
parent 0c9e0e1f25
commit c87f9964c4

View File

@@ -93,7 +93,9 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
</Link> </Link>
: null : null
} }
<input id="billAttachment" name="billAttachment" type="file" className="file-input file-input-bordered max-w-sm w-full file-input-xs my-2 block" onChange={billAttachment_handleChange} /> <div className="flex">
<input id="billAttachment" name="billAttachment" type="file" className="file-input file-input-bordered grow file-input-xs my-2 block" onChange={billAttachment_handleChange} />
</div>
<div id="status-error" aria-live="polite" aria-atomic="true"> <div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.billAttachment && {state.errors?.billAttachment &&
state.errors.billAttachment.map((error: string) => ( state.errors.billAttachment.map((error: string) => (
@@ -109,10 +111,10 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
<input id="billPaid" name="billPaid" type="checkbox" className="toggle toggle-success" defaultChecked={paid} onChange={billPaid_handleChange} /> <input id="billPaid" name="billPaid" type="checkbox" className="toggle toggle-success" defaultChecked={paid} onChange={billPaid_handleChange} />
</label> </label>
</div> </div>
<div className="form-control"> <div className="form-control grow">
<label className="cursor-pointer label"> <label className="cursor-pointer label grow">
<span className="label-text mx-[1em]">Amount</span> <span className="label-text mx-[1em]">Amount</span>
<input type="text" id="payedAmount" name="payedAmount" className="input input-bordered text-right w-[9.2em]" placeholder="0.00" value={payedAmount} onFocus={e => e.target.select()} onChange={payedAmount_handleChange} /> <input type="text" id="payedAmount" name="payedAmount" className="input input-bordered text-right w-[5em] grow" placeholder="0.00" value={payedAmount} onFocus={e => e.target.select()} onChange={payedAmount_handleChange} />
</label> </label>
</div> </div>
</div> </div>
@@ -128,11 +130,9 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
<input type="hidden" name="barcodeImage" value={barcodeImage} /> <input type="hidden" name="barcodeImage" value={barcodeImage} />
{ {
barcodeImage ? barcodeImage ?
<div className="form-control w-[325px] p-1"> <div className="form-control p-1">
<label className="cursor-pointer label p-0"> <label className="cursor-pointer label p-2 grow bg-white">
<span> <img src={barcodeImage} className="grow sm:max-w-[350px]" />
<img src={barcodeImage} className="max-w-[325px]" />
</span>
</label> </label>
</div> : null </div> : null
} }