CSS - dyCalendarJS - dyclassroom | Have fun learning :-)

CSS used in dyCalendarJS project.

Container

We first need to create a container which will hold the calendar. For this we use the class .dycalendar-container.

<div id="sample-calendar" class="dycalendar-container"></div>

To create round edge calendar use the class .round-edge.

Example

<div id="sample-calendar" class="dycalendar-container skin-blue round-edge"></div>

Following are the list of available round-edge options.

Name	Class	Sample
default	.round-edge	21

After we have the container div we can apply different skins by putting the class .skin-{name}.

Example

<div id="sample-calendar" class="dycalendar-container skin-blue"></div>

<!--

Sample output

-->

Following are the list of available skins options.

After applying different skins we can add the class .gradient to create background color gradient.

Example

<div id="sample-calendar" class="dycalendar-container skin-blue gradient"></div>

Following are the list of available skins options.

We can add shadow to the calendar using the class .shadow-{option}.

Example

<div id="sample-calendar" class="dycalendar-container skin-green shadow-default"></div>

<!--

Sample output

-->

Following are the list of available shadow options.