fix(API-1944): Fix next step button centered text : Remove button html element

Author: LevFlavien

components/components.css

@@ -332,7 +332,7 @@ button {
 
 .next-steps-button {
     width: 261px;
-    height: 94px;
+    height: 89px;
     padding-top: 5px; /* Fix font not centered */
     display: flex;
     justify-content: center;
@@ -353,34 +353,23 @@ button {
     border: none;
     border-radius: 57px;
 }
-.next-steps-button-link {
-    cursor: default;
-}
-.next-steps-button-link:hover {
-    text-decoration: none;
-}
 .next-steps-button:hover {
     background-color: #2D366D;
+    text-decoration: none;
+    color: #F1F4F9;
 }
 
 .next-steps-button-number {
     padding-top: 2px;  /* Fix inability to align-item baseline */
     font-size: 63px;
 }
-.next-steps-button-smaller .next-steps-button-number {
-    padding-top: 4px;  /* Fix inability to align-item baseline */
-}
-
 .next-steps-button-text {
     text-align: left;
 }
 
 .next-steps-button-smaller {
     width: 177px;
-    height: 68px;
-}
-
-.next-steps-button-smaller {
+    height: 65px;
     padding-top: 3px
 }
 

components/components.html

@@ -92,26 +92,24 @@
 <div class="block-next-steps block-next-steps-main">
     <div class="block-next-steps-title">Next Step</div>
     <div class="block-next-steps-text">Now that you’ve gotten your App token, continue the journey with Step 2!</div>
-    <a href="/" class="next-steps-button-link">
-        <button class="next-steps-button next-steps-button-smaller">
-            <div class="next-steps-button-number">2</div>
-            <div class="next-steps-button-text">
-                Develop<br>
-                your App
-            </div>
-        </button>
+    <a href="/" class="next-steps-button next-steps-button-smaller">
+        <div class="next-steps-button-number">2</div>
+        <div class="next-steps-button-text">
+            Develop<br>
+            your App
+        </div>
     </a>
 </div>
 
 <hr>
 
-<button class="next-steps-button">
+<a href="/" class="next-steps-button">
     <div class="next-steps-button-number">1</div>
     <div class="next-steps-button-text">
         Get your<br>
         App token
     </div>
-</button>
+</a>
 
 <hr>
 

content/tutorials/guides/how-to-get-your-app-token.md

@@ -184,13 +184,11 @@ You can use this token to call the Akeneo PIM REST API.
 <div class="block-next-steps block-next-steps-main">
     <div class="block-next-steps-title">Next Step</div>
     <div class="block-next-steps-text">Now that you’ve gotten your App token, continue the journey with Step 2!</div>
-    <a href="/tutorials/how-to-retrieve-pim-structure.html" class="next-steps-button-link">
-       <button class="next-steps-button next-steps-button-smaller">
-           <div class="next-steps-button-number">2</div>
-           <div class="next-steps-button-text">
-               Develop<br>
-               your App
-           </div>
-       </button>
+    <a href="/tutorials/how-to-retrieve-pim-structure.html" class="next-steps-button next-steps-button-smaller">
+        <div class="next-steps-button-number">2</div>
+        <div class="next-steps-button-text">
+            Develop<br>
+            your App
+        </div>
    </a>
 </div>

styles/guided-tutorial.less

@@ -108,7 +108,7 @@
 
     .next-steps-button {
         width: 261px;
-        height: 94px;
+        height: 89px;
         padding-top: 5px; /* Fix font not centered */
         display: flex;
         justify-content: center;
@@ -129,31 +129,24 @@
         border: none;
         border-radius: 57px;
     }
-    .next-steps-button-link {
-        cursor: default;
-    }
-    .next-steps-button-link:hover {
-        text-decoration: none;
-    }
     .next-steps-button:hover {
         background-color: #2D366D;
+        text-decoration: none;
+        color: #F1F4F9;
     }
 
     .next-steps-button-number {
         padding-top: 2px;  /* Fix inability to align-item baseline */
         font-size: 63px;
     }
-    .next-steps-button-smaller .next-steps-button-number {
-        padding-top: 4px;  /* Fix inability to align-item baseline */
-    }
-
     .next-steps-button-text {
         text-align: left;
     }
 
     .next-steps-button-smaller {
         width: 177px;
-        height: 68px;
+        height: 65px;
+        padding-top: 3px
     }
 
     .next-steps-button-smaller {