Шрифт Redwood Mantine не загружается

Я использую Mantine с Redwood.JS, и мой шрифт не загружается.

Вот моя домашняя страница:

      import { Link, routes } from '@redwoodjs/router'
import { MetaTags } from '@redwoodjs/web'

import { MantineProvider } from '@mantine/core'

import CustomFonts from 'src/components/CustomFonts/CustomFonts.js'

const HomePage = () => {
  return (
    <MantineProvider
      theme={{
        fontFamily: 'LiberationSans, sans-serif',
      }}
    >
      <CustomFonts />
      <MetaTags title="Home" description="Home page" />

      <h1>HomePage</h1>
      <p>
        Find me in <code>./web/src/pages/HomePage/HomePage.js</code>
      </p>
      <p>
        My default route is named <code>home</code>, link to me with `
        <Link to={routes.home()}>Home</Link>`
      </p>
    </MantineProvider>
  )
}

export default HomePage

Вот мой компонент CustomFonts:

      import { Global } from '@mantine/core'

import regular from './LiberationSans-Regular.ttf'

const CustomFonts = () => {
  return (
    <Global
      styles={[
        {
          '@font-face': {
            fontFamily: 'LiberationSans',
            src: `url('${regular}') format("ttf")`,
            fontWeight: 700,
            fontStyle: 'normal',
          },
        },
      ]}
    />
  )
}

export default CustomFonts

Я стараюсь следовать рекомендациям документации здесь: https://mantine.dev/theming/typography/

0 ответов

Другие вопросы по тегам