Added page navigation (#209)

* Added navigation on page

* Removed useless log, added docs to navigator component

* Fixed duplicated variables, some changes in navigation functions, changed pages.twig and navigator.twig

* Added flatArray model, changed navigation functions

* Replaced page footer style to page.pcss

* Fixed generating flat array, when pages remove

* Removed useless generating

* Renamed flatArray model to pagesFlatArray, updated descriptions, renamed generate to regenerate, removed hardcoded key name in cache

* Changed styles naming and added margin for navigation

* Added ability to change nesting in flat array, fixed BEM

* Updated nesting parameter, fixed BEM

* Changed navigator component by passing objects, removed navigator wrapper

* Style navigator renamed to navigator__item

* Update src/backend/models/pagesFlatArray.ts

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

* Renamed navigator__item to navigator_item

* Deleted wrappers from navigator buttons, removed page__footer

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

src/backend/views/components/navigator.twig

@@ -0,0 +1,50 @@
+{#
+Reusable navigaor component.
+Available props:
+  - previousPage
+  - nextPage
+  - class: additional class for the navigator
+
+Usage example:
+  {% include 'components/navigator.twig' with {previousPage: previousPage, nextPage: nextPage} %}
+#}
+
+{% set mainClass = 'navigator__item' %}
+
+
+{% set tag = 'div' %}
+
+{% set tag = 'a' %}
+
+<div class="navigator">
+  {% if previousPage %}
+    <{{ tag }}
+      {{ name is not empty ? 'name="' ~ name ~ '"': '' }}
+        class="{{ mainClass }} {{ mainClass }}--previous {{ class ?? '' }}"
+      href="/{{ previousPage.uri }}"
+      >
+      <div class="{{ mainClass }}-direction">
+       previous
+      </div>
+      <div class="{{ mainClass }}-label">
+       {{ previousPage.title }}
+      </div>
+    </{{ tag }}>
+  {% endif %}
+
+  {% if nextPage %}
+    <{{ tag }}
+      {{ name is not empty ? 'name="' ~ name ~ '"': '' }}
+         class="{{ mainClass }} {{ mainClass }}--next {{ class ?? '' }}"
+      href="/{{ nextPage.uri }}"
+      >
+      <div class="{{ mainClass }}-direction">
+        next
+      </div>
+      <div class="{{ mainClass }}-label">
+       {{ nextPage.title }}
+      </div>
+    </{{ tag }}>
+  {% endif %}
+</div>
+

src/backend/views/pages/page.twig

@@ -39,8 +39,7 @@
         {% endif %}
       {%  endfor %}
     </section>
-    <footer>
-    </footer>
+    {% include 'components/navigator.twig' with {previousPage:  previousPage, nextPage: nextPage} %}
   </article>
 
 {% endblock %}