chore: add typographies and tweak screen sizes

resources/src/css/_typography.scss

@@ -17,3 +17,8 @@
   font-family: "roboto-regular";
   src: url("../fonts/roboto/Roboto-Regular.ttf");
 }
+
+@font-face {
+  font-family: "roboto-medium";
+  src: url("../fonts/roboto/Roboto-Medium.ttf");
+}

tailwind.config.js

@@ -5,16 +5,17 @@ module.exports = {
   theme: {
     extend: {
       fontFamily: {
-        nunito: ['nunito-light', 'sans-serif'],
-        roboto: ['roboto-light', 'sans-serif'],
+        "nunito": ["nunito-light", "sans-serif"],
+        "nunito-semibold": ["nunito-semibold", "sans-serif"],
+        "roboto": ["roboto-light", "sans-serif"],
+        "roboto-medium": ["roboto-medium", "sans-serif"],
       },
       screens: {
-        'xs': '480px',
-        'ml': '930px',
+        "xs": "480px",
       },
     },
   },
   plugins: [
-    require('@tailwindcss/forms')
+    require("@tailwindcss/forms")
   ],
 }