From d4a3f35dbbca940cb20b191c1a58b0479da90572 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A1n?= <41774881+xentenza@users.noreply.github.com>
Date: Wed, 24 Apr 2024 15:07:49 +0200
Subject: [PATCH 1/3] Highlighted key number

- new Key number variant
- two versions: with or without link
---
 .../key-number/key-number-hn-link.twig        | 23 +++++++++++++++++++
 .../molecules/key-number/key-number-hn.twig   | 23 +++++++++++++++++++
 .../molecules/key-number/key-number.yml       |  4 ++++
 .../key-number-group/key-number-group-hn.twig |  6 +++++
 .../key-number-group/key-number-group.yml     |  3 +++
 5 files changed, 59 insertions(+)
 create mode 100644 assets/components/molecules/key-number/key-number-hn-link.twig
 create mode 100644 assets/components/molecules/key-number/key-number-hn.twig
 create mode 100644 assets/components/organisms/key-number-group/key-number-group-hn.twig

diff --git a/assets/components/molecules/key-number/key-number-hn-link.twig b/assets/components/molecules/key-number/key-number-hn-link.twig
new file mode 100644
index 000000000..0822463cc
--- /dev/null
+++ b/assets/components/molecules/key-number/key-number-hn-link.twig
@@ -0,0 +1,23 @@
+{% set icon = icon|default("https://via.placeholder.com/") %}
+<a class="card link-trapeze-horizontal" href="#">
+    <div class="card border-0 bg-white m-0 h-100">
+        <div class="card-header border-0">
+            <div class="row">
+                <div class="col-md-6">
+                    <p class="h4">près de 18'000</p>
+                </div>
+                <div class="col-md-6 text-right">
+                  <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages">
+                </div>
+            </div>
+        </div>
+        <div class="card-body pt-0">
+            <div class="row">
+                <div class="col-md-12">
+                    <hr />
+                    <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
+                </div>
+            </div>
+        </div>
+    </div>
+</a>
diff --git a/assets/components/molecules/key-number/key-number-hn.twig b/assets/components/molecules/key-number/key-number-hn.twig
new file mode 100644
index 000000000..cd077da90
--- /dev/null
+++ b/assets/components/molecules/key-number/key-number-hn.twig
@@ -0,0 +1,23 @@
+{% set icon = icon|default("https://via.placeholder.com/") %}
+<div class="card">
+    <div class="card border-0 bg-white m-0 h-100">
+        <div class="card-header border-0">
+            <div class="row">
+                <div class="col-md-6">
+                    <p class="h4">près de 18'000</p>
+                </div>
+                <div class="col-md-6 text-right">
+                  <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages">
+                </div>
+            </div>
+        </div>
+        <div class="card-body pt-0">
+            <div class="row">
+                <div class="col-md-12">
+                    <hr />
+                    <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/assets/components/molecules/key-number/key-number.yml b/assets/components/molecules/key-number/key-number.yml
index e7f6b018e..854c3e6cb 100644
--- a/assets/components/molecules/key-number/key-number.yml
+++ b/assets/components/molecules/key-number/key-number.yml
@@ -5,3 +5,7 @@ variants:
   - name: large
     title: Large
     wrapper: 'bg-gray-100'
+  - name: hn
+    title: Highlighted number
+  - name: hn-link
+    title: Highlighted number with link
\ No newline at end of file
diff --git a/assets/components/organisms/key-number-group/key-number-group-hn.twig b/assets/components/organisms/key-number-group/key-number-group-hn.twig
new file mode 100644
index 000000000..a8b30fbfb
--- /dev/null
+++ b/assets/components/organisms/key-number-group/key-number-group-hn.twig
@@ -0,0 +1,6 @@
+<div class="container">
+  <div class="card-deck">
+    {% include '@molecules/key-number/key-number-hn-link.twig' %}
+    {% include '@molecules/key-number/key-number-hn-link.twig' %}
+    {% include '@molecules/key-number/key-number-hn.twig' %}
+</div>
diff --git a/assets/components/organisms/key-number-group/key-number-group.yml b/assets/components/organisms/key-number-group/key-number-group.yml
index 81d3e874c..9fe573a45 100644
--- a/assets/components/organisms/key-number-group/key-number-group.yml
+++ b/assets/components/organisms/key-number-group/key-number-group.yml
@@ -1,3 +1,6 @@
 title: Key number group
 name: key-number-group
 wrapper: bg-gray-100
+variants:
+  - name: hn
+    title: Highlighted number

From 3dd6b73b56bb8a087d37cb32eb6612550b7631fc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A1n?= <41774881+xentenza@users.noreply.github.com>
Date: Fri, 3 May 2024 09:52:17 +0200
Subject: [PATCH 2/3] corrections indentation + div manquant

- correction de l'indentation dans Molecules > Key Number

- <div> manquant dans Organisms > Key Number Group
---
 .../key-number/key-number-hn-link.twig        | 36 +++++++++----------
 .../molecules/key-number/key-number-hn.twig   | 34 +++++++++---------
 .../key-number-group/key-number-group-hn.twig |  1 +
 3 files changed, 36 insertions(+), 35 deletions(-)

