highperfocused/noauth
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add local fonts

Browse Source
This commit is contained in:
Bekbolsun 2024-02-20 10:39:46 +06:00
parent 7379d75002
commit 47dc8e20fe
7 changed files with 56 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
package-lock.json generated
View File

@ -10,7 +10,6 @@
"dependencies": {
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@fontsource/inter": "^5.0.16",
"@hookform/resolvers": "^3.3.4",
"@mui/icons-material": "^5.14.19",
"@mui/material": "^5.14.20",
@ -2743,11 +2742,6 @@
"resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.6.tgz",
"integrity": "sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A=="
},
"node_modules/@fontsource/inter": {
"version": "5.0.16",
"resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-5.0.16.tgz",
"integrity": "sha512-qF0aH5UiZvCmneX5orJbVRoc2VTyLTV3X/7laMp03Qt28L+B9tFlZODOGUL64wDWc69YVdi1LeJB0cIgd51lvw=="
},
"node_modules/@hookform/resolvers": {
"version": "3.3.4",
"resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-3.3.4.tgz",
@ -20175,11 +20169,6 @@
"resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.6.tgz",
"integrity": "sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A=="
},
"@fontsource/inter": {
"version": "5.0.16",
"resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-5.0.16.tgz",
"integrity": "sha512-qF0aH5UiZvCmneX5orJbVRoc2VTyLTV3X/7laMp03Qt28L+B9tFlZODOGUL64wDWc69YVdi1LeJB0cIgd51lvw=="
},
"@hookform/resolvers": {
"version": "3.3.4",
"resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-3.3.4.tgz",

1
package.json
View File

@ -5,7 +5,6 @@
"dependencies": {
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@fontsource/inter": "^5.0.16",
"@hookform/resolvers": "^3.3.4",
"@mui/icons-material": "^5.14.19",
"@mui/material": "^5.14.20",

2
public/index.html
View File

@ -10,8 +10,6 @@
<link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="%PUBLIC_URL%/favicon-16x16.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.

30
src/assets/fonts/index.ts
View File

@ -1,30 +0,0 @@
import pathExtraLight from './Inter/Inter-ExtraLight.ttf'
import pathLight from './Inter/Inter-Light.ttf'
import pathRegular from './Inter/Inter-Regular.ttf'
import pathMedium from './Inter/Inter-Medium.ttf'
import pathSemiBold from './Inter/Inter-SemiBold.ttf'
import pathBold from './Inter/Inter-Bold.ttf'
const createFont = (name: string, style: string, weight: number, url: string) => {
return {
fontFamily: name,
fontStyle: style,
fontDisplay: 'swap',
fontWeight: `${weight}`,
src: `
local(${name}),
url(${url}) format('woff2')
`,
unicodeRange:
' U+0000-00FF, U+0100-017F, U+0180-024F, U+0250-02AF, U+02B0-02FF, U+0300-036F, U+0370-03FF, U+0400-04FF, U+1F00-1FFF',
}
}
const InterExtraLight = createFont('Inter', 'normal', 200, pathExtraLight)
const InterLight = createFont('Inter', 'normal', 300, pathLight)
const InterRegular = createFont('Inter', 'normal', 400, pathRegular)
const InterMedium = createFont('Inter', 'normal', 500, pathMedium)
const InterSemiBold = createFont('Inter', 'normal', 600, pathSemiBold)
const InterBold = createFont('Inter', 'normal', 700, pathBold)
export { InterExtraLight, InterLight, InterRegular, InterMedium, InterSemiBold, InterBold }

56
src/index.css
View File

@ -1,7 +1,63 @@
@font-face {
font-family: 'Inter';
src:
local('Inter ExtraLight'),
local('Inter-ExtraLight'),
url('./assets/fonts/Inter/Inter-ExtraLight.ttf') format('truetype');
font-weight: 200;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src:
local('Inter Light'),
local('Inter-Light'),
url('./assets/fonts/Inter/Inter-Light.ttf') format('truetype');
font-weight: 300;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src:
local('Inter Regular'),
local('Inter-Regular'),
url('./assets/fonts/Inter/Inter-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src:
local('Inter Medium'),
local('Inter-Medium'),
url('./assets/fonts/Inter/Inter-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src:
local('Inter SemiBold'),
local('Inter-SemiBold'),
url('./assets/fonts/Inter/Inter-SemiBold.ttf') format('truetype');
font-weight: 600;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src:
local('Inter Bold'),
local('Inter-Bold'),
url('./assets/fonts/Inter/Inter-Bold.ttf') format('truetype');
font-weight: 700;
font-display: swap;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
}
html,

16
src/modules/theme/theme.ts
View File

@ -1,13 +1,4 @@
import { InterExtraLight, InterLight, InterRegular, InterMedium, InterSemiBold, InterBold } from '@/assets/fonts'
import { createTheme, Theme } from '@mui/material'
// import '@fontsource/inter'
// import '@fontsource/inter/300.css'
// import '@fontsource/inter' // Defaults to weight 400
// import '@fontsource/inter/500.css'
// import '@fontsource/inter/600.css'
// import '@fontsource/inter/700.css'
// import '@fontsource/inter/800.css'
// import '@fontsource/inter/900.css'
declare module '@mui/material/styles' {
interface Palette {
@ -26,13 +17,6 @@ const commonTheme: Theme = createTheme({
fontFamily: ['Inter', 'sans-serif'].join(','),
},
components: {
MuiCssBaseline: {
styleOverrides: {
'@global': {
'@font-face': [InterExtraLight, InterLight, InterRegular, InterMedium, InterSemiBold, InterBold],
},
},
},
MuiButton: {
styleOverrides: {
root: {

1
src/types/index.d.ts vendored
View File

@ -1 +0,0 @@
declare module '*.ttf'