terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

Update using emotion - fixes: Warning: <title> should not be used in _document.js's <Head> (#5454)

Browse source
This commit is contained in:
Jan Czizikow 2018-10-15 17:02:19 +02:00 committed by Tim Neutkens
parent af9214b302
commit 9d50f8afb5
2 changed files with 13 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
examples/with-emotion/pages/_document.js
View file

@ -20,7 +20,6 @@ export default class MyDocument extends Document {
return ( return (
<html> <html>
<Head> <Head>
<title>With Emotion</title>
<style dangerouslySetInnerHTML={{ __html: this.props.css }} /> <style dangerouslySetInnerHTML={{ __html: this.props.css }} />
</Head> </Head>
<body> <body>

20
examples/with-emotion/pages/index.js
View file

@ -1,4 +1,5 @@
import React from 'react' import React from 'react'
import Head from 'next/head'
import styled, { hydrate, keyframes, css, injectGlobal } from 'react-emotion' import styled, { hydrate, keyframes, css, injectGlobal } from 'react-emotion'
// Adds server generated styles to emotion cache. // Adds server generated styles to emotion cache.
@ -68,12 +69,17 @@ const Animated = styled.div`
export default () => { export default () => {
return ( return (
<div> <>
<Basic>Cool Styles</Basic> <Head>
<Combined> <title>With Emotion</title>
With <code>:hover</code>. </Head>
</Combined> <div>
<Animated animation={bounce}>Let's bounce.</Animated> <Basic>Cool Styles</Basic>
</div> <Combined>
With <code>:hover</code>.
</Combined>
<Animated animation={bounce}>Let's bounce.</Animated>
</div>
</>
) )
} }