How can I use :global css classes - css modules

Question

I'm using css modules for my reactjs project. Here is my file where I'm trying to use global css classes:

<div class='site-wrapper'></div>
<div class='site-wrapper-title'>Hello World</div>

Here is my styles.css

:global{
    .site-wrapper {
        color: 'green';
    }
    .site-wrapper-title {
        color: 'red';
    }   
}

But it is not working. I think I'm doing mistake in importing. How can I import global css and then use it in my application?

Well, I'm newbie so sorry for foolish mistakes.

Answer 1

:global .site-wrapper{
  color: 'green';
}

:global .site-wrapper-title {
  color: 'red';   
}

or

:global(.site-wrapper){
  color: 'green';
}

:global(.site-wrapper-title) {
  color: 'red';   
}

should work for you