Version 1.4.5: Cyanine Pagination for posts, option to list posts on startpage

themes/cyanine/blog.twig

@@ -0,0 +1,103 @@
+<main class="{{ item.elementType }} w-100 pb5 bl br bb">
+
+	<div class="w-100 center grid-container">
+
+		<aside class="grid-header ph3 pv3">
+
+			<header>
+						
+				<div class="logo">
+					<p class="pa0 ma0">
+						<a class="link f1 fw9" href="{{ base_url }}" title="My Title">						
+							{% if logo %}
+								<img src="{{ base_url }}/{{ logo }}" class="logo-image"/>
+							{% else %}
+								{{ settings.title }}
+							{% endif %}
+						</a>
+					</p>
+				</div>
+					
+			</header>
+
+			{% if widgets %}
+				{% for index,widget in widgets %}
+					<div id="{{ index }}" class="mt4-l mt3">
+						{{ widget }}
+					</div>
+				{% endfor %}
+			{% endif %}
+
+		</aside>
+
+		<div class="grid-main ph3 ph4-l pv3 lh-copy f4 fw3">
+
+			{% if settings.themes.cyanine.blogintro %}
+				<article>
+					<header>
+					
+						<h1>{{ title }}</h1>
+		
+					</header>
+
+					{{ content }}
+
+				</article>
+			{% endif %}
+
+			{% set pagelist = getPageList(navigation, settings.themes.cyanine.blogfolder, base_url) %}
+			{% set pages = ( pagelist.folderContent|length / 2)|round(0, 'ceil') %}
+			{% set currentpage = currentpage ? currentpage : 1 %}
+			{% set currentposts = (currentpage - 1) * 2 %}
+
+			<ul class="post list pa0">
+
+				{% for element in pagelist.folderContent|slice(currentposts, 2) %}
+
+					{% set post = getPageMeta(settings, element) %}
+					{% set date = element.order[0:4] ~ '-' ~ element.order[4:2] ~ '-' ~ element.order[6:2] %}
+
+					<li class="post-entry">
+						<header>
+							<a class="link f-link underline-hover" href="{{ element.urlAbs }}"><h2 class="mt4 mb2">{{ post.meta.title }}</h2></a>
+							<div class="mt3"><small><time datetime="{{date}}">{{ date | date("d.m.Y") }}</time> | {{ post.meta.author }}</small></div>
+						</header>
+						<p>{{ post.meta.description }}</p>
+					</li>
+
+				{% endfor %}
+
+				{% if pages > 1 %}
+					<hr class="mv4">
+					<p>Page: 
+						{% for i in 1 .. pages %}
+							{% if i == currentpage %}
+								{{i}}
+							{% else %}
+								<a class="page" href="{{ item.urlAbs }}/p/{{i}}">{{i}}</a>
+							{% endif %}
+						{% endfor %}
+					</p>
+				{% endif %}
+
+			</ul>
+
+		</div>
+
+		<aside class="grid-sidebar ph3 pv3">
+
+			<nav id="contentnav" class="contentnav{{ settings.themes.cyanine.collapseNav ? ' collapse' : '' }}" aria-label="Menu">
+
+				<!-- burger menu controlled by invisible checkbox -->
+	  			<input type="checkbox" id="burger" class="dn">
+	  			<label for="burger" class="burgerbutton">&#9776;</label>	
+
+				{% include 'partials/navigation.twig' %}
+
+			</nav>
+
+		</aside>
+
+	</div>
+
+</main>

themes/cyanine/cyanine.yaml

@@ -26,9 +26,28 @@ forms:
         large: Large
         full: Full Width
 
+    blog:
+      type: checkbox
+      checkboxlabel: Activate a List of Posts on Homepage
+
+    blogdetails:
+      type: fieldset
+      legend: Configure List of Posts
+      fields:
+
+        blogintro:
+          type: checkbox
+          label: Intro Page
+          checkboxlabel: Show the content of the homepage before the list of posts
+
+        blogfolder:
+          type: text
+          label: Enter the folder path with the posts
+          placeholder: /blog
+
     landingpage:
       type: checkbox
-      checkboxlabel: Activate a landingpage
+      checkboxlabel: Activate a Landing Page on Homepage
 
     landingpageIntro:
       type: fieldset

themes/cyanine/index.twig

@@ -7,6 +7,10 @@
 	{% if home and settings.themes.cyanine.landingpage %}
 	
 		{% include 'home.twig' %}
+
+	{% elseif home and settings.themes.cyanine.blog %}
+	
+		{% include 'blog.twig' %}
 		
 	{% else %}
 		

themes/cyanine/layout.twig

@@ -51,7 +51,7 @@
 							grid-template-columns: 25% 75%;
 						}
 						.grid-main{
-							max-width: 56rem;
+							max-width: 48rem;
 							margin: 0 auto;
 						}
 					}
@@ -64,7 +64,7 @@
 						.grid-main{
 							padding-left: 4rem;
 							padding-right: 4rem;
-							margin: auto;
+							margin: 0 auto;
 						}
 					}
 				{% else %}

themes/cyanine/partials/posts.twig

@@ -1,6 +1,10 @@
+{% set pages = ( item.folderContent|length / 2)|round(0, 'ceil') %}
+{% set currentpage = currentpage ? currentpage : 1 %}
+{% set currentposts = (currentpage - 1) * 2 %}
+
 <ul class="post list pa0">
 
-	{% for element in item.folderContent %}
+	{% for element in item.folderContent|slice(currentposts, 2) %}
 
 		{% set post = getPageMeta(settings, element) %}
 		{% set date = element.order[0:4] ~ '-' ~ element.order[4:2] ~ '-' ~ element.order[6:2] %}
@@ -15,4 +19,17 @@
 
 	{% endfor %}
 
+	{% if pages > 1 %}
+		<hr class="mv4">
+		<p>Page: 
+			{% for i in 1 .. pages %}
+				{% if i == currentpage %}
+					{{i}}
+				{% else %}
+					<a class="page" href="{{ item.urlAbs }}/p/{{i}}">{{i}}</a>
+				{% endif %}
+			{% endfor %}
+		</p>
+	{% endif %}
+
 </ul>