Fix search positioning if menu burger is hidden.

Voog · Jun 21, 2016 · 39d8109 · 39d8109
1 parent b9fef24
commit 39d8109
Show file tree

Hide file tree

Showing 8 changed files with 50 additions and 36 deletions.
diff --git a/layouts/blog___news.tpl b/layouts/blog___news.tpl
@@ -7,7 +7,7 @@
 </head>
 
 
-<body class="blog-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}">
+<body class="blog-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}{% unless show_menu_btn or editmode %} menu-btn-hidden{% endunless %}">
   {% if body_bg_color != '' or editmode %}<div class="body-background-color js-body-background-color"></div>{% endif %}
 
   <div class="container js-container">

diff --git a/layouts/blog_article.tpl b/layouts/blog_article.tpl
@@ -6,7 +6,7 @@
   {% include 'edicy-tools-styles' with 'article' %}
 </head>
 
-<body class="post-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}">
+<body class="post-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}{% unless show_menu_btn or editmode %} menu-btn-hidden{% endunless %}">
   {% if body_bg_color != '' or editmode %}<div class="body-background-color js-body-background-color"></div>{% endif %}
 
   <div class="container js-container">

diff --git a/layouts/common_page.tpl b/layouts/common_page.tpl
@@ -6,7 +6,7 @@
   {% include 'edicy-tools-styles' %}
 </head>
 
-<body class="common-page body-background-image js-body{% if fallback_state %} bgpicker-fallback{% endif %}{% if site.search.enabled %} search-enabled{% endif %}">
+<body class="common-page body-background-image js-body{% if fallback_state %} bgpicker-fallback{% endif %}{% if site.search.enabled %} search-enabled{% endif %}{% unless show_menu_btn or editmode %} menu-btn-hidden{% endunless %}">
   {% if body_bg_color != '' or editmode %}<div class="body-background-color js-body-background-color"></div>{% endif %}
 
   <div class="container js-container">

diff --git a/layouts/front_page.tpl b/layouts/front_page.tpl
@@ -6,7 +6,7 @@
   {% include 'edicy-tools-styles' %}
 </head>
 
-<body class="front-page blog-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}">
+<body class="front-page blog-page body-background-image js-body{% if site.search.enabled %} search-enabled{% endif %}{% unless show_menu_btn or editmode %} menu-btn-hidden{% endunless %}">
   {% if body_bg_color != '' or editmode %}<div class="body-background-color js-body-background-color"></div>{% endif %}
 
   <div class="container js-container">

diff --git a/manifest.json b/manifest.json
@@ -8,16 +8,16 @@
     {
       "content_type": "page",
       "component": false,
-      "file": "layouts/front_page.tpl",
-      "layout_name": "page_front",
-      "title": "Front page"
+      "file": "layouts/common_page.tpl",
+      "layout_name": "page_default",
+      "title": "Common page"
     },
     {
       "content_type": "page",
       "component": false,
-      "file": "layouts/common_page.tpl",
-      "layout_name": "page_default",
-      "title": "Common page"
+      "file": "layouts/front_page.tpl",
+      "layout_name": "page_front",
+      "title": "Front page"
     },
     {
       "content_type": "blog",
@@ -33,27 +33,6 @@
       "layout_name": "blog_article",
       "title": "Blog article"
     },
-    {
-      "content_type": "component",
-      "component": true,
-      "file": "components/html-head.tpl",
-      "layout_name": "html-head",
-      "title": "html-head"
-    },
-    {
-      "content_type": "component",
-      "component": true,
-      "file": "components/edicy-tools-styles.tpl",
-      "layout_name": "edicy-tools-styles",
-      "title": "edicy-tools-styles"
-    },
-    {
-      "content_type": "component",
-      "component": true,
-      "file": "components/edicy-tools-variables.tpl",
-      "layout_name": "edicy-tools-variables",
-      "title": "edicy-tools-variables"
-    },
     {
       "content_type": "component",
       "component": true,
@@ -78,9 +57,9 @@
     {
       "content_type": "component",
       "component": true,
-      "file": "components/comment-form.tpl",
-      "layout_name": "comment-form",
-      "title": "comment-form"
+      "file": "components/html-head.tpl",
+      "layout_name": "html-head",
+      "title": "html-head"
     },
     {
       "content_type": "component",
@@ -144,6 +123,27 @@
       "file": "components/tags-post.tpl",
       "layout_name": "tags-post",
       "title": "tags-post"
+    },
+    {
+      "content_type": "component",
+      "component": true,
+      "file": "components/comment-form.tpl",
+      "layout_name": "comment-form",
+      "title": "comment-form"
+    },
+    {
+      "content_type": "component",
+      "component": true,
+      "file": "components/edicy-tools-styles.tpl",
+      "layout_name": "edicy-tools-styles",
+      "title": "edicy-tools-styles"
+    },
+    {
+      "content_type": "component",
+      "component": true,
+      "file": "components/edicy-tools-variables.tpl",
+      "layout_name": "edicy-tools-variables",
+      "title": "edicy-tools-variables"
     }
   ],
   "assets": [

diff --git a/sources/stylesheets/_search.scss b/sources/stylesheets/_search.scss
@@ -12,6 +12,10 @@
     position: absolute;
     top: 41px;
     right: 55px;
+
+    .menu-btn-hidden & {
+      right: 20px;
+    }
   }
 
   @include query($mobile-1) {
@@ -22,7 +26,6 @@
     @include color($primary-color, .8);
     @include bg($black);
 
-
     &.active {
       display: block;
       z-index: 9999;
@@ -164,6 +167,10 @@
     top: 40px;
     right: 52px;
     display: block;
+
+    .menu-btn-hidden & {
+      right: 20px;
+    }
   }
 
   svg {

diff --git a/stylesheets/main.css b/stylesheets/main.css
@@ -1126,6 +1126,9 @@ span[style*="font-size"] {
     top: 41px;
     right: 55px;
   }
+  .menu-btn-hidden .search {
+    right: 20px;
+  }
 }
 @media screen and (max-width: 640px) {
   .search {
@@ -1265,6 +1268,10 @@ span[style*="font-size"] {
     right: 52px;
     display: block;
   }
+  .menu-btn-hidden .search-open-btn, .menu-btn-hidden
+  .search-close-btn {
+    right: 20px;
+  }
 }
 .search-open-btn svg,
 .search-close-btn svg {

diff --git a/stylesheets/main.min.css b/stylesheets/main.min.css