Allow styling of the calendar header parts

[multiwebinc]

This change will allow the date parts to be styled individually using the same CSS suffix as the character used in the title_format option. For example:

.pickmeup .pmu-month-text-B {
  font-size: 1.5rem;
  color: #1cc1f8;
}
.pickmeup .pmu-month-text-Y {
  font-size: 0.8rem;
  color: #ccc;
}
.pickmeup .pmu-month-text-default {
  color: red;
  text-decoration: underline;
}

Will produce a title like:

https://imgur.com/a/ZgGnWkk

The only caveat is that CSS class selectors are case-insensitive, so .pickmeup .pmu-month-text-B will also match the same as .pickmeup .pmu-month-text-b, etc.

I hope you like it.

[multiwebinc]

Found issues with this. Closing.

[multiwebinc]

Ok, that should do it.

[nazar-pc]

I understand what you want, but this PR only covers your specific use case. I'd rather make title_format accepting a callback function, in which case instead of format_date it would call options.title_format(local_date, options.locales[options.locale]).

This will allow you to customize year in future too if necessary with any kind of custom logic you might want there.

[multiwebinc]

Ok, that appears to work for me. Here's an example for adding a class to the year if it is not the current year:

{
    title_format: function(date, locale) {
    var m  = date.getMonth();
    var y  = date.getFullYear();
    var cur_date = new Date();

    var not_current_year = (y != cur_date.getFullYear()) ? 'not-current-year' : '';

    return '<span class="pmu-month-text">' + locale.months[m] + '</span>\
      <span class="pmu-year-text '+not_current_year+'">' + y + "</span>";
}

[nazar-pc]

Nice, thanks for your contribution!

[nazar-pc]

Released as 3.2.0