[Gatsby] Removed Typekit in favour of system fonts (#10988)
Joe Critchley committed
Sep 30, 2017 at 15:48 UTC
839b7fb901e6260b6d43ee421c32e3251286f3d3
10 files changed
+20
-23
www/src/components/LayoutFooter/ExternalFooterLink.js
-1
@@ -16,7 +16,6 @@ import ExternalLinkSvg from 'templates/components/ExternalLinkSvg';
16
const ExternalFooterLink = ({children, href, target}) => (
17
<a
18
css={{
19
- fontWeight: 300,
19
lineHeight: 2,
20
':hover': {
21
color: colors.brand,
www/src/components/LayoutFooter/FooterLink.js
-1
@@ -16,7 +16,6 @@ import {colors} from 'theme';
16
const FooterLink = ({children, target, to}) => (
17
<Link
18
css={{
19
- fontWeight: 300,
19
lineHeight: 2,
20
':hover': {
21
color: colors.brand,
www/src/components/LayoutHeader/Header.js
+1
@@ -164,6 +164,7 @@ const Header = ({location}) => (
164
border: 0,
165
color: colors.white,
166
fontSize: 18,
167
+ fontWeight: 300,
168
fontFamily: 'inherit',
169
position: 'relative',
170
paddingLeft: '24px',
www/src/components/LayoutHeader/HeaderLink.js
-1
@@ -44,7 +44,6 @@ const style = {
44
paddingLeft: 20,
45
paddingRight: 20,
46
fontSize: 18,
47
- fontWeight: 400,
47
48
':hover': {
49
color: colors.brand,
www/src/css/algolia.css
+1
-1
@@ -401,7 +401,7 @@
401
color: #222222;
402
background-color: #EBEBEB;
403
border-radius: 3px;
404
- font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
404
+ font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
405
}
406
407
.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight {
www/src/css/reset.css
+6
-2
@@ -1,6 +1,10 @@
1
html {
2
box-sizing: border-box;
3
- font-family: "proxima-nova", sans-serif;
3
+ font-family: -apple-system, BlinkMacSystemFont,
4
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
5
+ "Fira Sans", "Droid Sans", "Helvetica Neue",
6
+ sans-serif;
7
+ font-weight: 400;
8
font-style: normal;
9
-webkit-font-smoothing: antialiased;
10
}
@@ -35,5 +39,5 @@ img {
39
}
40
41
pre, code {
38
- font-family: source-code-pro, Menlo, Consolas, "Courier New", monospace;
42
+ font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
43
}
www/src/html.js
-6
@@ -59,12 +59,6 @@ export default class HTML extends Component {
59
dangerouslySetInnerHTML={{__html: this.props.body}}
60
/>
61
{this.props.postBodyComponents}
62
- <script src="https://use.typekit.net/vqa1hcx.js" />
63
- <script
64
- dangerouslySetInnerHTML={{
65
- __html: 'try{Typekit.load({ async: true });}catch(e){}',
66
- }}
67
- />
62
</body>
63
</html>
64
);
www/src/templates/components/ButtonLink/ButtonLink.js
-1
@@ -61,7 +61,6 @@ const style = {
61
const primaryStyle = {
62
backgroundColor: colors.brand,
63
color: colors.black,
64
- fontWeight: 300,
64
padding: '10px 25px',
65
whiteSpace: 'nowrap',
66
transition: 'background-color 0.2s ease-out',
www/src/templates/home.js
+6
-7
@@ -71,6 +71,7 @@ class Home extends Component {
71
textAlign: 'center',
72
margin: 0,
73
fontSize: 45,
74
+ letterSpacing: '0.01em',
75
[media.size('xsmall')]: {
76
fontSize: 30,
77
},
@@ -85,6 +86,8 @@ class Home extends Component {
86
paddingTop: 15,
87
textAlign: 'center',
88
fontSize: 24,
89
+ letterSpacing: '0.01em',
90
+ fontWeight: 200,
91
92
[media.size('xsmall')]: {
93
fontSize: 16,
@@ -96,7 +99,6 @@ class Home extends Component {
99
[media.greaterThan('xlarge')]: {
100
paddingTop: 20,
101
fontSize: 30,
99
- fontWeight: 300,
102
},
103
}}>
104
A JavaScript library for building user interfaces
@@ -281,15 +283,12 @@ const markdownStyles = {
283
'& h3': {
284
color: colors.subtle,
285
paddingTop: 0,
284
-
285
- [media.lessThan('large')]: {
286
- fontSize: 18,
287
- fontWeight: 400,
288
- },
286
+ fontWeight: 300,
287
+ fontSize: 20,
288
289
[media.greaterThan('xlarge')]: {
290
fontSize: 24,
292
- fontWeight: 400,
291
+ fontWeight: 200,
292
},
293
},
294
www/src/theme.js
+6
-3
@@ -198,18 +198,21 @@ const sharedStyles = {
198
199
'& > p:first-child': {
200
fontSize: 18,
201
- lineHeight: '30px',
201
+ fontWeight: 300,
202
color: colors.subtle,
203
204
[media.greaterThan('xlarge')]: {
205
fontSize: 24,
206
- lineHeight: '40px',
206
+ },
207
+
208
+ '& a, & strong': {
209
+ fontWeight: 400,
210
},
211
},
212
213
'& p': {
214
marginTop: 30,
212
- fontSize: 18,
215
+ fontSize: 17,
216
lineHeight: 1.7,
217
maxWidth: '42em',
218