From 21c2d5d0cfc4aecf891b55d4fbb29cc861c6ffa3 Mon Sep 17 00:00:00 2001
From: dianeCdrPix <diane.cordier@pix.fr>
Date: Fri, 13 Dec 2024 14:58:50 +0100
Subject: [PATCH] feat(mon-pix): replace FaIcon in details of Module with
 PixIcon
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Clément Latzarus <clement.latzarus@pix.fr>
Co-authored-by: Eric Lim <eric.lim@pix.fr>
---
 mon-pix/app/components/module/_details.scss |  5 +++--
 mon-pix/app/components/module/details.gjs   | 18 +++++++++++-------
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/mon-pix/app/components/module/_details.scss b/mon-pix/app/components/module/_details.scss
index 00a65622816..d163bf27775 100644
--- a/mon-pix/app/components/module/_details.scss
+++ b/mon-pix/app/components/module/_details.scss
@@ -85,15 +85,16 @@
   &__title {
     @extend %pix-body-xs;
 
+    display: flex;
+    align-items: center;
     color: var(--pix-neutral-800);
-    text-align: center;
     text-transform: uppercase;
   }
 }
 
 .module-details-infos-indications-category-title {
   &__icon {
-    margin-right: var(--pix-spacing-2x);
+    margin-right: var(--pix-spacing-1x);
   }
 }
 
diff --git a/mon-pix/app/components/module/details.gjs b/mon-pix/app/components/module/details.gjs
index eaff77be359..a686413756c 100644
--- a/mon-pix/app/components/module/details.gjs
+++ b/mon-pix/app/components/module/details.gjs
@@ -1,8 +1,8 @@
 import PixButton from '@1024pix/pix-ui/components/pix-button';
+import PixIcon from '@1024pix/pix-ui/components/pix-icon';
 import PixModal from '@1024pix/pix-ui/components/pix-modal';
 import { action } from '@ember/object';
 import { service } from '@ember/service';
-import FaIcon from '@fortawesome/ember-fontawesome/components/fa-icon';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { t } from 'ember-intl';
@@ -135,17 +135,21 @@ export default class ModulixDetails extends Component {
         <div class="module-details-infos__indications">
           <div class="module-details-infos-indications__category">
             <div class="module-details-infos-indications-category__title">
-              <FaIcon @icon="stopwatch" class="module-details-infos-indications-category-title__icon" />{{t
-                "pages.modulix.details.duration"
-              }}
+              <PixIcon
+                @name="stopwatch"
+                class="module-details-infos-indications-category-title__icon"
+                @ariaHidden="true"
+              />{{t "pages.modulix.details.duration"}}
             </div>
             <p>{{t "pages.modulix.details.durationValue" htmlSafe=true duration=@module.details.duration}}</p>
           </div>
           <div class="module-details-infos-indications__category">
             <div class="module-details-infos-indications-category__title">
-              <FaIcon @icon="signal" class="module-details-infos-indications-category-title__icon" />{{t
-                "pages.modulix.details.level"
-              }}
+              <PixIcon
+                @name="barsUp"
+                class="module-details-infos-indications-category-title__icon"
+                @ariaHidden="true"
+              />{{t "pages.modulix.details.level"}}
             </div>
             <p>{{@module.details.level}}</p>
           </div>