Rubix Home page development

src/components/Theme/Fonts.jsx

@@ -0,0 +1,18 @@
+import { Global } from "@emotion/react";
+
+const Fonts = () => (
+  <Global
+    styles={`
+      @font-face {
+        font-family: 'Mona-Sans';
+        font-style: normal;
+        font-weight: normal;
+        font-display: swap;
+        src: url('../../assets/fonts/Mona-Sans-Regular.woff2') format('woff2');
+        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+      }
+      `}
+  />
+);
+
+export default Fonts;

src/components/Theme/Theme.jsx

@@ -0,0 +1,19 @@
+import { extendTheme } from "@chakra-ui/react";
+import "@fontsource/poppins";
+
+const theme = extendTheme({
+  fonts: {
+    body: `'Mona-Sans', sans-serif`,
+    p: `Poppins`,
+  },
+  styles: {
+    global: () => ({
+      body: {
+        // marginTop: { lg: "35px", md: "35px", base: "35px" },
+        boxSizing: "border-box",
+      },
+    }),
+  },
+});
+
+export default theme;