diff --git a/nextjs-app/components/FilterBar.module.css b/nextjs-app/components/FilterBar.module.css index 260a860..ef33a2e 100644 --- a/nextjs-app/components/FilterBar.module.css +++ b/nextjs-app/components/FilterBar.module.css @@ -159,6 +159,27 @@ cursor: pointer; } +/* ── Phase filter (always visible) ──────────────────── */ +.phaseFilterRow { + margin-top: 0.75rem; +} + +.phaseSelect { + padding: 0.5rem 0.875rem; + font-size: 0.9rem; + border: 1px solid var(--border-color, #e5dfd5); + border-radius: 6px; + background: var(--bg-card, white); + cursor: pointer; + outline: none; + color: var(--text-primary, #1a1612); + min-width: 160px; +} + +.phaseSelect:focus { + border-color: var(--accent-coral, #e07256); +} + /* ── Advanced filters toggle ─────────────────────────── */ .advancedSection { margin-top: 0.75rem; diff --git a/nextjs-app/components/FilterBar.tsx b/nextjs-app/components/FilterBar.tsx index 4737837..c39b2cf 100644 --- a/nextjs-app/components/FilterBar.tsx +++ b/nextjs-app/components/FilterBar.tsx @@ -33,8 +33,8 @@ export function FilterBar({ filters, isHero, resultFilters }: FilterBarProps) { const currentAdmissionsPolicy = searchParams.get('admissions_policy') || ''; const currentHasSixthForm = searchParams.get('has_sixth_form') || ''; - // Count active dropdown filters (not search/postcode) - const activeDropdownFilters = [currentLA, currentType, currentPhase, currentGender, currentAdmissionsPolicy, currentHasSixthForm].filter(Boolean); + // Count active dropdown filters (not search/postcode, not phase since it's always visible) + const activeDropdownFilters = [currentLA, currentType, currentGender, currentAdmissionsPolicy, currentHasSixthForm].filter(Boolean); const hasActiveDropdownFilters = activeDropdownFilters.length > 0; const [filtersOpen, setFiltersOpen] = useState(hasActiveDropdownFilters); @@ -147,7 +147,25 @@ export function FilterBar({ filters, isHero, resultFilters }: FilterBarProps) { {!isHero && ( -
+ <> + {/* Phase filter — always visible on results page */} + {phaseOptions.length > 0 && ( +
+ +
+ )} + +