WIP: reconstruct layouts

* page list

resource/js/components/SearchPage/SearchResult.js

@@ -258,9 +258,11 @@ export default class SearchResult extends React.Component {
                 <i className="icon-bulb" /> Found {this.props.searchResultMeta.total} pages with "{this.props.searchingKeyword}"
               </div>
               <div className="clearfix"></div>
-              <ul className="page-list-ul page-list-ul-flat nav">
-                {listView}
-              </ul>
+              <div className="page-list">
+                <ul className="page-list-ul page-list-ul-flat nav">
+                  {listView}
+                </ul>
+              </div>
             </nav>
           </div>
           <div className="col-md-8 search-result-content" id="search-result-content">

resource/styles/scss/_page_list.scss

@@ -21,57 +21,57 @@
     line-height: 1.6em;
     font-size: 15px;
   }
-}
-
-.page-list-ul {
-  margin: 0;
-  padding-left: 0;
 
-  > li {
+  .page-list-ul {
     margin: 0;
-    list-style: none;
-
-    .page-list-option {
-      float: right;
-      margin-left: 4px;
-    }
+    padding-left: 0;
 
-    .picture {
-      width: 16px;
-      height: 16px;
-    }
+    > li {
+      margin: 0;
+      list-style: none;
 
-    > a {
-      display: inline;
-      padding: 0 4px;
-      color: inherit;
+      .page-list-option {
+        float: right;
+        margin-left: 4px;
+      }
 
-      strong {
-        color: #333;
+      .picture {
+        width: 16px;
+        height: 16px;
       }
-    }
 
-    > span.page-list-meta {
-      font-size: .9em;
-      color: #999;
+      > a {
+        display: inline;
+        padding: 0 4px;
+        color: inherit;
 
-      >span {
-        margin-right: .3rem;
+        strong {
+          color: #333;
+        }
       }
 
-      i {
-        margin-right: 2px;
+      > span.page-list-meta {
+        font-size: .9em;
+        color: #999;
+
+        >span {
+          margin-right: .3rem;
+        }
+
+        i {
+          margin-right: 2px;
+        }
       }
     }
-  }
 
-  // after second level indent
-  .page-list-ul {
-    padding-left: 2rem;
-  }
+    // after second level indent
+    .page-list-ul {
+      padding-left: 2rem;
+    }
 
-  // override .page-list-ul
-  &.page-list-ul-flat {
-    padding-left: 0;
+    // override .page-list-ul
+    &.page-list-ul-flat {
+      padding-left: 0;
+    }
   }
 }