appandflow / appandflow/trailhead

Redesign the Trails sort, search, and filter controls

未关闭
#29 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
enhancement
主要语言
TypeScript
星标
0
派生
0
平均合并
23 分钟
30 天内合并 PR
7

描述

## Summary

Replace the current filter and Name/Distance/Rating segmented control with a compact, progressive sort/search/filter interaction.

## Default state

- Show “Sort By Name” on the left, with only the selected value (“Name”) in bold.
- Pressing the sort text opens a bottom sheet containing Name, Distance, and Rating choices.
- Show a search icon button on the right.

## Search state

- Pressing the search button expands a search input across the available width and focuses it.
- Show a filter button on the right side of the expanded search input.

## Filter state

- Pressing the filter button smoothly reduces the search input width.
- Slide up a modal/bottom sheet with the existing Region and Level filter selections.

## Acceptance criteria

- Selecting Name, Distance, or Rating updates the list order and the bold value in “Sort By …”.
- The sort bottom sheet indicates the current selection and is dismissible.
- Search expansion and contraction are smooth and do not cause content overlap or clipping.
- The search field filters trail results and remains usable with the keyboard open.
- The filter modal preserves the existing Region and Level behavior and current selections.
- Controls have accessible labels, appropriate touch targets, and work in light and dark modes.
- Layout remains usable on compact screen widths and with larger text sizes.

## Related

This redesign replaces the current segmented Name/Distance/Rating toggle interaction described in #27.

贡献指南

这个仓库没有索引到贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。