international-labour-organization / designsystem

A design system for the International Labour Organization
Apache License 2.0
1 stars 3 forks source link

Search input field: design option to delete input #708

Closed inesdgomes closed 6 months ago

inesdgomes commented 9 months ago

⚠️ This is blocked by #692

When we type something on the search input field, we have no way of deleting the content of the input field. We need a sort of cross button. Designs should be updated with instructions on when the cross button should show. Example from Google below.

Screenshot 2023-12-04 at 15 50 03

This is a low priority task to be addressed after all the other design tasks.

beatrizmartinmartins commented 9 months ago

This is done. For the X icon, we should only included it when it's filled. Check it here

inesdgomes commented 9 months ago

Thanks @beatrizmartinmartins.

@justintemps Here's one small change that we'd need to do to the search input field: the X icon should show once the user starts entering text. Is this something we could action this year or do we leave it for January?

justintemps commented 9 months ago

@inesdgomes why do we need this? Why can't the user just backspace?

inesdgomes commented 9 months ago

@justintemps As discussed, this improves the user experience on the search page and sorted index.

Shashika6 commented 6 months ago

@justintemps Do we only do this one on twig or both twig/react ?

Shashika6 commented 6 months ago

@justintemps I did the changes in react as well, Shall we do it in another PR as it will be easy to review as well.