How can I style the indicators when active and not active state.

[gfunk1230]

I was wondering how I can style the indicators on the carousel. I see I can style the indicator itself by using the classname .rec.rec-dot but I was wondering how can i change the style of the indicator when its active? Thanks

[gfunk1230]

[gfunk1230]

@sag1v Hope that makes sense hopefully can be done. thanks

[sag1v]

@gfunk1230 As you can see here we are not adding an active class.
A possible change might be something like this:

<Dot
  onClick={this.onClick}
  active={active}
  className={`${cssPrefix("dot")} ${active ? cssPrefix("dot_active") : '' }`}
/>

Or, you can just create your own pagination indicator. you can see more details about it here

[gfunk1230]

@sag1v awesome! thanks so much for the quick reply

[sag1v]

@gfunk1230 Do you want to PR with this change?

[sag1v]

cc @orensurf

[gfunk1230]

@sag1v just to be clear you would like me to create this enhancement myself and commit a PR for it?

[gfunk1230]

@sag1v if so it seems like the suggested above should be easy to implement. Just wanted to make sure you werent suggesting yourself in doing it but if so great and thankful?

<Dot
  onClick={this.onClick}
  active={active}
  className={`${cssPrefix("dot")} ${active ? cssPrefix("dot_active") : '' }`}
/>

[gfunk1230]

@sag1v any chance you can make that update actually since I am getting failing test when trying to commit the PR. It would be greatly appreciated.

But does work as you suggested as you can see below but if you could make that change it would be greatly appreciated

[sag1v]

Interesting, i saw this issue. I will try to check it later on.

[sag1v]

@gfunk1230 Indeed there was a problem with jest-cli i did npm uninstall jest-cli and tests are running fine now. see #13
You can pull the latest changes i made and try it yourself, and of course commit the PR. 😄

[sag1v]

@orensurf You can try now, i switched to yarn instead of npm because npm has some issues with linked dependencies.

1. Get my latest commits from master (git pull)
2. Delete node_modules
3. Run yarn
4. Then run yarn docz:dev to run the app.

[waheed7429]

how can i disable dots of elastic carousel i dontnwant to show them

[sag1v]

@waheed7429 You can pass

pagination={false}