ministryofjustice / find-moj-data

Find MOJ data service • This repository is defined and managed in Terraform
MIT License
5 stars 0 forks source link

X to remove search #459

Closed seanprivett closed 4 months ago

seanprivett commented 4 months ago

could the search have an 'x' to clear action button when active and not empty? just like on gov.uk search?

Image

Originally posted by @alex-vonfeldmann in #423

MatMoore commented 4 months ago

The GOV.UK search component: https://components.publishing.service.gov.uk/component-guide/search

This component package is not intended for use outside of GOV.UK, but the source is here:

YvanMOJdigital commented 4 months ago

keyboard shortcut?

jemnery commented 4 months ago

Also add to glossary search. This should reset the page to all glossary terms

MatMoore commented 4 months ago

This behaviour actually comes from type="search"

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search#differences_between_search_and_text_types

It's then customised on GOV.UK with

&::-webkit-search-cancel-button {
    -webkit-appearance: none;
    background-image: url("govuk_publishing_components/icon-close.svg");
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    height: 20px;
    margin-left: 0;
    margin-right: 0;
    width: 20px;
  }
}

We have icon-close-cross-black in the MOJ design system, so we could use that.