Merge pull request iissnan#1453 from Acris/bugfix

fixed: conflict between local search and algoia search
habren · Feb 20, 2017 · 6bdf8ac · 6bdf8ac
2 parents c2f6a1e + 2b07088
commit 6bdf8ac
Show file tree

Hide file tree

Showing 7 changed files with 135 additions and 111 deletions.
diff --git a/_config.yml b/_config.yml
@@ -436,13 +436,17 @@ algolia_search:
     hits_empty: "We didn't find any results for the search: ${query}"
     hits_stats: "${hits} results found in ${time} ms"
 
+
+# Local search
+local_search:
+  enable: false
+
 # External URL with BASE64 encrypt & decrypt
 # Usage: {% exturl text url "title" %}
 # Alias: {% extlink text url "title" %}
 exturl: false
 
 
-
 #! ---------------------------------------------------------------
 #! DO NOT EDIT THE FOLLOWING SETTINGS
 #! UNLESS YOU KNOW WHAT YOU ARE DOING

diff --git a/layout/_partials/header.swig b/layout/_partials/header.swig
@@ -33,7 +33,7 @@
 </div>
 
 <nav class="site-nav">
-  {% set hasSearch = theme.swiftype_key || theme.algolia_search.enable || theme.tinysou_Key || config.search %}
+  {% set hasSearch = theme.swiftype_key || theme.algolia_search.enable || theme.tinysou_Key || theme.local_search.enable %}
 
   {% if theme.menu %}
     <ul id="menu" class="menu">
@@ -53,7 +53,7 @@
         <li class="menu-item menu-item-search">
           {% if theme.swiftype_key %}
             <a href="javascript:;" class="st-search-show-outputs">
-          {% elseif config.search || theme.algolia_search.enable %}
+          {% elseif theme.local_search.enable || theme.algolia_search.enable %}
             <a href="javascript:;" class="popup-trigger">
           {% endif %}
             {% if theme.menu_icons.enable %}

diff --git a/layout/_partials/search.swig b/layout/_partials/search.swig
@@ -4,6 +4,6 @@
   {% include 'search/swiftype.swig' %}
 {% elseif theme.tinysou_Key %}
   {% include 'search/tinysou.swig' %}
-{% elseif config.search.path %}
+{% elseif theme.local_search.enable %}
   {% include 'search/localsearch.swig' %}
 {% endif %}
diff --git a/layout/_scripts/third-party/localsearch.swig b/layout/_scripts/third-party/localsearch.swig
@@ -1,4 +1,4 @@
-{% if config.search.path %}
+{% if theme.local_search.enable %}
   <script type="text/javascript">
     // Popup Window;
     var isfetched = false;

diff --git a/source/css/_common/components/third-party/algolia-search.styl b/source/css/_common/components/third-party/algolia-search.styl
@@ -1,8 +1,43 @@
+.algolia-pop-overlay
+  position: fixed
+  width: 100%
+  height: 100%
+  top: 0
+  left: 0
+  z-index: 2080
+  background-color: rgba(0, 0, 0, 0.3)
+
 .algolia-popup
   overflow: hidden
   padding: 0
+  display: none
+  position: fixed
+  top: 10%
+  left: 50%
+  width: 700px
+  height: 80%
+  margin-left: -350px
+  background: #fff
+  color: #333
+  z-index: 9999
+  border-radius: 5px
+  +mobile()
+    padding: 0
+    top: 0
+    left: 0
+    margin: 0
+    width: 100%
+    height: 100%
+    border-radius: 0
 
   .popup-btn-close
+    position: absolute
+    right: 14px
+    color: #4EBD79
+    font-size: 14px
+    font-weight: bold
+    text-transform: uppercase
+    cursor: pointer
     padding-left: 15px
     border-left: 1px solid #eee
     top: 10px

diff --git a/source/css/_common/components/third-party/localsearch.styl b/source/css/_common/components/third-party/localsearch.styl
@@ -1,117 +1,102 @@
-ul.search-result-list {
-  padding: 0;
-  margin: 0 5px;
-}
+.local-search-pop-overlay
+  position: fixed
+  width: 100%
+  height: 100%
+  top: 0
+  left: 0
+  z-index: 2080
+  background-color: rgba(0, 0, 0, 0.3)
 
-p.search-result {
-  border-bottom: 1px dashed #ccc;
-  padding: 5px 0;
-}
+.local-search-popup
+  display: none
+  position: fixed
+  top: 10%
+  left: 50%
+  margin-left: -350px
+  width: 700px
+  height: 80%
+  padding: 0
+  background: #fff
+  color: #333
+  z-index: 9999
+  border-radius: 5px
+  +mobile()
+    padding: 0
+    top: 0
+    left: 0
+    margin: 0
+    width: 100%
+    height: 100%
+    border-radius: 0
 
