diff --git a/public/fonts/Paperlogy-4Regular.woff2 b/public/fonts/Paperlogy-4Regular.woff2 new file mode 100644 index 0000000..daa35a7 Binary files /dev/null and b/public/fonts/Paperlogy-4Regular.woff2 differ diff --git a/public/fonts/Paperlogy-5Medium.woff2 b/public/fonts/Paperlogy-5Medium.woff2 new file mode 100644 index 0000000..60ff909 Binary files /dev/null and b/public/fonts/Paperlogy-5Medium.woff2 differ diff --git a/public/fonts/Paperlogy-7Bold.woff2 b/public/fonts/Paperlogy-7Bold.woff2 new file mode 100644 index 0000000..1673976 Binary files /dev/null and b/public/fonts/Paperlogy-7Bold.woff2 differ diff --git a/public/fonts/Paperlogy-8ExtraBold.woff2 b/public/fonts/Paperlogy-8ExtraBold.woff2 new file mode 100644 index 0000000..1e5890e Binary files /dev/null and b/public/fonts/Paperlogy-8ExtraBold.woff2 differ diff --git a/src/components/utils/GlobalStyle.tsx b/src/components/utils/GlobalStyle.tsx index eadecad..1eb72db 100644 --- a/src/components/utils/GlobalStyle.tsx +++ b/src/components/utils/GlobalStyle.tsx @@ -5,6 +5,27 @@ function GlobalStyle() { } const StyledGlobal = styled.style` + @font-face { + font-family: "Paperlogy"; + font-weight: 800; + src: url("/fonts/Paperlogy-8ExtraBold.woff2") format("woff"); + } + @font-face { + font-family: "Paperlogy"; + font-weight: 700; + src: url("/fonts/Paperlogy-7Bold.woff2") format("woff"); + } + @font-face { + font-family: "Paperlogy"; + font-weight: 500; + src: url("/fonts/Paperlogy-5Medium.woff2") format("woff"); + } + @font-face { + font-family: "Paperlogy"; + font-weight: 400; + src: url("/fonts/Paperlogy-4Regular.woff2") format("woff"); + } + html, body { height: 100%; @@ -20,6 +41,7 @@ const StyledGlobal = styled.style` } }) => mainText}; } + #root { display: flex; flex-direction: column; diff --git a/src/fonts.d.ts b/src/fonts.d.ts new file mode 100644 index 0000000..4f645ad --- /dev/null +++ b/src/fonts.d.ts @@ -0,0 +1,3 @@ +declare module "*.woff2"; +declare module "*.ttf"; +declare module "*.woff"; diff --git a/src/pages/_components/Intro/Intro.styles.ts b/src/pages/_components/Intro/Intro.styles.ts index 277c656..2e27c91 100644 --- a/src/pages/_components/Intro/Intro.styles.ts +++ b/src/pages/_components/Intro/Intro.styles.ts @@ -5,6 +5,7 @@ export const StyledIntro = styled.section` justify-content: space-between; align-items: center; gap: ${({ theme: { spacing } }) => `${spacing(4)}px`}; + font-family: "Paperlogy"; @media (max-width: ${({ theme: { breakpoints } }) => `${breakpoints.sm}px`}) { flex-direction: column; diff --git a/vite.config.mts b/vite.config.mts index 01d9378..e142fbb 100644 --- a/vite.config.mts +++ b/vite.config.mts @@ -11,6 +11,7 @@ export default defineConfig({ include: "**/*.svg" }) ], + assetsInclude: ["**/*.woff2"], resolve: { alias: [ {