diff --git a/assets/components/molecules/key-number/key-number-hn-link.twig b/assets/components/molecules/key-number/key-number-hn-link.twig
index 0822463cc..863138759 100644
--- a/assets/components/molecules/key-number/key-number-hn-link.twig
+++ b/assets/components/molecules/key-number/key-number-hn-link.twig
@@ -1,23 +1,23 @@
 {% set icon = icon|default("https://via.placeholder.com/") %}
 <a class="card link-trapeze-horizontal" href="#">
-    <div class="card border-0 bg-white m-0 h-100">
-        <div class="card-header border-0">
-            <div class="row">
-                <div class="col-md-6">
-                    <p class="h4">près de 18'000</p>
-                </div>
-                <div class="col-md-6 text-right">
-                  <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages">
-                </div>
-            </div>
+  <div class="card border-0 bg-white m-0 h-100">
+    <div class="card-header border-0">
+      <div class="row">
+        <div class="col-md-6">
+          <p class="h4">près de 18'000</p>
         </div>
-        <div class="card-body pt-0">
-            <div class="row">
-                <div class="col-md-12">
-                    <hr />
-                    <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
-                </div>
-            </div>
+        <div class="col-md-6 text-right">
+          <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages" />
         </div>
+      </div>
     </div>
-</a>
+    <div class="card-body pt-0">
+      <div class="row">
+        <div class="col-md-12">
+          <hr />
+          <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</a>
\ No newline at end of file
diff --git a/assets/components/molecules/key-number/key-number-hn.twig b/assets/components/molecules/key-number/key-number-hn.twig
index cd077da90..6d23893ed 100644
--- a/assets/components/molecules/key-number/key-number-hn.twig
+++ b/assets/components/molecules/key-number/key-number-hn.twig
@@ -1,23 +1,23 @@
 {% set icon = icon|default("https://via.placeholder.com/") %}
 <div class="card">
-    <div class="card border-0 bg-white m-0 h-100">
-        <div class="card-header border-0">
-            <div class="row">
-                <div class="col-md-6">
-                    <p class="h4">près de 18'000</p>
-                </div>
-                <div class="col-md-6 text-right">
-                  <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages">
-                </div>
-            </div>
+  <div class="card border-0 bg-white m-0 h-100">
+    <div class="card-header border-0">
+      <div class="row">
+        <div class="col-md-6">
+          <p class="h4">près de 18'000</p>
         </div>
-        <div class="card-body pt-0">
-            <div class="row">
-                <div class="col-md-12">
-                    <hr />
-                    <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
-                </div>
-            </div>
+        <div class="col-md-6 text-right">
+          <img src="images/styleguide/key-numbers/students.png" class="d-block m-auto" alt="Pictogramme avec deux personnages" />
         </div>
+      </div>
     </div>
+    <div class="card-body pt-0">
+      <div class="row">
+        <div class="col-md-12">
+          <hr />
+          <p>étudiant·es, collaborateurs et collaboratrices font de l'EPFL une petite ville trépidante et dynamique</p>
+        </div>
+      </div>
+    </div>
+  </div>
 </div>
\ No newline at end of file
diff --git a/assets/components/organisms/key-number-group/key-number-group-hn.twig b/assets/components/organisms/key-number-group/key-number-group-hn.twig
index a8b30fbfb..391445fc0 100644
--- a/assets/components/organisms/key-number-group/key-number-group-hn.twig
+++ b/assets/components/organisms/key-number-group/key-number-group-hn.twig
@@ -3,4 +3,5 @@
     {% include '@molecules/key-number/key-number-hn-link.twig' %}
     {% include '@molecules/key-number/key-number-hn-link.twig' %}
     {% include '@molecules/key-number/key-number-hn.twig' %}
+  </div>
 </div>

From 0f1cd1638420760de46925709d150b7f9c22df46 Mon Sep 17 00:00:00 2001
From: William Belle <william.belle@gmail.com>
Date: Mon, 6 May 2024 12:53:48 +0200
Subject: [PATCH 3/3] Adjust

---
 assets/components/molecules/key-number/key-number-hn-link.twig | 2 +-
 assets/components/molecules/key-number/key-number-hn.twig      | 2 +-
 assets/components/molecules/key-number/key-number.yml          | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/assets/components/molecules/key-number/key-number-hn-link.twig b/assets/components/molecules/key-number/key-number-hn-link.twig
index 863138759..fb78b3271 100644
--- a/assets/components/molecules/key-number/key-number-hn-link.twig
+++ b/assets/components/molecules/key-number/key-number-hn-link.twig
@@ -20,4 +20,4 @@
       </div>
     </div>
   </div>
-</a>
\ No newline at end of file
+</a>
diff --git a/assets/components/molecules/key-number/key-number-hn.twig b/assets/components/molecules/key-number/key-number-hn.twig
index 6d23893ed..ad8a82a14 100644
--- a/assets/components/molecules/key-number/key-number-hn.twig
+++ b/assets/components/molecules/key-number/key-number-hn.twig
@@ -20,4 +20,4 @@
       </div>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/assets/components/molecules/key-number/key-number.yml b/assets/components/molecules/key-number/key-number.yml
index 854c3e6cb..00431fb73 100644
--- a/assets/components/molecules/key-number/key-number.yml
+++ b/assets/components/molecules/key-number/key-number.yml
@@ -8,4 +8,4 @@ variants:
   - name: hn
     title: Highlighted number
   - name: hn-link
-    title: Highlighted number with link
\ No newline at end of file
+    title: Highlighted number with link