-a.search-result-title {
-  font-weight: bold;
-  font-size: 16px;
-}
+  ul.search-result-list
+    padding: 0
+    margin: 0 5px
 
-.search-keyword {
-  border-bottom: 1px dashed #f00;
-  font-size: 14px;
-  font-weight: bold;
-  color: #f00;
-}
+  p.search-result
+    border-bottom: 1px dashed #ccc
+    padding: 5px 0
 
-.local-search-header {
-  padding: 5px;
-  height: 36px;
-  background: #f5f5f5;
-  border-top-left-radius: 5px;
-  border-top-right-radius: 5px;
-}
+  a.search-result-title
+    font-weight: bold
+    font-size: 16px
 
-#local-search-result {
-  overflow: auto;
-  position: relative;
-  padding: 5px 25px;
-  height: calc(100% - 55px);
-}
+  .search-keyword
+    border-bottom: 1px dashed #f00
+    font-size: 14px
+    font-weight: bold
+    color: #f00
 
-.popup {
-  display: none;
-  position: fixed;
-  top: 10%;
-  left: 50%;
-  margin-left: -350px;
-  width: 700px;
-  height: 80%;
-  padding: 0;
-  background: #fff;
-  color: #333;
-  z-index: 9999;
-  border-radius: 5px;
-  +mobile() {
-    padding: 0;
-    top: 0;
-    left: 0;
-    margin: 0;
-    width: 100%;
-    height: 100%;
-    border-radius: 0px;
-  }
-}
+  .local-search-header
+    padding: 5px
+    height: 36px
+    background: #f5f5f5
+    border-top-left-radius: 5px
+    border-top-right-radius: 5px
 
-.popoverlay {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  top: 0px;
-  left: 0px;
-  z-index: 2080;
-  background-color: rgba(0, 0, 0, 0.3);
-}
+  #local-search-result
+    overflow: auto
+    position: relative
+    padding: 5px 25px
+    height: calc(100% - 55px)
 
-.local-search-input-wrapper {
-  display: inline-block;
-  width: calc(100% - 60px);
-  height: 36px;
-  line-height: 36px;
-  padding: 0 5px;
-}
+  .local-search-input-wrapper
+    display: inline-block
+    width: calc(100% - 60px)
+    height: 36px
+    line-height: 36px
+    padding: 0 5px
 
-.local-search-input-wrapper input {
-  padding: 8px 0;
-  height: 20px;
-  display: block;
-  width: 100%;
-  outline: none;
-  border: none;
-  background: transparent;
-  vertical-align: middle;
-}
+  .local-search-input-wrapper input
+    padding: 8px 0
+    height: 20px
+    display: block
+    width: 100%
+    outline: none
+    border: none
+    background: transparent
+    vertical-align: middle
 
-.search-icon, .popup-btn-close {
-  display: inline-block;
-  font-size: 18px;
-  color: #999;
-  height: 36px;
-  width: 18px;
-}
+  .search-icon, .popup-btn-close
+    display: inline-block
+    font-size: 18px
+    color: #999
+    height: 36px
+    width: 18px
 
-.search-icon {
-  float: left;
-}
+  .search-icon
+    float: left
 
-.popup-btn-close {
-  border-left: 1px solid #eee;
-  float: right;
-  cursor: pointer;
-  padding-left: 10px;
-}
+  .popup-btn-close
+    border-left: 1px solid #eee
+    float: right
+    cursor: pointer
+    padding-left: 10px
 
-#no-result {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  -webkit-transform: translate(-50%, -50%);
-  transform: translate(-50%, -50%);
-  color: #ccc;
-}
+  #no-result
+    position: absolute
+    left: 50%
+    top: 50%
+    -webkit-transform: translate(-50%, -50%)
+    transform: translate(-50%, -50%)
+    color: #ccc
diff --git a/source/js/src/algolia-search.js b/source/js/src/algolia-search.js
@@ -99,14 +99,14 @@ $(document).ready(function () {
 
   $('.popup-trigger').on('click', function(e) {
     e.stopPropagation();
-    $('body').append('<div class="popoverlay">').css('overflow', 'hidden');
+    $('body').append('<div class="algolia-pop-overlay">').css('overflow', 'hidden');
     $('.popup').toggle();
     $('#algolia-search-input').find('input').focus();
   });
 
   $('.popup-btn-close').click(function(){
     $('.popup').hide();
-    $('.popoverlay').remove();
+    $('.algolia-pop-overlay').remove();
     $('body').css('overflow', '');
   });