Update app page with new "hero" approach

_includes/app_carousel.html

@@ -1,26 +0,0 @@
-<section id='image-carousel' class='splide'>
-    <div class='splide__track'>
-        <ul class='splide__list' style='list-style-type: none; list-style: none;'>
-        {% for image in site.static_files %}
-            {% if image.path contains 'appgallery/' %}
-            <li class='splide__slide'>
-                <img src="{{ image.path | relative_url }}" alt="" />
-            </li>
-            {% endif %}
-        {% endfor %}
-        </ul>
-    </div>
-</section>
-
-<script>
-document.addEventListener( 'DOMContentLoaded', function () {
-    new Splide('#image-carousel', {
-        type: 'loop',
-        perPage: 3,
-        autoPlay: true,
-        pagination: false,
-        // pagination: false,
-        // focus: 'center',
-    }).mount();
-});
-</script>

_includes/block/hero.html

@@ -50,11 +50,11 @@
   document.addEventListener( 'DOMContentLoaded', function () {
       new Splide('#image-carousel', {
           type: 'loop',
-          perPage: 1,
+          perMove: 1,
+          perPage: {% if include.perPage %}{{ include.perPage }}{% else %}1{% endif %},
           autoPlay: true,
           pagination: false,
       }).mount();
   });
   </script>
-  
 {% endif %}