CODEWITHSUNDEEP
javascriptreactjsreact-big-calendar
heukma
heukma

Reputation: 21

Using React Big Calendar how can i change the color of the cell that i am pointing

enter image description here

enter image description here

enter image description here

I want to change all of these color.

It would be very helpful if you give me a sample code.

Thank you very much.

Upvotes: 2

Views: 1477

Answers (2)

Subham_xam
Subham_xam

Reputation: 1

it will work

.rbc-off-range-bg {
  background: #1c1917 !important;
}

.rbc-today{
  background-color: #2c2724 !important;
}

Upvotes: 0

Steve -Cutter- Blades
Steve -Cutter- Blades

Reputation: 5432

@heukma It's difficult to understand exactly what you are trying to accomplish, but it seems to me what you are looking for is the slotPropGetter prop. This will allow you to provide custom classes or styles to slots, based upon the date you pass in.

// your arrow function can contain custom logic, as long
// as it returns an object with either the `className` or
// `style` keys (or both). `className` must be a string, while `style`
// must be an object.
slotPropGetter={(date) => ({
  className: 'some-custom-class', 
  style: {
    backGroundColor: 'periwinkle'
  }
})}

Upvotes: 0

Related Questions