Better font system

src/index.js

@@ -5,6 +5,9 @@ import App from './App';
 import './scss/index.scss';
 import 'react-toastify/dist/ReactToastify.css'; // the toast css is based on default so we need to import it
 
+import 'fontsource-lexend-deca/latin-400-normal.css';
+import 'fontsource-roboto/cyrillic-400-normal.css';
+
 ReactDOM.render(
     <App/>,
     document.getElementById('root')

src/scss/index.scss

@@ -29,16 +29,6 @@ body {
     outline: none;
 }
 
-@font-face {
-    font-family: 'Lexend Deca';
-    src: url('/./fonts/LexendDeca-Regular.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    src: url('/./fonts/Roboto-Cyrillic.woff2') format('woff2');
-}
-
 #center {
     margin-left: 2vw;
     margin-right: 2vw;