Merge f920d27 into de9c401

assets/scss/components/_banner.scss

@@ -25,6 +25,7 @@
   }
 
   p {
+    margin: 0 0 15px;
     max-width: 700px;
   }
 

assets/scss/components/_glossary-list.scss

@@ -0,0 +1,117 @@
+@use '../abstracts' as *;
+
+.glossary-list {
+  margin: 0;
+  padding: 0;
+  width: 33.33%;
+  min-width: 33.33%;
+}
+
+.glossary-list__item {
+  margin-bottom: 15px;
+  padding-right: 30px;
+  padding-left: 100px;
+  display: flex;
+
+  &:before,
+  &:after {
+    display: none;
+  }
+
+  &:first-of-type {
+    margin-top: 0 !important;
+  }
+
+  a {
+    font-size: 20px;
+    line-height: 1.3;
+  }
+}
+
+[class*="glossary-list__item--"] {
+  margin-top: 50px !important;
+  position: relative;
+
+  &:before {
+    height: unset;
+    width: unset;
+    position: absolute;
+    top: -8px;
+    left: 0;
+    display: flex;
+    font-family: 'DM Serif Display';
+    font-size: 72px;
+    line-height: 1;
+    text-transform: uppercase;
+    border: none;
+    background: none;
+  }
+}
+
+$characters: (
+  0: '#',
+  a: 'a',
+  b: 'b',
+  c: 'c',
+  d: 'd',
+  e: 'e',
+  f: 'f',
+  g: 'g',
+  h: 'h',
+  i: 'i',
+  j: 'j',
+  k: 'k',
+  l: 'l',
+  m: 'm',
+  n: 'n',
+  o: 'o',
+  p: 'p',
+  q: 'q',
+  r: 'r',
+  s: 's',
+  t: 't',
+  u: 'u',
+  v: 'v',
+  w: 'w',
+  x: 'x',
+  y: 'y',
+  z: 'z'
+);
+
+@each $character, $character-icon in $characters {
+  .glossary-list__item--#{$character} {
+    &:before {
+      content: $character-icon;
+    }
+  }
+}
+
+@media(max-width: $screen-md) {
+  .glossary-list__item {
+    padding-left: 60px;
+
+    a {
+      font-size: 18px;
+    }
+  }
+
+  [class*="glossary-list__item--"] {
+    &:before {
+      top: -1px;
+      font-size: 40px;
+    }
+  }
+}
+
+@media(max-width: $screen-xs) {
+  .glossary-list {
+    width: 100%;
+    min-width: 100%;
+  }
+
+  [class*="glossary-list__item--"] {
+    &:first-of-type {
+      margin-top: 50px !important;
+    }
+  }
+}

assets/scss/components/_glossary.scss

@@ -0,0 +1,13 @@
+@use '../abstracts' as *;
+
+.glossary {
+  margin: 0 0 100px;
+  display: flex;
+  flex-wrap: wrap;
+}
+
+@media (max-width: $screen-xs) {
+  .glossary {
+    margin: 0 0 50px;
+  }
+}

assets/scss/pages/_page-glossary.scss

@@ -0,0 +1,11 @@
+@use '../abstracts' as *;
+
+.page-glossary {
+  .banner {
+    height: 1550px;
+  }
+
+  main {
+    background-image: none; // remove background-image to prevent ugliness when not much content on page
+  }
+}

assets/scss/style.scss

@@ -1,13 +1,3 @@
-// @use "~prismjs/themes/prism-tomorrow.css";
-// @use '~aos/dist/aos';
-
-// Prevents hiding elements for animations if js is not enabled:
-// html.no-js [data-aos] {
-//   opacity: 1;
-//   transform: none;
-//   pointer-events: unset;
-// }
-
 @use "base/_reset";
 @use "base/_font-face";
 
@@ -53,6 +43,8 @@
 @use "components/_preview";
 @use "components/_miniature-highlight";
 @use "components/_side-image";
+@use "components/_glossary";
+@use "components/_glossary-list";
 
 @use "generic/_a";
 @use "generic/_code";
@@ -61,8 +53,6 @@
 @use "generic/_p";
 @use "generic/_titles";
 @use "generic/_ul";
-// // @use "generic/_iframe";
-// // @use "generic/_kbd";
 
 @use "utilities/_screen-reader";
 
@@ -76,3 +66,4 @@
 @use "pages/_page-legals";
 @use "pages/_page-error";
 @use "pages/_page-signature";
+@use "pages/_page-glossary";

config/packages/twig.yaml

@@ -24,7 +24,7 @@ twig:
 
             trackers:
                 matomo: "%env(MATOMO_ID)%"
-            
+
             caseStudies:
                 enabled: true
 
@@ -45,6 +45,7 @@ twig:
             footer:
                 - { path: "case_studies", label: "Cas clients" }
                 - { path: "about", label: "À propos" }
+                - { path: "glossary", label: "Glossaire" }
                 - { path: "contact", label: "Contact" }
 
             footerServices:

content/member/_sample.yaml

@@ -20,10 +20,6 @@ linkedIn: ~
 email: ~
 avatar: content/images/member/avatars/path-to-avatar.jpg
 
-certifications:
-    - symfony
-    - opquast
-
 emojis:
     - 🎲
     - 🎮

content/member/frey.yaml

@@ -17,8 +17,6 @@ linkedIn: ~
 email: florian.rey@elao.com
 avatar: content/images/member/avatars/ffrey.jpg
 
-certifications: [ ]
-
 emojis:
     - 🌰
     - 👾

content/member/gfaivre.yaml

@@ -14,8 +14,6 @@ avatar: content/images/member/avatars/gfaivre.jpg
 
 phone: '007'
 
-certifications: [ ]
-
 emojis:
     - 🤾🏻‍♂️
     - 🎮

content/member/yheitz.yaml

@@ -13,6 +13,4 @@ linkedIn: ~
 email: yves.heitz@elao.com
 avatar: content/images/member/avatars/yheizt.png
 
-certifications: [ ]
-
 emojis: [ ]

content/term/aws.md

@@ -0,0 +1,8 @@
+---
+name: "AWS"
+logo: "build/images/services/aws.svg"
+externalLink: https://aws.amazon.com/fr/
+#metaDescription: TODO
+---
+
+Some **markdown** content

content/term/example.md

@@ -0,0 +1,17 @@
+---
+name: "Exemple"
+logo: "build/images/technos/exemple.svg"
+externalLink: http://example.org
+
+# False to prevent listing it on the glossary page.
+# Cans till be externalLinked from articles or case studies.
+listInGlossary: false
+
+# Array of slugs of related articles to show on the glossary term page.
+# If not provided (null), will search for related articles by their tags.
+articles: []
+
+metaDescription: Une description courte à utiliser dans les meta de la page
+---
+
+Some **markdown** content

content/term/ovh-cloud.md

@@ -0,0 +1,8 @@
+---
+name: "OVH Cloud"
+logo: "build/images/services/ovh-cloud.svg"
+externalLink: https://www.ovhcloud.com/fr/
+#metaDescription: TODO
+---
+
+Some **markdown** content

content/term/scaleway.md

@@ -0,0 +1,8 @@
+---
+name: "Scaleway"
+logo: "build/images/services/scaleway.svg"
+externalLink: https://www.scaleway.com/fr/
+#metaDescription: TODO
+---
+
+Some **markdown** content

src/Controller/GlossaryController.php

@@ -0,0 +1,62 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Controller;
+
+use App\Glossary\GlossaryBuilder;
+use App\Model\Article;
+use App\Model\CaseStudy;
+use App\Model\Glossary\Term;
+use Stenope\Bundle\ContentManagerInterface;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\Response;
+use Symfony\Component\Routing\Annotation\Route;
+
+#[Route('/glossaire')]
+class GlossaryController extends AbstractController
+{
+    private ContentManagerInterface $manager;
+
+    public function __construct(ContentManagerInterface $manager)
+    {
+        $this->manager = $manager;
+    }
+
+    #[Route('/', name: 'glossary')]
+    public function glossary(GlossaryBuilder $builder): Response
+    {
+        $terms = $this->manager->getContents(Term::class, 'name', ['listInGlossary' => true]);
+        $articles = $this->manager->getContents(Article::class, ['date' => false]);
+
+        return $this->render('glossary/index.html.twig', [
+            'glossary' => $builder->build($terms),
+            'articles' => \array_slice($articles, 0, 2),
+        ]);
+    }
+
+    #[Route('/{term}', name: 'glossary_term')]
+    public function show(Term $term): Response
+    {
+        $articlesFilter = null !== $term->articles
+            // Search for articles by their slug if provided
+            ? static fn ($article) => \in_array($article->slug, $term->articles, true)
+            // otherwise by their tags matching the term slug
+            : static fn (Article $article): bool => $article->hasTag($term->slug)
+        ;
+
+        $articles = $this->manager->getContents(Article::class, ['date' => false], $articlesFilter);
+
+        $caseStudies = $this->manager->getContents(
+            CaseStudy::class,
+            ['date' => false],
+            fn (CaseStudy $caseStudy): bool => $caseStudy->enabled && $caseStudy->hasTerm($term)
+        );
+
+        return $this->render('glossary/term.html.twig', [
+            'term' => $term,
+            'articles' => \array_slice($articles, 0, 3),
+            'caseStudies' => $caseStudies,
+        ])->setLastModified($term->lastModified);
+    }
+}

src/Glossary/GlossaryBuilder.php

@@ -9,8 +9,8 @@
 class GlossaryBuilder
 {
     /**
-     * @param array|Term[] $terms
-     * @param int<0, max>  $split
+     * @param Term[]      $terms
+     * @param int<0, max> $split
      */
     public function build(array $terms, int $split = 3): array
     {