feat: create index and about pages

content/_index.md

@@ -0,0 +1,5 @@
++++
+title = "Accueil"
++++
+
+Contenu

content/a-propos.md

@@ -0,0 +1,6 @@
++++
+title = "À propos"
+template = "about.html"
++++
+
+A propos de ce site

sass/parts/_index.scss

@@ -0,0 +1,9 @@
+section.last-articles {
+    margin-top: 4rem;
+
+    h1 {
+        border-bottom-width: .1rem;
+        border-bottom-style: solid;
+        border-bottom-color: var(--surface0);
+    }
+}

sass/styles.scss

@@ -3,6 +3,7 @@
 @use 'shortcodes/callout';
 @use 'parts/anchor';
 @use 'parts/articles';
+@use 'parts/index';
 @use 'parts/code';
 @use 'parts/footnote';
 @use 'parts/misc';

templates/about.html

@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+
+{% block content %}
+<h1 class="section-title">
+    {{ page.title }}
+</h1>
+<article>
+    <section>
+        {{ page.content | safe }}
+    </section>
+</article>
+{% endblock content %}

templates/blog.html

@@ -4,21 +4,5 @@
 <h1 class="section-title">
     {{ section.title }}
 </h1>
-<ul class="articles">
-    {% for page in section.pages %}
-    <li>
-        <h2 class="title">
-                <a href="{{ page.permalink | safe }}">{{ page.title }}</a>
-        </h2>
-        <span class="date">
-            <meta itemprop="datePublished" content="{{ page.date | date(format='%+') }}">
-            {{ page.date | date(format='%d %B %Y') }}
-        </span>
-        </p class="description">
-            <span>{{ page.summary | safe }}</span>
-            <span><a class="read-more" href="{{ page.permalink | safe }}">Lire la suite...</a></span>
-        </p>
-    </li>
-    {% endfor %}
-</ul>
+{%- include "partials/articles.html" -%}
 {% endblock content %}

templates/index.html

@@ -1,8 +1,13 @@
 {% extends "base.html" %}
 
 {% block content %}
-<h1 class="title">
-    This is my blog made with Zola.
-</h1>
-<p><a href="{{ get_url(path='@/articles/_index.md') }}">Posts</a>.</p>
+<section class="intro">
+{{ section.content | safe }}
+</section>
+<section class="last-articles">
+<h1>Derniers articles</h1>
+{%- set section = get_section(path="articles/_index.md") -%}
+{%- set max_articles = 3 -%}
+{%- include "partials/articles.html" -%}
+</section>
 {% endblock content %}

templates/partials/articles.html

@@ -0,0 +1,18 @@
+<ul class="articles">
+    {% for page in section.pages %}
+    {%- if max_articles is defined and loop.index > max_articles -%}{%- break -%}{%- endif -%}
+    <li>
+        <h2 class="title">
+                <a href="{{ page.permalink }}">{{ page.title }}</a>
+        </h2>
+        <span class="date">
+            <meta itemprop="datePublished" content="{{ page.date | date(format='%+') }}">
+            {{ page.date | date(format='%d %B %Y') }}
+        </span>
+        </p class="description">
+            <span>{{ page.summary | safe }}</span>
+            <span><a class="read-more" href="{{ page.permalink }}">Lire la suite...</a></span>
+        </p>
+    </li>
+    {% endfor %}
+</ul>