replace font files with woff2 for better performance (#6338)

Author: bilalabbad

frontend/app/src/app/styles/index.css

@@ -6,8 +6,10 @@
 @config '../../../tailwind.config.js';
 
 @font-face {
-  font-family: "Inter";
-  src: url(/src/assets/fonts/InterVariable.ttf);
+  font-family: InterVariable;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/src/assets/fonts/InterVariable.woff2) format("woff2");
 }
 
 @layer base {
@@ -19,7 +21,7 @@
 
 body {
   margin: 0;
-  font-family: "Inter", sans-serif;
+  font-family: InterVariable, sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }