removing the header search in medium view

the site has a search in the off canvas in tablet view, removing the header search as the
animation on blur breaks when the tablet keyboard pops up

diff --git a/js/app.js b/js/app.js
index b393c96..bcb482b 100644 (file)
--- a/js/app.js
+++ b/js/app.js
@@ -92,7 +92,7 @@ $(document).ready(function () {
     });
     var page = $('body');
     var search_toggle = page.find('.search-field a');
-    var search_input  = page.find('.search-input');
+    var search_input  = page.find('.header-search-container .search-input');
     
     function hide_show_search(el){
         if( el.css("width") == '0px'){

diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 488e58f..9db07a2 100644 (file)
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -23,7 +23,7 @@ $(document).ready(function () {
     });
     var page = $('body');
     var search_toggle = page.find('.search-field a');
-    var search_input  = page.find('.search-input');
+    var search_input  = page.find('.header-search-container .search-input');
     
     function hide_show_search(el){
         if( el.css("width") == '0px'){

diff --git a/sections/header.php b/sections/header.php
index a83c356..e65e449 100644 (file)
--- a/sections/header.php
+++ b/sections/header.php
@@ -8,9 +8,9 @@
             <ul class="right">
                 <li><a href="<?php echo esc_url( home_url() );?>">Home</a></li>
                 <li class="facebook"><a href="https://www.facebook.com/pages/Petoskey-Harbor-Springs-Area-Community-Foundation/1615947182007185" target="_blank"></a></li>
-                <li class="search-field"><a></a></li>
+                <li class="search-field show-for-large-up"><a></a></li>
 <!--                <li class="search-input"><input type="text" class="header-search-input"></li>-->
-               <li> <?php get_template_part('parts/search-form');?> </li>
+               <li class="header-search-container"> <?php get_template_part('parts/search-form');?> </li>
             </ul>
         </div>
         <div id="end" class="large-2 columns show-for-large-up">