The SearchBox responsive stylesheet strands the leading search icon on its own line above the input on screens ≤ 480px (icon / input / button render as three stacked rows).
Reproduced in 0.1.16, unchanged through 0.1.19.
Root cause — searchBoxStyles @media (max-width: 480px) sets .oc-search-box__input { flex: 1 1 100% }, which forces the input onto its own full-width row and leaves the flex-shrink: 0 icon alone on the row above it.
Suggested fix — change the input to flex: 1 1 auto in that media query so the icon and input share row 1, while the width: 100% button still wraps to its own row below.
The SearchBox responsive stylesheet strands the leading search icon on its own line above the input on screens ≤ 480px (icon / input / button render as three stacked rows).
Reproduced in 0.1.16, unchanged through 0.1.19.
Root cause — searchBoxStyles @media (max-width: 480px) sets .oc-search-box__input { flex: 1 1 100% }, which forces the input onto its own full-width row and leaves the flex-shrink: 0 icon alone on the row above it.
Suggested fix — change the input to flex: 1 1 auto in that media query so the icon and input share row 1, while the width: 100% button still wraps to its own row below.