React-Toolbox: How to apply theme
<p>I'm using react toolbox and in my webpack configuration i have (i post just the significant part of the configuration):</p>

<pre><code>loaders: [
..... 
ExtractTextPlugin.extract('style',
                'css?sourceMap&amp;modules&amp;importLoaders=1&amp;localIdentName=' +
                '[name]__[local]___[hash:base64:5]!postcss!sass') }
        ]
postcss: [autoprefixer],
    sassLoader: {
      data: '@import "' + path.resolve(__dirname, 'app/theme/_config.scss') + '";'
    }
</code></pre>

<p>In <code>app/theme/_config.scss</code> i have defined:</p>

<pre><code>@import "~react-toolbox/lib/colors";
@import "~react-toolbox/lib/globals";
@import "~react-toolbox/lib/mixins";

$color-primary: $palette-orange-500;
$color-primary-dark: $palette-orange-700;
</code></pre>

<p><strong>Right now any strange, my colors are applied correctly.</strong></p>

<p>Now, i want to create a custom <code>Card</code> component, and i have defined it like this (just for test the theme):</p>

<pre><code>import theme from './style.scss';
const CardStatus = ({ children, ...other}) =&gt; (
    &lt;Card {...other} theme={theme}&gt;
        &lt;CardTitle
            title="A title"
            subtitle="a subtitle"
            theme={theme}
        /&gt;
    &lt;/Card&gt;
);

CardStatus.propTypes = {
    children: PropTypes.node
};
</code></pre>

<p>export default CardStatus;</p>

<p>In style.scss i have:</p>

<pre><code>.title {
  color: yellow;
}
</code></pre>

<p>My application compile without errors, but the yellow color are not applied to my CardTitle:</p>

<p>I did tried with:</p>

<ol>
<li><code>theme={theme}</code></li>
<li><code>theme={theme.title}</code></li>
</ol>

<p>But nothing... color not works.</p>

<p>What i have do wrong ?</p>