impl (#4356)

packages/app/src/components/SearchPage.jsx

@@ -92,13 +92,14 @@ class SearchPage extends React.Component {
   render() {
     return (
       <div>
-        <div className="search-page-input sps sps--abv">
+        {/* 2021/9/22 TODO: Move to SearchResult */}
+        {/* <div className="search-page-input sps sps--abv">
           <SearchPageForm
             t={this.props.t}
             onSearchFormChanged={this.search}
             keyword={this.state.searchingKeyword}
           />
-        </div>
+        </div> */}
         <SearchResult
           pages={this.state.searchedPages}
           searchingKeyword={this.state.searchingKeyword}

packages/app/src/components/SearchPage/SearchResult.jsx

@@ -292,7 +292,7 @@ class SearchResult extends React.Component {
     return (
       <div className="content-main">
         <div className="search-result row" id="search-result">
-          <div className="col-lg-4 d-none d-lg-block page-list search-result-list pr-0" id="search-result-list">
+          <div className="col-lg-6 d-none d-lg-block page-list search-result-list pr-0" id="search-result-list">
             <nav>
               <div className="d-flex align-items-start justify-content-between mt-1">
                 <div className="search-result-meta">
@@ -309,7 +309,7 @@ class SearchResult extends React.Component {
               </div>
             </nav>
           </div>
-          <div className="col-lg-8 search-result-content" id="search-result-content">
+          <div className="col-lg-6 search-result-content" id="search-result-content">
             <SearchResultList pages={this.props.pages} searchingKeyword={this.props.searchingKeyword} />
           </div>
         </div>

packages/app/src/styles/_search.scss

@@ -222,6 +222,7 @@
   }
 }
 
+// 2021/9/22 TODO: Remove after moving to SearchResult
 .search-page-input {
   position: sticky;
   top: 15px;