add read more button

_includes/infinite-scroller.html

@@ -4,10 +4,13 @@
   let previous_page = Number("{{ paginator.previous_page }}");
   let next_page = Number("{{ paginator.next_page }}");
   const total_pages = {{ paginator.total_pages }};
-
+  const scroller = document.getElementById('scroller');
   window.onload = () => {
     if (next_page) {
-
+      scroller.style.display = 'block';
+      scroller.onclick = () => {
+        read_more();
+      };
     }
   };
 
@@ -29,6 +32,7 @@
             next_page += 1;
           } else {
             next_page = undefined
+            scroller.style.display = 'none';            
           }
         }
       });

_sass/_layout.scss

@@ -228,6 +228,14 @@
     }
 }
 
+#scroller {
+  height: $spacing-unit;
+  margin: $spacing-unit auto;
+  display: none;
+  background-color: $header-footer-bg-color;
+  width: 90%;
+}
+
 @include media-query($on-palm) {
     .post-list {
 	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));	

index.html

@@ -14,3 +14,4 @@
   </ul>
 
 </div>
+<button id="scroller" type="button">もっと読む</button>