feat(frontend): integrate product search in SearchView
- Add ProductResults component import - Add products and searchMode state - Add parallel product search to search effect - Add filter tabs (Todos/Medicamentos/Parafarmacia) - Render ProductResults when products found - Add CSS for filter tabs and products section
This commit is contained in:
@@ -356,3 +356,44 @@
|
||||
color: var(--primary);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
/* Filter tabs */
|
||||
.filter-tabs {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.filter-tab {
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 9999px;
|
||||
border: none;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
background: var(--surface-container-lowest, #f3f4f6);
|
||||
color: var(--on-surface-variant, #6b7280);
|
||||
transition: all 0.15s;
|
||||
}
|
||||
|
||||
.filter-tab:hover {
|
||||
background: var(--surface-container-low, #e5e7eb);
|
||||
}
|
||||
|
||||
.filter-tab--active {
|
||||
background: var(--primary, #2563eb);
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Products section */
|
||||
.products-section {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.section-subtitle {
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: var(--on-surface);
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user