title: Import Semantic-ui css without the classes being scoped locally || Semantic-ui to use classes that are being scoped locally
body: <p>I want to selectively use <code>semantic-ui-css</code> classes in my components. The problem is that I use PostCSS modules option which scopes locally all the class names for a specific component. When I use <code>semantic-ui-react</code> components, for example a button, it renders element <code>button</code> with classes <code>ui button</code>, but the included css gets scoped locally so instead of <code>button</code> i get <code>button-min_ui__14RRq</code> </p>
  
  <p>I need to do one of two things: </p>
  
  <ol>
  <li>Import Semantic-ui css without the classes being scoped locally </li>
  <li>Make Semantic-ui components to use classes that are being scoped locally</li>
  </ol>
  
  <p>For now I see that I have only one option:</p>
  
  <pre><code>import React from 'react';
  import { Button } from 'semantic-ui-react'
  import semantic from 'semantic-ui-css/components/button.min.css'
  
  export default class Test extends React.Component {
    render(){
      return (
          &lt;Button className={[semantic.ui, semantic.button]}&gt;Click Here&lt;/Button&gt;
        )
    }
  }
  </code></pre>
  
  <p>I'm explicitly stating what classes the button is to use. It works, but I have  to do that for every element and it keeps the default classes. So I get <code>ui button button-min_ui__14RRq button-min_button__Uio9b</code></p>
  
  <p>Is there a way of doing this without it keeping the default classes?</p>