Per page global styles #177
Comments
|
Though not terrible ideal, you can have per-page global styles using // pages/first.js
import React from 'react'
import Head from 'next/head'
export default (props) => {
return (
<Head>
<style>{globalStyle}</style>
</Head>
)
}
const globalStyle = `
body {
background-color: red;
}
`// pages/second.js
import React from 'react'
import Head from 'next/head'
export default (props) => {
return (
<Head>
<style>{globalStyle}</style>
</Head>
)
}
const globalStyle = `
body {
background-color: green;
}
`When navigating to |
|
Now we are using The above example will also work :) |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
When using gamor's
insertRulein a page != from index.js for example and opening index the insertRule will do nothing. If you open the page where you haveinsertRulewith global styles (ie reset) and then navigate to index you will seeinsertRules being preserved.I'm looking for a way to add some global styling to html/body, but only for specific pages.
Also looking for a way to add reset to all pages, without re-importing reset for every page. Looks like #88 would help.
The text was updated successfully, but these errors were encountered: