How to change color default

[pranasabda]

Helo, i use this library and this was great and simple
but i try to change the default color.
how can i change the default color ?

i have try to change color from css file and try using style={{background-color:"#fff"}} too
but it doesn't work.

thank you .

[isaurssaurav]

Thanks for your response.

For now, you cannot change default color form inline-css like you did or anywhere from passing props.
But what you can do is remove an import css from file, i.e
import "react-pagination-library/build/css/index.css" .

Then, copy css from below link and paste it to your style.scss(css)
https://github.com/isaurssaurav/react-pagination/blob/master/src/lib/components/Pagination.css

From this you can edit size, color, aything you want.

In next version, i will sure be adding default color. 👍

[aniltks]

@pranasabda You can override the css with your own css file for all theme separately like:

a:hover:not(.active) {
  background-color: #ffc107 !important;
}

.bottom-border .is-active li {
  font-weight: bold;
  border-bottom: 3px solid #ffc107;
}

.square-fill .is-active {
  background-color: #ffc107 !important;
}

.square-fill a:first-child:not(.active) {
  background-color: #ffc107;
}

.square-fill a:last-child:not(.active) {
  background: #ffc107 !important;
}

.square-fill > a:last-of-type {
  background-color: #ffc107 !important;
}

.square-i a {
  color: #ffc107;
  border-color: #ffc107;
}

.square-i .is-active {
  background-color: #ffc107 !important;
  border-color: #ffc107;
}

.circle a.is-active {
  border: 3px solid #ffc107;
}

.square a.is-active {
  border: 3px solid #ffc107;
}

.default .is-active {
  background-color: #ffc107;
  color: white;
  border: 1px solid #ffc107;
}