edit css responsive

themes/contrib/estore/estore.info.yml

@@ -12,6 +12,7 @@ libraries:
 
 # Regions.
 regions:
+  mobile_top : 'Mobile top'
   top_header_right: 'Top Header Right'
   left_middle_header: 'Left Middle Header'
   middle_header: 'Middle Header'

themes/contrib/estore/js/custom.js

@@ -37,6 +37,8 @@
   }
   if (checkHome.length == 0) {
     $(".menu.menu--category-menu.nav").addClass('hide-block');
+    $(".menu.menu--category-menu.nav").addClass('not-home');
+
   }
   $(window).scroll(function () {
     // console.log($(window).scrollTop() )
@@ -72,8 +74,20 @@
   $(".dropdown-toggle").mouseleave(function(){
     $(this).parent("li.expanded.dropdown").removeClass("open");
   })
-  console.log($(".sidebar-submenu-2").find(".sidebar-submenu-3").parents(".sidebar-submenu-2"));
  $(".sidebar-submenu-2").find(".sidebar-submenu-3").parents(".sidebar-submenu-2").addClass("three-level");
+ $(".mobile-modal").hide();
 
+ $(".btn-mobile-top").click(function(){
+   $(".mobile-modal").show();
+   $(".mobile-top").addClass("menu-toggle");
+ })
+ $(".mobile-modal").click(function(){
+   $(".mobile-modal").hide();
+   $(".mobile-top").removeClass("menu-toggle");
 
+ })
+ $(".close-icon").click(function(){
+   $(".mobile-top").removeClass("menu-toggle");
+   $(".mobile-modal").hide();
+ })
 })(window.jQuery, window.Drupal);

themes/contrib/estore/templates/block/block--system-branding-block.html.twig

@@ -19,7 +19,7 @@
   <div class="branding-block clearfix">
     {% if site_logo %}
       <a class="logo navbar-btn pull-left" href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">
-        <img class="logo_img"  src="/themes/contrib/estore/logo.png" alt="{{ 'Home'|t }}" />
+        <img class="logo_img"  src="/themes/contrib/estore/logo.svg" alt="{{ 'Home'|t }}" />
       </a>
     {% endif %}
 

themes/contrib/estore/templates/layouts/homepage/first/homepage--first.html.twig

@@ -12,7 +12,7 @@
  */
 #}
 {% if content %}
-  <div{{ attributes .addClass('estore-homepage-first')}}>
+  <div{{ attributes.addClass('estore-homepage-first')}}>
 
     {% if content.top_slideshow or content.top_categories %}
     <div class="top-region">

themes/contrib/estore/templates/system/page.html.twig

@@ -62,6 +62,40 @@
         theme.settings.navbar_position ? 'navbar-' ~ theme.settings.navbar_position|clean_class,
       ]
     %}
+    <div class="mobile-top">
+      <div class="close-icon">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </div>
+      <div class="address-mobile">
+        {% if top_header.header_email %}
+          <div class="site-email">
+            <i class="fa fa-envelope"></i>
+            {{ top_header.header_email }}
+          </div>
+        {% endif %}
+        {% if top_header.header_phone %}
+          <div class="site-phone">
+            <i class="fa fa-phone"></i>
+            {{ top_header.header_phone }}
+          </div>
+        {% endif %}
+        {% if top_header.header_location %}
+          <div class="site-map-marker">
+            <i class="fa fa-map-marker"></i>
+            {{ top_header.header_location }}
+          </div>
+        {% endif %}
+        {% if top_header.header_shop_opens %}
+          <div class="site-clock-o">
+            <i class="fa fa-clock-o"></i>
+            {{ top_header.header_shop_opens }}
+          </div>
+        {% endif %}
+      </div>
+      {% if page.mobile_top %}
+          {{ page.mobile_top }}
+      {% endif %}
+    </div>
     <div class="top-header-wrapper clearfix">
       <div class="container-fluid">
         <div class="left-top-header">
@@ -97,7 +131,9 @@
         </div>
       </div>
     </div>
+    <div class="mobile-modal">
 
+    </div>
     <div class="middle-header-wrapper clearfix">
       <div class="container-fluid">
         <div class="col-md-3 col-xs-7">
@@ -115,18 +151,22 @@
             </div>
 
           </header>
+          <button type="button" name="button" class="btn-mobile-top">
+            <i class="fa fa-bars" aria-hidden="true"></i>
+          </button>
         </div>
 
             <div class="col-md-2 col-xs-3">
               {% if page.right_middle_header %}
                 {{ page.right_middle_header }}
               {% endif %}
+
             </div>
 
           </div>
         </div>
 
-        <header{{ navbar_attributes.addclass(navbar_classes) }} id="navbar" role="banner">
+        <header{{ navbar_attributes.addclass(navbar_classes, 'bottom-nav') }} id="navbar" role="banner">
           {% if not navbar_attributes.hasClass(container) %}
             <div class="{{ container }}">
             {% endif %}