fix(business-profile): align business-hours time columns
The shared Input wraps fields in a w-full div, so two per flex row split the width and the trailing +/trash buttons knocked columns out of alignment. Use a plain fixed-width <input> for the start/end time fields.
This commit is contained in:
@@ -433,20 +433,26 @@ const BusinessHoursEditor: React.FC<{
|
||||
|
||||
{blocks.map((block, idx) => (
|
||||
<div key={idx} className="flex items-center gap-2">
|
||||
<Input
|
||||
{/* Plain <input>, NOT the shared <Input> — that one wraps
|
||||
the field in a w-full div, so two of them in a flex row
|
||||
split the width and the trailing +/trash buttons shift
|
||||
the columns out of alignment. Fixed-width + shrink-0
|
||||
keeps every block's start/end columns lined up. The
|
||||
`input` class carries the shared field styling. */}
|
||||
<input
|
||||
type="time"
|
||||
lang={timeInputLang}
|
||||
value={block.start}
|
||||
onChange={(e) => updateBlock(iso, idx, { start: e.target.value })}
|
||||
className="w-32"
|
||||
className="input w-32 shrink-0"
|
||||
/>
|
||||
<span className="text-neutral-400">–</span>
|
||||
<Input
|
||||
<input
|
||||
type="time"
|
||||
lang={timeInputLang}
|
||||
value={block.end}
|
||||
onChange={(e) => updateBlock(iso, idx, { end: e.target.value })}
|
||||
className="w-32"
|
||||
className="input w-32 shrink-0"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
|
||||
Reference in New Issue
Block a user