react-redux-starter-kit

react-redux-starter-kit copied to clipboard

The scenario is that I imported react-slick, downloaded the slick.css file and put it into the base folder, the _base.css file is like this:

 @import './slick/slick';

This is how I create a Slider component:

    <div styleName='mySliderClass'>
      <Slider >
        <ul styleName='category'>
          {this.props.businessTypes.map((e) => {
            return <BusinessLink key={e.slug}
              slug={e.slug}
              text={e.business_type}
              onClick={this.props.chooseBusiness} />
          })}
        </ul>
      </Slider>
    </div>

FYI, styleName is from react-css-module. And In the component css file I try to do something like this to override the slick.css:

.mySliderClass .someSlickClass {
  width: 500px; //try to override slick css
}

But this doesn't work. So how to solve this problem?

@AzrielLiang I have exactly the same issue. https://github.com/akiran/react-slick/issues/675 have you solved it someway ?

You need to add an id to the div to override the imported style from the package like so: