Adding Product Search extension to Storefront Header - This is how you swap out the WooTheme's default Product Search for Storefront for WooTheme's Product Search Extension. Drop the PHP into your child theme's functions.php. Drop the CSS into your child theme's style.css - enjoy

functions.php

/* Remove Storefront Product Search in Header*/
add_action( 'init', 'jk_remove_storefront_header_search' );
function jk_remove_storefront_header_search() {
remove_action( 'storefront_header', 'storefront_product_search',    40 );
}

/* Add Product Search extension to replace default search product*/
if ( ! function_exists( 'storefront_all_search' ) ) {
    function storefront_all_search() {
if ( function_exists( 'woocommerce_product_search' ) ) {
  echo woocommerce_product_search(); 

} else {
        } }
}

add_action('storefront_header', 'storefront_all_search', 40);

style.css

.product-search input.product-search-field[type="text"] {
	float: right !important;
	width: 22% !important;
}

.product-search.floating .product-search-results {
	position: absolute;
	z-index: 10;
	background: #fff;
	border: 1px solid #ccc;
	margin: -1px 0 0;
	float: right !important;
	top: 70px !important;
	right: 0 !important;
}

.product-search.floating .product-search-results:empty {
	border: none;
	float: right !important;
}

Thanks @BurlesonBrad