diff --git a/src/js/load-more.js b/src/js/load-more.js
new file mode 100644
index 0000000..f08f23b
--- /dev/null
+++ b/src/js/load-more.js
@@ -0,0 +1,44 @@
+;(() => {
+ const getButton = (section) => section.querySelector('button')
+ const getArea = (section) => section.querySelector('[load-more-area]')
+ const getCurrentPage = (area) => parseInt(area.getAttribute('data-page'))
+ const getPerPage = (area) => parseInt(area.getAttribute('data-per-page'))
+ const getTotal = (area) => parseInt(area.getAttribute('data-total'))
+
+ const init = (section) => {
+ const area = getArea(section)
+ const perPage = getPerPage(area)
+ const total = area.children.length
+
+ area.setAttribute('data-total', total)
+ area.setAttribute('data-page', 1)
+ Array.from(area.children)
+ .slice(perPage)
+ .forEach((child) => child.classList.add('d-none'))
+ }
+
+ const handleLoadMore = (section) => {
+ const area = getArea(section)
+ const currentPage = getCurrentPage(area)
+ const perPage = getPerPage(area)
+ const total = getTotal(area)
+
+ const start = currentPage * perPage
+ const end = Math.min(start + perPage, total)
+
+ Array.from(area.children)
+ .slice(start, end)
+ .forEach((child) => child.classList.remove('d-none'))
+
+ area.setAttribute('data-page', currentPage + 1)
+
+ if (end >= total) {
+ getButton(section).classList.add('d-none')
+ }
+ }
+
+ document.querySelectorAll('[load-more-section]').forEach((section) => {
+ init(section)
+ getButton(section).addEventListener('click', () => handleLoadMore(section))
+ })
+})()
diff --git a/src/js/scripts.js b/src/js/scripts.js
index 3623ce3..5e01439 100644
--- a/src/js/scripts.js
+++ b/src/js/scripts.js
@@ -1,3 +1,4 @@
import 'bootstrap'
import './darkmode.js'
-import './tiles-showcase.js'
+import './load-more.js'
+import './tiles-showcase.js'
\ No newline at end of file
diff --git a/src/pages/enquiry-all-states.twig b/src/pages/enquiry-all-states.twig
index ecde3a3..a7def7a 100644
--- a/src/pages/enquiry-all-states.twig
+++ b/src/pages/enquiry-all-states.twig
@@ -152,46 +152,51 @@
-
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'requested'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'denied'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'partially-provided'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'ready'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'reviewing'
- }
- %}
-
-
-
- {%
- include 'partials::base/b_link.twig' with {
- text: 'Mehr Datenanfragen anzeigen',
- icon: 'plus-lg'
- }
- %}
+
+
+ {% for i in 0..5 %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'requested'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'denied'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'partially-provided'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'ready'
+ }
+ %}
+ {% endfor %}
+
+
+ {%
+ include 'partials::base/b_link.twig' with {
+ text: 'Mehr Datenanfragen anzeigen',
+ icon: 'plus-lg'
+ }
+ %}
+
diff --git a/src/pages/enquiry-validated.twig b/src/pages/enquiry-validated.twig
index 187f3ad..8b3907f 100644
--- a/src/pages/enquiry-validated.twig
+++ b/src/pages/enquiry-validated.twig
@@ -160,41 +160,51 @@
-
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'requested'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'denied'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'partially-provided'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'ready'
- }
- %}
-
-
-
- {%
- include 'partials::base/b_link.twig' with {
- text: 'Mehr Datenanfragen anzeigen',
- icon: 'plus-lg'
- }
- %}
+
+
+ {% for i in 0..5 %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'requested'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'denied'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'partially-provided'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'ready'
+ }
+ %}
+ {% endfor %}
+
+
+ {%
+ include 'partials::base/b_link.twig' with {
+ text: 'Mehr Datenanfragen anzeigen',
+ icon: 'plus-lg'
+ }
+ %}
+
diff --git a/src/pages/enquiry.twig b/src/pages/enquiry.twig
index 1e0ee32..af4cb58 100644
--- a/src/pages/enquiry.twig
+++ b/src/pages/enquiry.twig
@@ -152,42 +152,52 @@
-
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
-
- {%
- include 'partials::base/b_request.twig' with {
- status: 'requested'
- }
- %}
- {%
- include 'partials::base/b_request.twig' with {
- status: 'coordinating'
- }
- %}
-
+
+
+ {% for i in 0..5 %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating',
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating'
+ }
+ %}
-
- {%
- include 'partials::base/b_link.twig' with {
- text: 'Mehr Datenanfragen anzeigen',
- icon: 'plus-lg'
- }
- %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'requested'
+ }
+ %}
+ {%
+ include 'partials::base/b_request.twig' with {
+ status: 'coordinating'
+ }
+ %}
+ {% endfor %}
+
+
+ {%
+ include 'partials::base/b_link.twig' with {
+ text: 'Mehr Datenanfragen anzeigen',
+ icon: 'plus-lg'
+ }
+ %}
+