diff --git a/frontend/src/assets/css/style.css b/frontend/src/assets/css/style.css index 0565370..625b451 100644 --- a/frontend/src/assets/css/style.css +++ b/frontend/src/assets/css/style.css @@ -1,4 +1,92 @@ -@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Space+Grotesk:wght@500;700&display=swap'); +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 400; + src: url('../fonts/dm-sans-latin-ext-400-normal.woff2') format('woff2'); + unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; +} + +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 400; + src: url('../fonts/dm-sans-latin-400-normal.woff2') format('woff2'); + unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; +} + +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 500; + src: url('../fonts/dm-sans-latin-ext-500-normal.woff2') format('woff2'); + unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; +} + +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 500; + src: url('../fonts/dm-sans-latin-500-normal.woff2') format('woff2'); + unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; +} + +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 700; + src: url('../fonts/dm-sans-latin-ext-700-normal.woff2') format('woff2'); + unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; +} + +@font-face { + font-family: 'DM Sans'; + font-style: normal; + font-display: swap; + font-weight: 700; + src: url('../fonts/dm-sans-latin-700-normal.woff2') format('woff2'); + unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; +} + +@font-face { + font-family: 'Space Grotesk'; + font-style: normal; + font-display: swap; + font-weight: 500; + src: url('../fonts/space-grotesk-latin-ext-500-normal.woff2') format('woff2'); + unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; +} + +@font-face { + font-family: 'Space Grotesk'; + font-style: normal; + font-display: swap; + font-weight: 500; + src: url('../fonts/space-grotesk-latin-500-normal.woff2') format('woff2'); + unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; +} + +@font-face { + font-family: 'Space Grotesk'; + font-style: normal; + font-display: swap; + font-weight: 700; + src: url('../fonts/space-grotesk-latin-ext-700-normal.woff2') format('woff2'); + unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; +} + +@font-face { + font-family: 'Space Grotesk'; + font-style: normal; + font-display: swap; + font-weight: 700; + src: url('../fonts/space-grotesk-latin-700-normal.woff2') format('woff2'); + unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; +} :root { --color-white: #ffffff; @@ -31,6 +119,8 @@ --fs-xl: 1.875rem; --shadow-soft: 0 20px 40px -30px var(--color-shadow); --transition-fast: 160ms ease; + --font-body: 'DM Sans', 'Segoe UI', Tahoma, sans-serif; + --font-display: 'Space Grotesk', 'Segoe UI Semibold', 'Trebuchet MS', sans-serif; } :root[data-theme='dark'] { @@ -59,7 +149,7 @@ body, body { margin: 0; - font-family: 'DM Sans', 'Segoe UI', sans-serif; + font-family: var(--font-body); font-size: var(--fs-md); color: var(--color-text); background: @@ -109,7 +199,7 @@ select { .auth-brand h1 { margin: 0; - font-family: 'Space Grotesk', 'Segoe UI', sans-serif; + font-family: var(--font-display); font-size: clamp(2rem, 5vw, 2.75rem); letter-spacing: 0.04em; } @@ -180,7 +270,7 @@ select { .auth-card h2 { margin: var(--space-sm) 0 0; - font-family: 'Space Grotesk', 'Segoe UI', sans-serif; + font-family: var(--font-display); font-size: var(--fs-xl); } @@ -349,7 +439,7 @@ select { display: flex; align-items: center; gap: var(--space-sm); - font-family: 'Space Grotesk', 'Segoe UI', sans-serif; + font-family: var(--font-display); font-size: 1.1rem; } @@ -401,7 +491,7 @@ select { .app-topbar h1 { margin: 0; font-size: 1.25rem; - font-family: 'Space Grotesk', 'Segoe UI', sans-serif; + font-family: var(--font-display); } .app-topbar__user { diff --git a/frontend/src/assets/fonts/dm-sans-latin-400-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-400-normal.woff2 new file mode 100644 index 0000000..0b8bc55 Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-400-normal.woff2 differ diff --git a/frontend/src/assets/fonts/dm-sans-latin-500-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-500-normal.woff2 new file mode 100644 index 0000000..48e1612 Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-500-normal.woff2 differ diff --git a/frontend/src/assets/fonts/dm-sans-latin-700-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-700-normal.woff2 new file mode 100644 index 0000000..26edc56 Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-700-normal.woff2 differ diff --git a/frontend/src/assets/fonts/dm-sans-latin-ext-400-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-ext-400-normal.woff2 new file mode 100644 index 0000000..6d20410 Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-ext-400-normal.woff2 differ diff --git a/frontend/src/assets/fonts/dm-sans-latin-ext-500-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-ext-500-normal.woff2 new file mode 100644 index 0000000..ab2af3e Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-ext-500-normal.woff2 differ diff --git a/frontend/src/assets/fonts/dm-sans-latin-ext-700-normal.woff2 b/frontend/src/assets/fonts/dm-sans-latin-ext-700-normal.woff2 new file mode 100644 index 0000000..78d90f3 Binary files /dev/null and b/frontend/src/assets/fonts/dm-sans-latin-ext-700-normal.woff2 differ diff --git a/frontend/src/assets/fonts/space-grotesk-latin-500-normal.woff2 b/frontend/src/assets/fonts/space-grotesk-latin-500-normal.woff2 new file mode 100644 index 0000000..0db251f Binary files /dev/null and b/frontend/src/assets/fonts/space-grotesk-latin-500-normal.woff2 differ diff --git a/frontend/src/assets/fonts/space-grotesk-latin-700-normal.woff2 b/frontend/src/assets/fonts/space-grotesk-latin-700-normal.woff2 new file mode 100644 index 0000000..44604a0 Binary files /dev/null and b/frontend/src/assets/fonts/space-grotesk-latin-700-normal.woff2 differ diff --git a/frontend/src/assets/fonts/space-grotesk-latin-ext-500-normal.woff2 b/frontend/src/assets/fonts/space-grotesk-latin-ext-500-normal.woff2 new file mode 100644 index 0000000..0905781 Binary files /dev/null and b/frontend/src/assets/fonts/space-grotesk-latin-ext-500-normal.woff2 differ diff --git a/frontend/src/assets/fonts/space-grotesk-latin-ext-700-normal.woff2 b/frontend/src/assets/fonts/space-grotesk-latin-ext-700-normal.woff2 new file mode 100644 index 0000000..332a5ee Binary files /dev/null and b/frontend/src/assets/fonts/space-grotesk-latin-ext-700-normal.woff2 differ