Where to put custom css file in Next JS?

[asharimh97]

So I tried to implement the charting library using NextJS and I want to add custom_css_url but somehow it doesn't work.

Here's my widget options config :

const config = {
    symbol: 'AAPL',
    interval: 'D' as ResolutionString,
    containerId: 'tv_chart_container',
    datafeedUrl: 'https://demo_feed.tradingview.com',
    libraryPath: '/tradingview/charting_library/',
    chartsStorageUrl: 'https://saveload.tradingview.com',
    chartsStorageApiVersion: '1.1',
    clientId: 'tradingview.com',
    userId: 'public_user_id',
    fullscreen: false,
    autosize: true,
    studiesOverrides: {},
    custom_css_url: '/tradingview/styles/custom.css'
}

My project structure is somehow like this:

.
├── public
│   ├── tradingview
│   │   ├── charting_library
│   │   ├── datafeed
│   │   └── styles
│   │       └── custom.css
│   └── // ... rest of public folder
└── // ... the rest of files and folder in project

I have tried to change custom_css_url to ../styles/custom.css and {{ROOT}}/tradingview/styles/custom.css (while ROOT is my preconfigured site url e.g. http://localhost:3000), but somehow it doesn't work as well.

[asharimh97]

Sorry my bad, it's not the config, but my class name selector is wrong. Thanks!