feat: Replace ProximaNova with Figtree font family (#2844)

* feat: switch primary font from ProximaNova to Figtree

* feat: remove redundant change in package.json

Author: mateusz-zaboj

.storybook/manager-head.html

@@ -1,29 +1,29 @@
 <style>
   @font-face {
-    font-family: 'ProximaNova';
-    src: url(fonts/ProximaNova-Regular.woff2) format('woff2'),
-      url(fonts/ProximaNova-Regular.woff) format('woff');
+    font-family: 'Figtree';
+    src: url(fonts/Figtree-Regular.woff2) format('woff2'),
+      url(fonts/Figtree-Regular.woff) format('woff');
     font-weight: 400;
     font-style: normal;
     font-display: swap;
   }
 
   @font-face {
-    font-family: 'ProximaNova';
-    src: url(fonts/ProximaNova-Bold.woff2) format('woff2'),
-      url(fonts/ProximaNova-Bold.woff) format('woff');
+    font-family: 'Figtree';
+    src: url(fonts/Figtree-Bold.woff2) format('woff2'),
+      url(fonts/Figtree-Bold.woff) format('woff');
     font-weight: 700;
     font-style: normal;
     font-display: swap;
   }
 
   @font-face {
-    font-family: 'ProximaNova';
-    src: url(fonts/ProximaNova-Black.woff2) format('woff2'),
-      url(fonts/ProximaNova-Black.woff) format('woff');
+    font-family: 'Figtree';
+    src: url(fonts/Figtree-Black.woff2) format('woff2'),
+      url(fonts/Figtree-Black.woff) format('woff');
     font-weight: 900;
     font-style: normal;
     font-display: swap;
   }
 </style>
-<link rel="stylesheet" href="manager.css" />
+<link rel="stylesheet" href="manager.css" />

.storybook/public/fonts/Figtree-Black.woff

@@ -7,7 +7,7 @@ export default create({
   colorSecondary: '#000000',
 
   // Typography
-  fontBase: '"ProximaNova", "Helvetica", "Arial", sans-serif',
+  fontBase: '"Figtree", "Helvetica", "Arial", sans-serif',
   fontCode: 'monospace',
   fontSize: '16px',
 

.storybook/public/fonts/Figtree-Black.woff2

@@ -122,12 +122,6 @@ $largeButtonSize: componentSize(l);
     .sg-button__hover-overlay {
       border-radius: var(--border-radius-m);
     }
-
-    // Proxima is broken
-    // Added to align text in the center for this font-size
-    .sg-button__text {
-      top: 1px;
-    }
   }
 
   &--reversed-order {

.storybook/public/fonts/Figtree-Bold.woff

@@ -30,9 +30,7 @@ export const getValues = function (object, addUndefined = true) {
 
 <PageHeader type="foundation">Typography</PageHeader>
 
-The Brainly brand typeface is Proxima Nova, a geometric sans serif that works equally well with large headlines and functional copy. Use this typeface according to the following rules for consistency across the brand.
-
-Proxima Nova combines modern proportions with a geometric appearance and has become one of the most popular web fonts, in use on thousands of websites around the world.
+The Brainly brand typeface is Figtree, a geometric sans serif that works equally well with large headlines and functional copy. Use this typeface according to the following rules for consistency across the brand.
 
 Our typography system is a balanced hierarchy of text styles used throughout Brainly.
 This helps users quickly find information by emphasizing important parts and enhancing legibility overall.
@@ -87,7 +85,7 @@ export const TextBitExamples = extraBold => {
   return sizesVariants;
 };
 
-**Font**: Proxima Nova
+**Font**: Figtree
 **Weight**: 900
 
 <Typeset>{TextBitExamples(true)}</Typeset>
@@ -165,12 +163,12 @@ export const HeadlineExamples = extraBold => {
   return sizeVariant;
 };
 
-**Font**: Proxima Nova
+**Font**: Figtree
 **Weight**: 900
 
 <Typeset>{HeadlineExamples(true)}</Typeset>
 
-**Font**: Proxima Nova
+**Font**: Figtree
 **Weight**: 700
 
 <Typeset>{HeadlineExamples(false)}</Typeset>
@@ -316,12 +314,12 @@ export const TextExamples = weight => {
   return sizeVariant;
 };
 
-**Font**: Proxima Nova
+**Font**: Figtree
 **Weight**: 700
 
 <Typeset>{TextExamples(TEXT_WEIGHT.BOLD)}</Typeset>
 
-**Font**: Proxima Nova
+**Font**: Figtree
 **Weight**: 400
 
 <Typeset>{TextExamples(TEXT_WEIGHT.NORMAL)}</Typeset>