Specific day or holiday in materialize

Question

is possible to make a specific day for example a holiday using materializecss?

if I use jqueryUI using 'beforeShowDay'. The step is I will call a function inside beforeShowDay function, return the status of date (event or holiday), add another condition and change the CSS.

here is an example https://codepen.io/mohitbhansali/pen/NPxzYq

My question is how to create holiday in materializecss? thank you

Answer 1

In Materialize you can use events option and add an array of dates that you want to highlight.

Days format must be eee mmm dd yyyy. After this materialize add an has-event class to the date and you can use it to highlight date with css.

Assume you want to highlight all sundays of august as holiday :

$(document).ready(function(){
   $('.datepicker').datepicker({
      events: ["Sun Aug 05 2018",
               "Sun Aug 12 2018",
               "Sun Aug 19 2018",
               "Sun Aug 26 2018"
              ]
      });
});

Here is complete example : jsFiddle