realigned input fields

This commit is contained in:
chark1es 2025-03-12 14:59:34 -07:00
parent fae48f3b17
commit f28a076cfb

View file

@ -380,24 +380,23 @@ const EventRequestManagementTable = ({
{/* Filters and controls */} {/* Filters and controls */}
<div className="flex flex-col lg:flex-row justify-between items-start lg:items-center gap-4 p-4 bg-base-300/50 rounded-lg border border-base-100/10 mb-6"> <div className="flex flex-col lg:flex-row justify-between items-start lg:items-center gap-4 p-4 bg-base-300/50 rounded-lg border border-base-100/10 mb-6">
<div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 w-full lg:w-auto"> <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 w-full lg:w-auto">
<div className="form-control w-full sm:w-auto"> <div className="relative flex items-center w-full sm:w-auto">
<div className="input-group">
<input <input
type="text" type="text"
placeholder="Search events..." placeholder="Search events..."
className="input input-bordered focus:border-primary w-full sm:w-64" className="input bg-[#1e2029] border-[#2a2d3a] focus:border-primary w-full sm:w-64 pr-10 rounded-lg"
value={searchTerm} value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)} onChange={(e) => setSearchTerm(e.target.value)}
/> />
<button className="btn btn-square bg-primary/10 border-primary/20 text-primary hover:bg-primary/20"> <button className="absolute right-0 top-0 btn btn-square bg-primary text-white hover:bg-primary/90 border-none rounded-l-none h-full">
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
</svg> </svg>
</button> </button>
</div> </div>
</div> <div className="relative w-full sm:w-auto">
<select <select
className="select select-bordered focus:border-primary w-full sm:w-auto" className="select bg-[#1e2029] border-[#2a2d3a] focus:border-primary w-full appearance-none pr-10 rounded-lg"
value={statusFilter} value={statusFilter}
onChange={(e) => setStatusFilter(e.target.value)} onChange={(e) => setStatusFilter(e.target.value)}
> >
@ -406,6 +405,8 @@ const EventRequestManagementTable = ({
<option value="completed">Completed</option> <option value="completed">Completed</option>
<option value="declined">Declined</option> <option value="declined">Declined</option>
</select> </select>
</div>
</div> </div>
<div className="flex items-center gap-3 w-full lg:w-auto justify-between sm:justify-end"> <div className="flex items-center gap-3 w-full lg:w-auto justify-between sm:justify-end">
<span className="text-sm text-gray-400"> <span className="text-sm text-gray-400">