content/en/news/2024-05-01-a-new-indie-studio.md

@@ -1,6 +1,5 @@
 ---
 title: Frog Collective a new indie game development studio!
-date: 04/21/2024
 ---
 
 **Hi everyone and welcome!**
@@ -17,12 +16,11 @@ Talking about technical setup, the first step was to define the whole tech stack
 The open source software is not as strong in the video game industry as in other domains like web development.
 As a side goal, we aim to help this community and projects grow, so we choose to use as much open-source software as we can and hope to contribute in the future.
 
-<center>
-    <img src="/img/godot-logo.svg" alt="Godot Engine Logo" class="godot-logo" style="height: 200px;">
-</center>
+![Godot Engine Logo](news/godot-logo.png)
 
 **We also want to thank Corentin** (a close friend). He set up all the toolchain we use to develop our games, and he did that with some panache.
-We use only self-hosted open-source tools.
+We use only open-source tools, everything is self-hosted and all of this setup is automatized with a script called Jean-toto.
+Corentin aim to make this tool available for everyone so if you're an IT enthusiast, stay tuned!
 
 But enough ramble, after this luxurious technical setup, we started to work on a prototype and things aligned themself from week to week.
 At the end of the first month, we asked our friends to test our prototype.
@@ -31,9 +29,7 @@ We are almost ready to announce it, but I'll keep that for a later post :).
 
 Nevertheless, we are proud to present our game studio: **Frog Collective.**
 
-<center>
-    <img src="/img/logo-black.png" alt="Frog Collective Logo" class="godot-logo" style="height: 300px;">
-</center>
+![Frog Collective Logo](news/logo-black.png)
 
 We hope you'll like what we will do together.
 

content/fr/news/2024-05-01-a-new-indie-studio.md

@@ -1,6 +1,5 @@
 ---
 title: Frog Collective, un nouveau studio de développement de jeux indépendants !
-date: 21/04/2024
 ---
 
 **Salut à tous et bienvenue!**
@@ -17,12 +16,11 @@ En ce qui concerne la configuration technique, la première étape a consisté
 Les logiciels libres ne sont pas aussi répandus dans l'industrie du jeu vidéo que dans d'autres domaines tels que le développement web.
 On aimerai que ces projets devienne plus important dans le milieu, on a donc choisi d'utiliser autant de logiciels libres que possible et espérons y contribuer à l'avenir.
 
-<center>
-    <img src="/img/godot-logo.svg" alt="Logo du Godot Engine" class="godot-logo" style="height: 200px;">
-</center>
+![Logo du Godot Engine](news/godot-logo.png)
 
 **Nous tenons également à remercier Corentin** (un ami proche). Il a mis en place toute la chaîne d'outils que nous utilisons pour développer nos jeux, et il l'a fait avec un certain panache.
-Nous n'utilisons que des outils open-source et tout est auto-hébergé.
+Nous n'utilisons que des outils open-source, tout est auto-hébergé et toute cette mise en place est automatisée grâce à un script appelé Jean-toto.
+Corentin a pour objectif de rendre cet outil accessible à tous, alors si vous êtes un passionné d'informatique, restez à l'écoute !
 
 Mais trêve de bavardage, après cette luxueuse installation technique, nous avons commencé à travailler sur un prototype et les choses se sont alignées petit à petit.
 A la fin du premier mois, nous avons demandé à nos amis de tester notre prototype.
@@ -31,9 +29,7 @@ Nous sommes presque prêts à l'annoncer, mais je garderai cela pour un post ult
 
 Nous sommes fiers de vous présenter notre studio de jeu : **Frog Collective.**
 
-<center>
-    <img src="/img/logo-black.png" alt="Logo de Frog Collective" class="godot-logo" style="height: 300px;">
-</center>
+![Logo de Frog Collective](news/logo-black.png)
 
 Nous espérons que vous aimerez ce que nous ferons ensemble.
 

src/lib/section.html

@@ -3,7 +3,6 @@
   id,
   title_picture,
   title_picture_hover = None,
-  title_picture_active = None,
   title_picture_offset = "0px",
   title_color = "var(--color-text)")
 -%}
@@ -15,7 +14,6 @@
         color: {{ title_color }};
         --picture-url:url('{{ title_picture }}');
         --picture-hover-url:url('{{ title_picture_hover or title_picture }}');
-        --picture-active-url:url('{{ title_picture_active or title_picture }}');
         --picture-offset: {{ title_picture_offset }};
       "
     >

src/lib/section.scss

@@ -18,12 +18,16 @@
     }
 
     &--title {
+        z-index: -1;
+
         background: transparent;
         position: relative;
         margin-top: 110px;
         align-self: center;
 
         &::before {
+            z-index: -1;
+
             position: absolute;
             top: -110px;
             left: var(--picture-offset);
@@ -38,10 +42,6 @@
             background-image: var(--picture-hover-url);
         }
 
-        &:active::before {
-            background-image: var(--picture-active-url);
-        }
-
         @media ($mobile-breakpoint) {
             margin-top: 70px;
 

src/pages/index/footer.scss

@@ -30,14 +30,12 @@
 
     &--copyright {
         display: flex;
-        flex-grow: 1;
         align-self: center;
-        justify-content: center;
         padding: var(--space-medium);
     }
 
     &--links {
-        flex: 0 1 1px;
+        flex: 1 1 1px;
         display: flex;
         align-self: center;
         align-items: center;

src/pages/index/news.html

@@ -10,11 +10,12 @@
   {% for news in glob("news/*.md") | map('markdown') %}
     <div class="news">
       <div class="news--header">
-        <div class="news--date">{{ news.meta.date }}</div>
+        {% with creation_date = news | git_creation_date %}
+          <div class="news--date">{{ creation_date.strftime('%d/%m/%Y') }}</div>
+        {% endwith %}
         <h3 class="news--title">{{ news.meta.title }}</h3>
       </div>
         <div class="news--content">
-          <style>{{ news.meta.css }}</style>
           {{ news }}
         </div>
       </div>

src/pages/index/presentation.html

@@ -12,7 +12,6 @@
   "collective",
   "/img/section-collective.png",
   title_picture_hover = "/img/section-collective-hover.png",
-  title_picture_active = "/img/section-collective-active.png",
   title_picture_offset = "170px"
   ) %}
 <div class="presentation--content">