Space out weekday checkboxes in weekly repeat recurrence editor

[Erik]

I have gotten several user complaints that it is hard to differentiate the weekday checkboxes.

Is there a way to space them out a bit?

 

I have tried (without success) to handle the edit event of the scheduler and bind to the change event of the recurrenceeditor dropdown to set the margin style.

function onEdit(e) {
   var recurDropdown = e.container.find("[data-role=recurrenceeditor]");

   // handle recurrence editor's change event
   recurDropdown.unbind("change", spaceWeekDayChks);
   recurDropdown.bind("change", spaceWeekDayChks);
}


function spaceWeekDayChks() {
   // space out recurrence editor week days
   // - called from change event of recurrence editor dropdown
   $('.k-recur-weekday-checkbox').css("margin-right", "20px");
}

 

[Veselin Tsvetanov]

Hi Erik,

To set custom spacing between the Weekday checkboxes, I would suggest you to apply the following CSS rule:

.k-check .k-recur-weekday-checkbox {
  margin-left: 20px;
}

Here you will find a Dojo sample, based on the above.

Regards,
Veselin Tsvetanov
Telerik by Progress

[Erik]

Thanks your solution to apply CSS rule worked perfectly.  I was definitely over-complicating it :)