Add gallery, about and error pages

site/templates/about.twig

@@ -0,0 +1,16 @@
+{% extends "base.twig" %}
+
+{% block main %}
+    <main>
+
+        <section class="about-section">
+
+            <article class="about">
+                <h2 class="about__title">{{ page.title }}</h2>
+                <div class="about__presentation">{{ page.text.kirbytext|raw }}</div>
+            </article>
+
+        </section>
+        
+    </main>
+{% endblock %}

site/templates/base.twig

@@ -11,7 +11,7 @@
     <link rel="icon" type="image/png" href="{{ site.favicon }}" />
 
     {% block stylesheets %}
-        <link rel="stylesheet" href="{{ asset('assets/css/minireset.min.css') }}"/>
+        <link rel="stylesheet" href="https://cdn.plyr.io/3.6.12/plyr.css" />
         <link rel="stylesheet" href="{{ asset('assets/css/style.min.css') }}"/>
     {% endblock %}
 
@@ -25,7 +25,7 @@
             <div class="header-bar">
 
                 <div class="header-bar__logo" aria-hidden="true">
-                    <a class="header-bar__logo-link" href="{{ site.homePage.url }}" target="_self" aria-label="Accéder à la page d'accueil de {{ site.title }}" tabindex="-1">
+                    <a class="header-bar__logo-link" href="{{ site.homePage.url }}" target="_self" aria-label="Accéder à la page d'accueil de {{ site.title }}">
                         <h1 class="header-bar__logo-title">{{ site.title }}</h1>
                     </a>
                 </div>
@@ -73,6 +73,7 @@
 
     {% block javascripts %}
         <script src="https://cdn.jsdelivr.net/npm/circletype@2.3.0/dist/circletype.min.js"></script>
+        <script src="https://cdn.plyr.io/3.6.12/plyr.polyfilled.js"></script>
         <script src="{{ asset('assets/js/app.js') }}"></script>
     {% endblock %}
 

site/templates/error.twig

@@ -0,0 +1,21 @@
+{% extends "base.twig" %}
+
+{% block main %}
+	<main>
+
+		<section class="error-section">
+			<article class="error">
+				<h2 class="error__title">Erreur {{ kirby.response.code }}</h2>
+				{% if kirby.response.code == 404 %}
+                    <p class="error__message">La page que vous demandez n'existe pas...</p>
+                {% else %}
+                    <p class="error__message">Une erreur est survenue...</p>
+                {% endif %}
+				<div class="error__button">
+                    <a href="{{ site.homePage.url }}" target="_self">Retourner à la page d'accueil</a>
+                </div>
+			</article>
+		</section>
+
+	</main>
+{% endblock %}

site/templates/gallery.twig

@@ -0,0 +1,29 @@
+{% extends "base.twig" %}
+
+{% block main %}
+    <main>
+
+        <section class="gallery-section">
+
+            <article class="gallery">
+                <h2 class="gallery__title">{{ page.title }}</h2>
+                {% if page.text.isNotEmpty %}
+                    <div class="gallery__introduction">{{ page.text.kirbytext|raw }}</div>
+                {% endif %}
+                <div class="gallery__artworks">
+                    {% for file in page.files %}
+                        {% if file.type == 'image' %}
+                            <figure class="gallery__image">
+                                <img src="{{ file.url }}" srcset="{{ file.srcset() }}" alt="{{ file.alt_text }}">
+                                <figcaption>{{ file.caption }}</figcaption>
+                            </figure>
+                        {% elseif file.type == 'video' %}
+                        {% endif %}
+                    {% endfor %}
+                </div>
+            </article>
+
+        </section>
+
+    </main>
+{% endblock %}

site/templates/home.twig

@@ -2,6 +2,7 @@
 
 {% block main %}
     <main>
+
         <section class="home-section">
 
             <div class="home">
@@ -23,5 +24,6 @@
             </div>
 
         </section>
+        
     </main>
 {% endblock %}