{"product_id":"search-bar-visual-style-and-shape-empire","title":"Search Bar Visual Style and Shape","description":"\u003cp class=\"task-lead\"\u003eA retailer wanted the header's search icon replaced with a bordered search box on the left.\u003c\/p\u003e\u003ch2\u003eThe request\u003c\/h2\u003e\u003cblockquote\u003e\n\u003cp\u003eWe have a search icon. Instead we want a search box with borders around it, on the left side of the header, always visible.\u003c\/p\u003e\n\u003ccite\u003eOriginal customer request, anonymized\u003c\/cite\u003e\n\u003c\/blockquote\u003e\u003cp\u003eA visible search field instead of an icon.\u003c\/p\u003e\u003ch2\u003eThe approach\u003c\/h2\u003e\u003cp\u003eWe replaced the search icon with a bordered search field on the left of the header, styled to the brand, collapsing to an icon on mobile.\u003c\/p\u003e\u003ch2\u003eWhat we shipped\u003c\/h2\u003e\u003cul\u003e\n\u003cli\u003eBordered search field in the header\u003c\/li\u003e\n\u003cli\u003ePositioned on the left\u003c\/li\u003e\n\u003cli\u003eCollapses to an icon on mobile\u003c\/li\u003e\n\u003c\/ul\u003e","brand":"TaskHusky Portfolio","offers":[{"title":"Default Title","offer_id":44155725185098,"sku":"TASK-0485","price":0.0,"currency_code":"USD","in_stock":false}],"url":"https:\/\/www.taskhusky.com\/products\/search-bar-visual-style-and-shape-empire","provider":"TaskHusky","version":"1.0","type":"link"}