Merge pull request #501 from 1024pix/pf-589-display-profilv2-explanat…

…ion-link [FEATURE] Afficher un lien temporaire d'explications pour Profil v2(PF-589).
1024pix · May 13, 2019 · 7eaccd0 · 7eaccd0
2 parents 56607ef + 8547a27
commit 7eaccd0
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 19 deletions.
diff --git a/mon-pix/app/styles/components/_rounded-panel.scss b/mon-pix/app/styles/components/_rounded-panel.scss
@@ -46,7 +46,7 @@
   flex-direction: column;
   justify-content: space-between;
   width: 100%;
-  padding-bottom: 32px;
+  padding-bottom: 18px;
   border-bottom: 1px dashed $silver-grey;
 
   @include device-is('tablet') {
@@ -106,23 +106,10 @@
 
 // Text styles
 .rounded-panel-title {
-  font-weight: $font-light;
-  font-family: $font-open-sans;
-  color: $nero;
-  font-size: 1.8rem;
-  letter-spacing: 0.03rem;
-  line-height: 1.8rem;
-  text-transform: uppercase;
-
-  @include device-is('tablet') {
-    font-size: 1.3rem;
-  }
-}
-
-.rounded-panel-subtitle {
   font-weight: $font-light;
   font-family: $font-open-sans;
   color: $black;
   font-size: 3.2rem;
   line-height: 4.5rem;
+  margin-bottom: 26px;
 }
diff --git a/mon-pix/app/styles/pages/_profilv2.scss b/mon-pix/app/styles/pages/_profilv2.scss
@@ -11,8 +11,19 @@
     padding-right: 30px;
   }
 
+}
+
+.profilv2-panel {
   &__link-to-compte {
     display: flex;
     justify-content: flex-end;
   }
 }
+
+.profilv2-panel-header-information {
+  font-weight: $font-light;
+  font-family: $font-roboto;
+  color: $black;
+  font-size: 1.8rem;
+  line-height: 2.1rem;
+}
diff --git a/mon-pix/app/templates/profilv2.hbs b/mon-pix/app/templates/profilv2.hbs
@@ -8,11 +8,16 @@
     <div class="rounded-panel-header-with-components">
       <div class="rounded-panel-header__left-wrapper">
         <h1 class="rounded-panel-header-text__content rounded-panel-title">
-          votre profil
+          Vous avez 16 compétences à tester.<br>On se concentre et c'est partix !
         </h1>
 
-        <h2 class="rounded-panel-header-text__content rounded-panel-subtitle">
-          Vous avez 16 compétences à tester.<br>On se concentre et c'est partix !
+        <h2 class="rounded-panel-header-text__content profilv2-panel-header-information">
+          Le profil Pix évolue.
+          <a class="link"
+             href="https://pix.fr/actualites/votre-profil-evolue"
+             target="Actualité Pix">
+            Découvrez ce qui change.
+          </a>
         </h2>
       </div>
 
@@ -21,7 +26,7 @@
       </div>
     </div>
 
-    <div class="profilv2__link-to-compte">
+    <div class="profilv2-panel__link-to-compte">
       {{#link-to "compte" class="link link--grey rounded-panel__link"}}Accès à l'ancien profil{{/link-to}}
     </div>
 

diff --git a/mon-pix/tests/acceptance/profilv2-test.js b/mon-pix/tests/acceptance/profilv2-test.js
@@ -46,6 +46,18 @@ describe('Acceptance | Profil v2 | Afficher profil v2', function() {
       expect(currentURL()).to.equal('/compte');
     });
 
+    it('should contains references to pix.fr/actualites/votre-profil-evolue', async function() {
+      // when
+      await visit('/profilv2');
+
+      // then
+      expect(document.querySelector('.profilv2-panel-header-information > .link'))
+        .to.have.attr('href', 'https://pix.fr/actualites/votre-profil-evolue');
+
+      expect(document.querySelector('.profilv2-panel-header-information > .link'))
+        .to.have.attr('target', 'Actualité Pix');
+    });
+
     it('should display pixscore', async function() {
       await visit('/profilv2');