Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[UI/UX] Implement search bar #69

Open
RalXYZ opened this issue Jun 27, 2023 · 1 comment
Open

[UI/UX] Implement search bar #69

RalXYZ opened this issue Jun 27, 2023 · 1 comment
Labels
enhancement New feature or request

Comments

@RalXYZ
Copy link
Member

RalXYZ commented Jun 27, 2023

In #29 (comment), @lynzrand mentioned that he had proposed a search box design. We now want to implement this solution.

We expect the search box to exhibit the following behaviours:

  • If the search box is empty, the current layout remains unchanged.
  • If the search box contains any characters, the following actions occur:
    • Support fuzzy search.
    • Hide the "Popular Mirrors" and "Latest Update" components, and only display the cards within the "All Mirrors" section that match the search.
    • The matched characters in the mirror cards should be highlighted. In light theme, the highlight colour should be "创新红" #B01F24, one of the school colours of Zhejiang University.
  • On the right side of the search box, there should be a CTRL K symbol to indicate to users that they can use this shortcut to enter content within the search box. Refer to the implementation on the CERNET mirror site.
@RalXYZ RalXYZ added the enhancement New feature or request label Jun 27, 2023
@determ1ne
Copy link
Collaborator

A basic search bar with fuzzy search has been implemented in ce0c8ea. Further style tweaks are still needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants