I would like to use a custom Class for the Navigator element. Where should the css file be located / stored ?
When styling the Navigator (or any other component) there are two options:
1. Use a custom theme. You can create a theme using the online theme designer (https://themes.daypilot.org/) or you can build it manually.
When using a custom theme, all classes are prefixed with the theme name.
Make sure that the theme css is included in the page:
<link type="text/css" rel="stylesheet" href="my_theme.css" />
and that the Navigator "theme" property loads the theme:
var nav = new DayPilot.Navigator("nav");
nav.theme = "my_theme.css";
2. You can also override styling for specific elements while using the default theme. In that case you need to include your CSS (using <style> or <link>).
In this case, you need to make sure that the custom styles are applied:
* use a more specific selector than the theme
* add "!important" to the style definition
Please let me know if it didn't help.
Great ! That did the trick.
I went through the docs as well to understand how to change the appearance of a specific date in the Navigator, but I could not find it.
Let's say I want to change color to red for date = 2019-06-24. How should I proceed ?
Here you can find details about building a custom theme:
If you want to customize a specific day (set custom HTML/CSS) you can use onBeforeCellRender event:
Perfect and beautiful !