How do you style a office fabric react component?

Question

I can't figure out how to style the fabric ui component. I just want to change the background of the nav bar to be black with white phone instead of white background and black font. However, this seems to be really difficult with the current component.

There is virtually no documenation on how to style either.

https://dev.office.com/fabric#/components/nav

Thanks, Derek

Hildick

Answer 1

css inline not working?

Example:

style={{backgroundColor:'black', color:'white'}}

Regards.

Unwitnessed

How would you inline it? It's a react component. I believe all the component isolates the styles. You would have to use there exact classNames and override that. – Hildick

If you want to change specific classes, you can style file for your component. For this see github.com/webpack-contrib/style-loader – Unwitnessed

How would that work...You would still have to know the className that were used by the components in the office fabric ui source code – Hildick