mirror of
https://github.com/Sea-Haven-Industries/shoc-frontend-new.git
synced 2026-10-07 02:22:06 +00:00
Replace field-specific search with global search input
- Remove dropdown selector and search button - Use standalone woSearchInput class to avoid inherited border issues - Single text input searches across all fields as you type
This commit is contained in:
parent
fe62f5fb0a
commit
0d473b97db
2 changed files with 18 additions and 11 deletions
|
|
@ -78,19 +78,12 @@ export default function WorkOrdersList() {
|
||||||
<div className="searchControls">
|
<div className="searchControls">
|
||||||
<div className="searchLeft">
|
<div className="searchLeft">
|
||||||
<div className="searchInputGroup">
|
<div className="searchInputGroup">
|
||||||
<select className="searchDropdown" defaultValue="Title">
|
|
||||||
<option>Title</option>
|
|
||||||
<option>WO #</option>
|
|
||||||
<option>Location</option>
|
|
||||||
<option>Status</option>
|
|
||||||
</select>
|
|
||||||
<input
|
<input
|
||||||
className="searchInput"
|
className="woSearchInput"
|
||||||
value={search}
|
value={search}
|
||||||
onChange={(e) => setSearch(e.target.value)}
|
onChange={(e) => setSearch(e.target.value)}
|
||||||
placeholder="Enter search criteria here..."
|
placeholder="Search work orders..."
|
||||||
/>
|
/>
|
||||||
<button className="searchButton">Search!</button>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="viewToggle">
|
<div className="viewToggle">
|
||||||
<button
|
<button
|
||||||
|
|
|
||||||
|
|
@ -124,8 +124,6 @@
|
||||||
height: 38px;
|
height: 38px;
|
||||||
padding: 6px 12px;
|
padding: 6px 12px;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
border-left: none;
|
|
||||||
border-right: 1px solid #ccc;
|
|
||||||
flex: 1;
|
flex: 1;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
|
@ -136,6 +134,22 @@
|
||||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.woSearchInput {
|
||||||
|
height: 38px;
|
||||||
|
padding: 6px 12px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
outline: none;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.woSearchInput:focus {
|
||||||
|
border-color: #66afe9;
|
||||||
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
||||||
|
}
|
||||||
|
|
||||||
.searchButton {
|
.searchButton {
|
||||||
height: 38px;
|
height: 38px;
|
||||||
padding: 6px 20px;
|
padding: 6px 20px;
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue