Overriding default themes

[elastic]

Overriding default themes

[chandlerprall]

Not a silly question at all! It takes a couple of steps, but should be straight forward - and feel free to ask if something doesn't make sense, I did not verify each individual step I'm laying out below.

This project detects the available themes at build time by looking for css files in node_modules/@elastic/eui/dist

To modify/add a theme, you'll need to clone the EUI repo and follow these instructions to set up a theme. To recompile only the CSS files (and not all of EUI), you can run:

node ./scripts/compile-scss.js "@elastic/eui"

which will create the new files in the dist dir within your EUI checkout. They can be copied into your next-eui-starter project and referenced by your next.config.js's buildThemeConfig