Collapsible search
Sign InCollapsible search provides a solution for the search text field in mobile resolution as the viewport size is reduced.
Usage
The search text field is reduced to just a button icon with the magnifying lense. When the button is tapped the field appears hovering the rest of the elements in the bar. Once the search action is performed the field gets to its initial state.
This pattern is commonly used when a search text filed placed in a bar gets to a mobile resolution. It can be the case of a navbar, or a management bar.
The following animation shows this pattern works:
Menu