Custom CSS Support
Lodestone is 100% compatible with the
built-in CSS support of Next.js (opens in a new tab),
including .css
, .module.css
, and Sass (.scss
, .sass
, .module.scss
,
.module.sass
) files.
For example, consider the following stylesheet named styles.css
:
styles.css
body {
font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica',
'Arial', sans-serif;
padding: 20px 20px 60px;
max-width: 680px;
margin: 0 auto;
}
You can create a pages/_app.js
file and import your CSS files there:
pages/_app.js
import '../styles.css'
// This default export is required in a new `pages/_app.js` file.
export default function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}
To learn more about CSS support in Next.js, check out the Next.js documentation (opens in a new tab).