DayPilot Forums

DayPilot is the best open-source Outlook-like calendar control for ASP.NET.
DayPilot Pro Demo (Calendar control)
» DayPilot Pro live demo (Calendar control)
DayPilot Pro Demo (Scheduler control)
» DayPilot Pro live demo (Scheduler control)
Home » How To » I want to change complete look and feel of calendar

I want to change complete look and feel of calendar

kindly tell me all the css classes names that can be modified and is there a way i can modify all properties using css style sheet. as i want to enable theming on my calendar.
Sheraz - 2/20/2008 1:48:02 PM
Quick response is required. Please Dan
Sheraz - 2/20/2008 1:48:28 PM
The overview of what can be changed is in the release notes for 4.2:

http://www.daypilot.org/daypilot-pro-4-2.html

At this moment CSS class styling is enabled for DayPilotCalendar and DayPilotScheduler. Let me know if you have any questions regarding this feature.
Dan Letecky - 2/20/2008 4:17:31 PM
There are also two examples included in the DayPilot Pro package:
  • Demo/Calendar/CssStyling.aspx
  • Demo/Scheduler/CssStyling.aspx
Dan Letecky - 2/20/2008 4:19:59 PM
I am facing the same problem. I have checked http://www.daypilot.org/daypilot-pro-4-2.html but it contains information for event, header, cellbackground, hourcellborder and hourhalfcellborder only. I want to apply classes on other elements too. Like all day event, hour name border, hour name background etc.
Kindly guide me how to style these elements using css classes.
Irfan - 2/21/2008 7:03:48 AM
The release notes list all properties that can be changed using CSS classes.

I plan to add more objects (some are problematic because the rendering uses tweaks to make it cross-browser compatible). The estimate is 1 April (release 4.7).

I will be also changing the way the CSS classes are specified: At this moment you specify a single CssClass property and define classes like daypilot.header, daypilot.event, etc. That is causing problems because the class attribute used in the HTML has to be in the following format: class="daypilot header". If you already have .header class defined it will be applied as well.

It will be replaced by object-specific properties to prevent such interference:
  • CssClassHeader
  • CssClassEvent
  • ...
It will also be more clear what can be styled using classes.
Dan Letecky - 2/21/2008 1:20:57 PM
Post reply