Merge pull request #836 from weseek/fix/835-search-typeashead-layout-broken

Fix/835 search typeashead layout broken

CHANGES.md

@@ -1,14 +1,17 @@
 CHANGES
 ========
 
-## 3.3.9
+## 3.3.9-RC
 
 * Fix: Import from Qiita:Team doesn't work
     * Introduced by 3.3.0
+* Fix: Typeahead shows autocomplete wrongly
+    * Introduced by 3.3.8
+* Support: Upgrade libs
+    * react-bootstrap-typeahead
 
 ## 3.3.8
 
-* Fix: Typeahead shows autocomplete wrongly
 * Fix: Move/Duplicate don't work
     * Introduced by 3.3.7
 * Fix: Server doesn't respond when root page is restricted

package.json

@@ -184,7 +184,7 @@
     "postcss-loader": "^3.0.0",
     "react": "^16.7.0",
     "react-bootstrap": "^0.32.1",
-    "react-bootstrap-typeahead": "^3.3.2",
+    "react-bootstrap-typeahead": "^3.3.4",
     "react-clipboard.js": "^2.0.0",
     "react-codemirror2": "^5.1.0",
     "react-dom": "^16.4.1",

src/client/styles/scss/_search.scss

@@ -30,6 +30,7 @@
   }
   .rbt-menu {
     margin-top: 3px;
+
     li a span {
       .page-path {
         display: inline;
@@ -100,11 +101,6 @@
       width: 300px;
     }
   }
-  .rbt-menu {
-    margin-top: 33px;   // DIRTY HACK
-                        //   note: 'transform: translate3d(0px, XXpx, 0px)' calculation has failed on .search-top
-                        //         since upgrade react-bootstrap-typeahead to v3.3.2 -- 2019.02.05 Yuki Takei
-  }
 }
 .search-sidebar {
   .search-form, .form-group, .rbt-input.form-control, .input-group {
@@ -115,6 +111,17 @@
   }
 }
 
+@mixin search-typeahead-rbtmenu-mt($margin-top) {
+  .search-typeahead .rbt-menu {
+    margin-top: $margin-top;    // DIRTY HACK
+                                //   note: 'transform: translate3d(0px, XXpx, 0px)' calculation has failed
+                                //         since upgrade react-bootstrap-typeahead to v3.3.2 -- 2019.02.05 Yuki Takei
+  }
+}
+#search-top, #renamePage, #duplicatePage, .search-page-input {
+  @include search-typeahead-rbtmenu-mt(36px);
+}
+
 .search-result {
 
   .search-result-list {

yarn.lock

@@ -7524,10 +7524,10 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-react-bootstrap-typeahead@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/react-bootstrap-typeahead/-/react-bootstrap-typeahead-3.3.2.tgz#ffe0193b6fc4af585d1724b1447d8bf2c871f75a"
-  integrity sha512-BCaFXrN3MefKj2jn8HqeSHu4hWwv1f8WtYWTNOhkz+KN4QtNLwbm7ttxOVuaG8CWk89HYGvF6QEjN5XIFE47hg==
+react-bootstrap-typeahead@^3.3.4:
+  version "3.3.4"
+  resolved "https://registry.yarnpkg.com/react-bootstrap-typeahead/-/react-bootstrap-typeahead-3.3.4.tgz#e0c26332f83cb6964fc3d003f8ffeb4b86fffab5"
+  integrity sha512-LMT+YlThPaB5pU7t8C9ml3kCPVGw6aEbVkpGCJIXcynJ5mxeUhFhGxpYv3UcpU3kFyowksUGG+ePSvqgaEsL7A==
   dependencies:
     classnames "^2.2.0"
     create-react-context "^0.2.3"