DayPilot Knowledge Base

AJAX Calendar/Scheduling Controls
DayPilot Pro (AJAX Calendar Control)
» DayPilot AJAX Calendar
DayPilot Pro (AJAX Monthly Calendar Control)
» DayPilot AJAX Monthly Calendar
DayPilot Pro (AJAX Scheduler Control)
» DayPilot AJAX Scheduler
DayPilot » Knowledge Base » List of CSS classes used in CssOnly mode (Scheduler)

List of CSS classes used in CssOnly mode (Scheduler)

Last revision: Jun 11, 2013

All the classes will be prefixed with the value of CssClassPrefix property. 

Example:

CssClassPrefix="scheduler_green"

"_message" will result in "scheduler_green_message".

See also

Message Box

_message

Message bar.

_message_close

Close icon of the message bar.

Events

_event

Main event box

_event_inner

Inner event box.

_event_lineX

Depending on the line on which the event is placed in a row (not a row number)

Examples: _event_line0, _event_line1

_selected

A selected event (in addition to _event).

_event_bar

 Duration bar background, full width. Inside _event.

_event_bar_inner

Active area of the duration bar, depending on real duration or PercentComplete. Inside _event_bar.

_event_continueleft

Events that start outside of the visible area.

_event_continueright

Events that end outside of the visible area.

Shadow

_shadow

Moving/resizing shadow marker.

_shadow_inner

Inside _shadow.

Resources

_resourcedivider

1px horizontal line between rows in the resource header.

_rowheader

Applied to every cell in the row header, including additional columns.

_rowheadercol

Applied to additional columns, in addition to _rowheader.

_rowheadercolX 

Additional columns, in addition to _rowheadercol and _rowheader.

Examples: _rowheadercol1, _rowheadercol2

_rowheader_inner

Inside _rowheader.

_tree_image_expand

Expand icon box. Inside _rowheader and _rowheader_inner.

_tree_image_collapse

Collapse icon box. Inside _rowheader and _rowheader_inner.

_tree_image_no_children

No children icon box. Inside _rowheader and _rowheader_inner.

Main

_main

The topmost div.

_divider

Vertical 1px line between resources and the time part.

_divider_horizontal

Horizontal 1px line between upper-left corner and resources.

Upper-Left Corner Cell

_corner

Upper-left corner box.

_corner_inner

Inside _corner.

Time Grid

_scrollable

Main scrollable area with time cells.

_matrix

 Grid with time cells, inside _scrollable.

_loading

Loading label.

_matrix_horizontal_line

 1px horizontal line between time cells.

_matrix_vertical_line

1px vertical line between time cells.

_matrix_vertical_break

1px vertical line placed over _matrix_vertical_line if there is a time break at this point - a hidden column for ShowNonBusiness=false.

Time Cells

_cell

Time cell. Only in full rendering mode (see _cellcolumn below).

_cellparent

If the cell is in a parent resource; in addition to _cell.

_cellcolumn

Used when the optimized cell rendering is applied - if all the cells in a column have the same properties they are rendered using a single div marked with this class.

Time Header

_timeheadergroup

Time header group cell, there are always 1+ time header group rows, depending on TimeHeaders property.

_timeheadergroup_inner

Inside _timeheadergroup.

_timeheadercol

Cells in the last row of the time header, there is always 1 time header col group with one cell per CellDuration unit.

_timeheadercol_inner

Inside _timeheadercol.

Related

List of CSS classes used in CssOnly mode (Calendar)
List of CSS classes used in CssOnly mode (Month)
Sample Scheduler CSS Theme
List of CSS classes used in CssOnly mode (Navigator)