use Metropolis typeface

This commit is contained in:
Karol Wypchlo 2020-06-09 14:10:43 +02:00
parent a5a9f15f66
commit 662618eba7
15 changed files with 10 additions and 48 deletions

View File

@ -33,7 +33,8 @@
"react-reveal": "^1.2.2", "react-reveal": "^1.2.2",
"react-syntax-highlighter": "^12.2.1", "react-syntax-highlighter": "^12.2.1",
"react-visibility-sensor": "^5.1.1", "react-visibility-sensor": "^5.1.1",
"skynet-js": "^0.0.6" "skynet-js": "^0.0.6",
"typeface-metropolis": "^0.0.74"
}, },
"devDependencies": { "devDependencies": {
"cypress": "^4.8.0", "cypress": "^4.8.0",

View File

@ -1,50 +1,5 @@
@import "./variables.scss"; @import "./variables.scss";
@font-face {
font-family: "Haas Grot Disp";
src: url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff2") format("woff2"),
url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Haas Grot Disp";
src: url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff2") format("woff2"),
url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff") format("woff");
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Haas Grot Text";
src: url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff2") format("woff2"),
url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Haas Grot Text";
src: url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff2") format("woff2"),
url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff") format("woff");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Haas Grot Text";
src: url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff2") format("woff2"),
url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;

View File

@ -4,6 +4,7 @@ import SEO from "../components/seo";
import { App } from "../components"; import { App } from "../components";
import "../global.scss"; import "../global.scss";
import AppContext from "../AppContext"; import AppContext from "../AppContext";
import "typeface-metropolis"; // import Metropolis typeface
export default function IndexPage({ location }) { export default function IndexPage({ location }) {
const context = useMemo( const context = useMemo(

View File

@ -31,8 +31,8 @@ $lightGray: #969a97;
$red: #e65c5c; $red: #e65c5c;
// fonts // fonts
$font: "Haas Grot Text", Helvetica, Arial, Sans-Serif; $font: "Metropolis", Helvetica, Arial, Sans-Serif;
$font2: "Haas Grot Disp", Helvetica, Arial, Sans-Serif; $font2: "Metropolis", Helvetica, Arial, Sans-Serif;
// Breakpoints // Breakpoints
$tinybp: 374px; $tinybp: 374px;

View File

@ -15155,6 +15155,11 @@ typedarray@^0.0.6:
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
typeface-metropolis@^0.0.74:
version "0.0.74"
resolved "https://registry.yarnpkg.com/typeface-metropolis/-/typeface-metropolis-0.0.74.tgz#4201ff1e3b86f55825eed53662c49dff54c461f3"
integrity sha512-8qJnWwD5GkFqoNkv0t068jXziJHoIayq7dNl9a0BRy30/VznqmEgrQWkMDG8KxH2hRXXAWZfayXM9L6sZEkaaw==
typescript@^3.9.3: typescript@^3.9.3:
version "3.9.3" version "3.9.3"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.3.tgz#d3ac8883a97c26139e42df5e93eeece33d610b8a" resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.3.tgz#d3ac8883a97c26139e42df5e93eeece33d610b8a"