Frontity update: 4 November 2019

We added support for fonts in webpack (woff, woff2, ttf and eot).
The way to use them is as follows:

import { css, Global } from "frontity";

// Import your own font file.
import aclonica from "./fonts/aclonica-v10-latin-regular.woff";

const styleWithFont = css`
  @font-face {
    font-family: "Aclonica";
    font-style: normal;
    font-weight: 400;

    /* Use it inside the CSS */
    src: url(${aclonica});
  }
`;

const Theme = () => (
  ...
  <Global styles={styleWithFont} />
  ...
);

Also, several fixes are included in this new release, most related to the emotion library:

  • The name of the styled component now appears in the CSS class of those components. This makes much easier to identify styled components in the HTML code.

  • Source maps for styled components are fixed too so now they can be properly inspected and debugged using browser dev tools.

:bulb: To keep Frontity and its packages updated, you can follow this guide of our documentation.


Features

  • webpack: add support for fonts to webpack (2148823)

Bug Fixes

  • core: add labels and source maps (#227) (d5af653)
  • emotion: fix Global css not ending up in head (e8c3430)
  • emotion: fix Global leak (baad509)
  • post-type: fix handler if a query is present (0c36a7c)
  • styles: add styles for form inputs (#231) (0d6385b)

Versions

 - [email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - [email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
 - @frontity/[email protected]
4 Likes