fix(filters): land templates/workflows/campaigns search inputs at 32px to match filter buttons
The Input atom defaults to h-9 (36px) while the size="sm" filter Buttons in the same row are h-8 (32px). On /workflows the search bar is alone in the row so the mismatch isn't visible. On /templates and /campaigns the type/status filter buttons sit next to the search bar and the row stretches to the Input's 36px, visibly offsetting the buttons. Shrink the search Input to h-8 text-xs on all three pages and add sm:items-center to the filter rows so the controls vertically center.
This commit is contained in:
@@ -252,7 +252,7 @@ export default function CampaignsPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Search & Filters */}
|
{/* Search & Filters */}
|
||||||
<div className="flex flex-col sm:flex-row gap-3">
|
<div className="flex flex-col sm:flex-row sm:items-center gap-3">
|
||||||
<div className="relative flex-1">
|
<div className="relative flex-1">
|
||||||
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-neutral-400" />
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-neutral-400" />
|
||||||
<Input
|
<Input
|
||||||
@@ -260,7 +260,7 @@ export default function CampaignsPage() {
|
|||||||
placeholder="Search campaigns..."
|
placeholder="Search campaigns..."
|
||||||
value={searchInput}
|
value={searchInput}
|
||||||
onChange={e => setSearchInput(e.target.value)}
|
onChange={e => setSearchInput(e.target.value)}
|
||||||
className="pl-10 pr-10"
|
className="pl-10 pr-10 h-8 text-xs"
|
||||||
/>
|
/>
|
||||||
{searchInput && (
|
{searchInput && (
|
||||||
<button
|
<button
|
||||||
|
|||||||
@@ -90,7 +90,7 @@ export default function TemplatesPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Search & Filters */}
|
{/* Search & Filters */}
|
||||||
<div className="flex flex-col sm:flex-row gap-3">
|
<div className="flex flex-col sm:flex-row sm:items-center gap-3">
|
||||||
<div className="relative flex-1">
|
<div className="relative flex-1">
|
||||||
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-neutral-400" />
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-neutral-400" />
|
||||||
<Input
|
<Input
|
||||||
@@ -98,7 +98,7 @@ export default function TemplatesPage() {
|
|||||||
placeholder="Search templates..."
|
placeholder="Search templates..."
|
||||||
value={searchInput}
|
value={searchInput}
|
||||||
onChange={e => setSearchInput(e.target.value)}
|
onChange={e => setSearchInput(e.target.value)}
|
||||||
className="pl-10 pr-10"
|
className="pl-10 pr-10 h-8 text-xs"
|
||||||
/>
|
/>
|
||||||
{searchInput && (
|
{searchInput && (
|
||||||
<button
|
<button
|
||||||
|
|||||||
@@ -117,7 +117,7 @@ export default function WorkflowsPage() {
|
|||||||
placeholder="Search workflows..."
|
placeholder="Search workflows..."
|
||||||
value={searchInput}
|
value={searchInput}
|
||||||
onChange={e => setSearchInput(e.target.value)}
|
onChange={e => setSearchInput(e.target.value)}
|
||||||
className="pl-10 pr-10"
|
className="pl-10 pr-10 h-8 text-xs"
|
||||||
/>
|
/>
|
||||||
{searchInput && (
|
{searchInput && (
|
||||||
<button
|
<button
|
||||||
|
|||||||
Reference in New Issue
Block a user