.vscode/tasks.json

@@ -1,23 +0,0 @@
-{
-    // See https://go.microsoft.com/fwlink/?LinkId=733558
-    // for the documentation about the tasks.json format
-    "version": "2.0.0",
-    "tasks": [
-        {
-            "label": "Start dev server",
-            "type": "shell",
-            "command": "browser-sync start --server build/ --watch"
-        },
-        {
-            "label": "Build",
-            "group": "build",
-            "type": "shell",
-            "command": "nox -R -s build"
-        },
-        {
-            "label": "Extract localization messages",
-            "type": "shell",
-            "command": "nox -R -s extract_messages"
-        }
-    ]
-}

README.md

@@ -58,10 +58,3 @@ We use the BEM naming convention with the scheme
 See https://getbem.com/naming/ for insigths on the BEM naming convention.
 
 We use SASS as a CSS extension language (https://sass-lang.com/).
-
-### Dev env
-
-Install the following dependencies to be able to test the website locally:
-```sh
-npm install -g browser-sync
-```

content/en/games/the-guild.md

@@ -2,7 +2,7 @@
 title: The Guild
 picture: games/the-guild.png
 picture_alt: in-game screenshot of a cow-boy riding in wilderness
-website: https://the-guild.frog-collective.com
+website: https://the-guild.frog-collective.org
 ---
 
 Saddle up, partner! Welcome to "Frontier Fortune: Prospector's Quest" where the

content/fr/games/the-guild.md

@@ -2,7 +2,7 @@
 title: The Guild
 picture: games/the-guild.png
 picture_alt: Image de jeux avec un cowboy
-website: https://the-guild.frog-collective.com
+website: https://the-guild.frog-collective.org
 ---
 
 En selle, cher collaborateur !

locale/fr/LC_MESSAGES/site.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PROJECT VERSION\n"
 "Report-Msgid-Bugs-To: EMAIL@ADDRESS\n"
-"POT-Creation-Date: 2024-06-06 16:07+0200\n"
+"POT-Creation-Date: 2024-05-23 02:12+0200\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language: fr\n"
@@ -19,7 +19,7 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Generated-By: Babel 2.15.0\n"
 
-#: src/lib/nav.html:14
+#: src/lib/nav.html:14 src/pages/index/presentation.html:11
 msgid "Collective"
 msgstr "Collectif"
 
@@ -41,58 +41,94 @@ msgstr ""
 "Frog Collective est un studio indépendant de développement de jeux vidéos"
 " basé en France."
 
-#: src/pages/index/presentation.html:11
-#, fuzzy
-msgid "Frog Collective"
-msgstr "Collectif"
-
 #: src/pages/index/presentation.html:18
 msgid "Who are we ?"
 msgstr "Qui est nous ?"
 
 #: src/pages/index/presentation.html:20
 msgid ""
-"We are Frog Collective, a very small indie game development company with "
+"Welcome to the cozy world of the Frog Collective, where big dreams come "
-"years of experience under our belts. We've decided to team up to make "
+"in small packages! We're not your typical gaming behemoth with a massive "
-"games together, driven by our passion and guided by collective decisions."
+"team and towering office buildings. Nope, we're just two passionate souls"
+" huddled around a couple of computers, fueled by an insatiable love for "
+"crafting little nuggets of joy that won't break the bank."
 msgstr ""
+"Bienvenue dans le monde soyeux de la compagnie des grenouilles, où les "
+"gros rêves sont livrés dans des petits paquets. Nous ne sommes pas votre "
+"turbo-corporation habituelle avec des équipes de fifous et des bureaux au"
+" cœur du 16ème arrondissement. Non, nous sommes justes deux âmes "
+"PASSIONNÉES lovées près de quelques transistors, animés par l'envie "
+"insatiable de confectionner des pépites de joie, que nous vendrons "
+"ensuite au baudaud  contre une somme relativement anectodique."
 
-#: src/pages/index/presentation.html:26
+#: src/pages/index/presentation.html:30
 msgid ""
-"We're not the typical gaming behemoth with a massive team and towering "
+"Here we specialize in creating bite-sized adventures that anyone can pick"
-"office buildings. Nope, we're just two passionate souls huddled around a "
+" up and play, but only the true gaming aficionados can conquer. Think of "
-"couple of computers. We want to create bite-sized adventures that anyone "
+"us as the David to the Goliaths of the gaming industry. Our games might "
-"can pick up and play, yet remain challenging for those who wish to "
+"be small, but they will keep you coming back for more. Now, you might be "
-"explore every corner."
+"wondering, how on earth do two people manage to steer the ship in this "
+"vast ocean of pixels? Well, let me tell you, it's all about that sweet, "
+"sweet collective decision-making magic. We're like yin and yang, "
+"balancing each other's quirks and strengths as we navigate the "
+"treacherous waters of game development."
 msgstr ""
+"Nous sommes les spécialiste de l'aventure façon canapé-cocktail, que "
+"n'importe qui peu picorer mais que seuls les vrais PGM peuvent maîtriser,"
+" façon peu subtile de marketter une cible aussi large que le Nevada. "
+"Voyez-nous comme les Davids du Goliath de l'industrie du jeu vidéo "
+"(https://stjv.fr). Nos jeux sont petits, mais vous ne pourrez vous "
+"empêcher d'y revenir, tels de jolis cachets d'oxycodone. Mais, vous vous "
+"demandez peut-être comment deux personnes peuvent se partager la barre "
+"dans cet océan de pixels ? C'est grâce à cette douce, douce magie de la "
+"prise de décision collective. (N.D.T : Chat GPT n'a clairement jamais "
+"fait partie d'une organisation de gauche pour sortir des trucs aussi "
+"cons). Nous sommes le yin et yang, nous tempérant l'un l'autre nos "
+"écueils et nos force, lorsque nous navigons dans les eaux scabreuses du "
+"développement de logiciels vidéo-ludiques (N.D.T, mais par contre il sait"
+" admirablement amener une pointe d'érotisme là où on en attend pas)."
 
-#: src/pages/index/presentation.html:33
+#: src/pages/index/presentation.html:44
 msgid ""
-"So, if you're tired of the same old cookie-cutter games and fancy a "
+"Whether it's brainstorming ideas over a late-night pizza session or "
-"little dose of indie charm, strap in and join us on this wild ride!"
+"duking it out over the perfect shade of blue for our protagonist's cape, "
+"every decision is a team effort. And hey, when you've only got two heads "
+"in the game, you learn to trust each other's instincts real quick. So, if"
+" you're tired of the same old cookie-cutter games and fancy a little dose"
+" of indie charm, strap in and join us on this wild ride through the "
+"pixelated cosmos. Who knows, you might just discover your new favorite "
+"addiction in the unlikeliest of places. Welcome to Frog Collective – "
+"where small is mighty, and fun knows no bounds!"
 msgstr ""
+"Que ça soit un remue-méninge (pendant les heures de bureau) ou croiser le"
+" fer à propos de la couleur parfaite pour la cape de notre héros, chaque "
+"décision est un travail d'équipe. Et quand vous n'êtes que deux dans le "
+"game, vous apprenez prestement à faire confiance aux instincts de  "
+"l'autre, sauf quand il a tort. Donc, si vous en avez ras la couette des "
+"mêmes vieux jeux à l'emporte-pièce et que vous avez envie d'une petite "
+"dose de charme indé ou de fentanyl, attachez votre ceinture et rejoignez-"
+"nous dans cette chevauchée fantastique dans le cosmos pixelisé. Qui sait,"
+" vous trouverez peut-être votre nouvelle addiction là où vous ne "
+"l'attendiez pas. Bienvenu dans le collectif des batraciens, où le modeste"
+" devient majestueux et le fun ne connaît aucune limite ! Belle journée."
 
-#: src/pages/index/presentation.html:38
+#: src/pages/index/presentation.html:56
-msgid "Let's have some fun!"
-msgstr ""
-
-#: src/pages/index/presentation.html:42
 msgid "The team"
 msgstr "L’équipe"
 
-#: src/pages/index/presentation.html:46
+#: src/pages/index/presentation.html:60
 msgid "Aurel works on art"
 msgstr "Aurel s’occupe de l’art"
 
-#: src/pages/index/presentation.html:47
+#: src/pages/index/presentation.html:61
 msgid "drawing of Aurel's face"
 msgstr "Dessin du visage d’Aurel"
 
-#: src/pages/index/presentation.html:52
+#: src/pages/index/presentation.html:66
 msgid "Adrien works on programming"
 msgstr "Adrien s'occupe de la programmation"
 
-#: src/pages/index/presentation.html:53
+#: src/pages/index/presentation.html:67
 msgid "drawing of Adrien's face"
 msgstr "dessin du visage d’Adrien"
 

src/lib/css/controls.scss

@@ -1,7 +1,7 @@
 %button {
-    --background: var(--color-dark);
+    --background: var(--color-accent);
-    --background-hover: var(--color-primary);
+    --background-hover: var(--background);
-    --color: var(--color-on-primary);
+    --color: var(--color-on-accent);
 
     border-radius: var(--border-radius-small);
     padding: var(--space-small) var(--space-medium);

src/lib/css/variables.scss

@@ -2,16 +2,20 @@ $mobile-breakpoint: "max-width: 768px";
 
 :root {
     --background-dark: url("/img/background-black-red.jpg");
-    --background-red: url("/img/background-red.jpg");
 
     --color-text: #161616;
-    --color-surface: #ffffff;
 
     --color-primary: #DB2937;
-    --color-on-primary: #ffffff;
+    --color-on-primary: white;
+
+    --color-accent: #303030;
+    --color-on-accent: #EA8189;
 
     --color-dark: #161616;
-    --color-on-dark: #ffffff;
+    --color-dark-gradient: linear-gradient(0deg, var(--color-accent) 0%, var(--color-dark) 22%);
+    --color-on-dark: #E35965;
+
+    --color-surface: #fff3f3;
 
     --color-link: var(--color-primary);
 

src/lib/nav.scss

@@ -1,7 +1,7 @@
 %nav-button {
     @extend %button;
     --background: transparent;
-    --background-hover: var(--color-primary);
+    --background-hover: var(--color-accent);
 }
 
 .nav-bar {
@@ -116,7 +116,7 @@
         width: 2px;
         margin: 0 var(--space-small);
 
-        background: var(--color-on-primary);
+        background: var(--color-on-accent);
 
         @media($mobile-breakpoint) {
             display: none;
@@ -162,7 +162,7 @@
             margin: 5px 0;
 
             display: block;
-            background-color: var(--color-on-primary);
+            background-color: var(--color-on-accent);
             transition: all 0.3s ease-out;
         }
     }

src/lib/section.scss

@@ -22,14 +22,14 @@
 
         background: transparent;
         position: relative;
-        margin-top: 120px;
+        margin-top: 110px;
         align-self: center;
 
         &::before {
             z-index: -1;
 
             position: absolute;
-            top: -120px;
+            top: -110px;
             left: var(--picture-offset);
             width: 150px;
             height: 125px;

src/pages/index/footer.html

@@ -2,7 +2,7 @@
     <div class="footer--content">
         <img class="footer--logo" src="/img/footer-logo.png">
         <div class="footer--links">
-            <a href="mailto:contact@frog-collective.com">
+            <a href="mailto:contact@frog-collective.org">
                 {{ gettext("Contact") }}
             </a>
             <img src="/img/social.png"></img>

src/pages/index/games.html

@@ -3,7 +3,7 @@
 {% call section(gettext("Games"),
   "games",
   "/img/section-games.png",
-  title_picture_offset = "0px",
+  title_picture_offset = "-20px",
   title_color = "var(--color-primary)"
 ) %}
   {% for game in glob("games/*.md") | map('markdown') %}

src/pages/index/games.scss

@@ -3,7 +3,7 @@
 
     display: flex;
     flex-direction: column;
-    background: transparent;
+    background: var(--color-surface);
     padding: 0;
 
     &--picture-wrapper {
@@ -16,11 +16,8 @@
         @extend h2;
         margin: 0;
         padding: var(--space-small);
-        background: var(--background-red);
+        background: var(--background-dark);
         color: var(--color-on-dark);
-        padding: var(--space-small) var(--space-xlarge);
-        font-family: 'Knewave';
-        font-size: 40px;
     }
 
     &--description {

src/pages/index/news.html

@@ -4,7 +4,7 @@
   gettext("News"),
   "news",
   "/img/section-news.png",
-  title_picture_offset="0px",
+  title_picture_offset="60px",
   title_color = "var(--color-primary)"
 ) %}
   {% for news in glob("news/*.md") | map('markdown') %}

src/pages/index/news.scss

@@ -10,12 +10,10 @@
     &--header {
         display: flex;
         color: var(--color-on-dark);
-        background: var(--background-red);
+        background: var(--background-dark);
         padding: var(--space-small) var(--space-medium);
         align-items: center;
         gap: var(--space-small);
-        font-family: 'Knewave';
-        font-size: 24px;
 
         @media($mobile-breakpoint) {
             flex-direction: column;
@@ -39,8 +37,6 @@
     &--title {
         flex-grow: 1;
         margin: 0;
-        font-family: 'Knewave';
-        font-size: 32px;
 
         @media($mobile-breakpoint) {
             text-align: center;

src/pages/index/presentation.html

@@ -8,7 +8,7 @@
 {% endmacro %}
 
 {% call section(
-  gettext("Frog Collective"),
+  gettext("Collective"),
   "collective",
   "/img/section-collective.png",
   title_picture_hover = "/img/section-collective-hover.png",
@@ -18,25 +18,39 @@
     <h2>{{ gettext("Who are we ?") }}</h2>
     <p>
       {% trans %}
-      We are Frog Collective, a very small indie game development company with years of experience under our belts. 
+        Welcome to the cozy world of the Frog Collective, where big dreams come
-      We've decided to team up to make games together, driven by our passion and guided by collective decisions.
+        in small packages! We're not your typical gaming behemoth with a massive
+        team and towering office buildings. Nope, we're just two passionate souls
+        huddled around a couple of computers, fueled by an insatiable love for
+        crafting little nuggets of joy that won't break the bank.
       {% endtrans %}
     </p>
+
     <p>
       {% trans %}
-      We're not the typical gaming behemoth with a massive team and towering office buildings. 
+        Here we specialize in creating bite-sized adventures that anyone can pick
-      Nope, we're just two passionate souls huddled around a couple of computers. 
+        up and play, but only the true gaming aficionados can conquer. Think of
-      We want to create bite-sized adventures that anyone can pick up and play, yet remain challenging for those who wish to explore every corner.
+        us as the David to the Goliaths of the gaming industry. Our games might
+        be small, but they will keep you coming back for more. Now, you might be
+        wondering, how on earth do two people manage to steer the ship in this
+        vast ocean of pixels? Well, let me tell you, it's all about that sweet,
+        sweet collective decision-making magic. We're like yin and yang,
+        balancing each other's quirks and strengths as we navigate the
+        treacherous waters of game development.
       {% endtrans %}
     </p>
+
       <p>
       {% trans %}
-      So, if you're tired of the same old cookie-cutter games and fancy a little dose of indie charm, strap in and join us on this wild ride!
+        Whether it's brainstorming ideas over a late-night pizza session or
-    {% endtrans %}
+        duking it out over the perfect shade of blue for our protagonist's cape,
-  </p>
+        every decision is a team effort. And hey, when you've only got two heads
-  <p>
+        in the game, you learn to trust each other's instincts real quick. So, if
-    {% trans %}
+        you're tired of the same old cookie-cutter games and fancy a little dose
-      Let's have some fun!
+        of indie charm, strap in and join us on this wild ride through the
+        pixelated cosmos. Who knows, you might just discover your new favorite
+        addiction in the unlikeliest of places. Welcome to Frog Collective –
+        where small is mighty, and fun knows no bounds! 
       {% endtrans %}
     </p>
     <h2 class="comrades--title">{{ gettext("The team") }}</h2>