Styling

List of classes and its purposes

To modify Kanban appearance, you need to override default CSS of Kanban. Please find the list of CSS classes and its corresponding section in Kanban. Also you have an option to create your own custom theme for all JavaScript controls using our Theme Studio.

Section CSS class Purpose of CSS class
Root e-kanban This classes are in this root element (`div`) of Kanban control.
e-js
Header e-kanbantoolbar This class is added at `div` element of Kanban toolbar.
e-kanbanheader This is class is added in the root element of header element. In this class, You can override thin line between header and content of Kanban.
e-table This class is added at 'table' of Kanban header. This CSS class makes table width as 100 %.
e-columnheader This class is added at 'tr' of Kanban header.
e-headercell This class is added in 'th' element of Kanban header. You can override background color of header and border color
e-headercelldiv This class is add in div which present 'th' element in header. You recommend you to use e-headercelldiv to override skeleton of header.
Body e-kanbancontent This class is added at root of body content. This is to override background color of body.
e-table This class is added to table of content. This CSS class makes table width as 100 %.
e-swimlanerow This class is added to all swim lane ‘tr’s in Kanban.
e-columnrow This class is added to all next row of swimlane ‘tr’s in Kanban
e-rowcell This class is added to all cells in Kanban. This is to override cells appearance and styling.
e-cardselection This class is added to card div element of Kanban. This is override selection.
e-hover This class adds to card of Kanban while hover cards.