feat(API-1944): Add button component

Author: LevFlavien

components/components.css

@@ -318,3 +318,37 @@ button {
             url("../dist/fonts/lato-bold-italic.woff2") format("woff2"),
             url("../dist/fonts/lato-bold-italic.woff") format("woff");
 }
+
+.next-steps-button {
+    width: 261px;
+    height: 94px;
+    padding-top: 5px; /* Fix font not centered */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 10px;
+
+    font-weight: 600;
+    font-size: 24px;
+    line-height: 29px;
+    text-transform: uppercase;
+
+    background-color: #414D97;
+    color: #F1F4F9;
+
+    box-shadow: 0px 0px 6px rgba(37, 38, 52, 0.5);
+    border: none;
+    border-radius: 57px;
+}
+.next-steps-button:hover {
+    background-color: #2D366D;
+}
+
+.next-steps-button-number {
+    padding-top: 2px;  /* Fix inability to align-item baseline */
+    font-size: 63px;
+}
+
+.next-steps-button-text {
+    text-align: left;
+}

components/components.html

@@ -89,6 +89,16 @@
 
 <hr>
 
+<button 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>
+
+<hr>
+
 <iframe src="./tile.html" onload="this.before((this.contentDocument.body||this.contentDocument).children[0]);this.remove()"></iframe>
 
 </body>