How to customize the Web Calendar Style Sheet

  • Updated

This KB aticle shows how to customize the Web calendar style sheet ( WebCalendar.css ), located in \siteroot\workarea\WebCalendar\View .

Important! Files stored in the siteroot\workarea folder are overwritten (or deleted) when you upgrade. To avoid problems, back up the edited style sheet file to a folder outside the siteroot\workarea folder.

Modify the .RadScheduler classes to change the Web calendar's style. See the following examples.

Color CSS Style Change

.RadScheduler .rsDateHeader {    
  font-size: 12px;    
  padding: 1px 4px 3px;    
  text-decoration: none;    
  color: green    
}

Uppercase CSS Style Change

.RadScheduler .rsSpacerCell,     
.RadScheduler .rsVerticalHeaderTable th,    
.RadScheduler .rsHorizontalHeaderTable th {    
  border-style: solid;    
  text-transform: uppercase