Backcolor's make event text un-readable

Asked by Jeff
6 years ago.

I need to utilize the changing of background colors to differentiate events but holy cow, the text font being size 8 with 1mm thickness + the vibrance of these generic "red"/"blue" colors makes the text incredible awful to look at.

After some testing i noticed the args.data.backColor() takes in generic words like "red" as well as its hex code #FF2D00" but it does not accept RGB tuples.

Is there a way to make the background color less aggressive like toning down its opacity?

how-to javascript

Comment posted by Jeff
6 years ago.

Edit: I need to be able to dynamically change colors for multiple events within the same calendar, so i need options to alter the colour itself instead of altering how the text shows up against the color

Answer posted by Dan Letecky [DayPilot]
6 years ago.

The backColor property will accept all color formats defined in the CSS spec (it's translated to an inline "background" style):

https://developer.mozilla.org/en-US/docs/Web/CSS/color_value

To specify the color using RGB components, you can use this:

onBeforeEventRender: function(args) {
  args.data.backColor = "rgb(255, 45, 0)";  //   = #FF2D00
}

You can use rgba() to specify transparency (alpha channel):

onBeforeEventRender: function(args) {
  args.data.backColor = "rgb(255, 45, 0, 0.5)";  //   = #FF2D00 with 50% transparency
}

This question is more than 1 month old and has been closed. Please create a new question if you have anything to add.