@drivy/cobalt/styles/fonts/README.md

Opinionated design system for Drivy's projects.

Our official branding font is a licensed paid web font, meaning that we can't distribute it through our NPM package (which uses the MIT license). So you won't find it in our design system, instead we put an [open font licensed](https://en.wikipedia.org/wiki/SIL_Open_Font_License) one as a placeholder (see `placeholder-BrandFont.woff` [source](https://fonts.google.com/specimen/Poppins)). In order to get that brand font work, you have to use an alias in your builder (like `resolve.alias` for `Webpack`). You can use the placeholder font we provide here or a custom font on your side.

Here how we did it using our builder `Webpack`:

```javascript
{
  resolve: {
    alias: {
      // alias the path used in the url() in the core/fonts.scss file
      ["fonts/BrandFont.woff"]: path.resolve(
        __dirname,
        "our/path/to/fonts/OurOfficialBrandFont.woff"
      )
    }
  }
}
```

You can use another builder as long as it provides a way to alias an asset when importing it, then pass your custom font or the placeholder one `placeholder-BrandFont.woff` from this folder.