@syncfusion/ej2-material-theme/styles/treegrid/treegrid-lite.css

A modern JavaScript UI toolkit that has been built from the ground up to be lightweight, responsive, modular and touch friendly. It is written in TypeScript and has no external dependencies.

.e-treegrid .e-indent::before,
.e-grid-menu .e-indent::before {
  content: "\e33f";
}
.e-treegrid .e-outdent::before,
.e-grid-menu .e-outdent::before {
  content: "\e35d";
}
.e-treegrid .e-toolbar-item .e-expand::before {
  content: "\e556";
}
.e-treegrid .e-toolbar-item .e-collapse::before {
  content: "\e554";
}
.e-treegrid .e-toolbar-item .e-indent::before {
  content: "\e33f";
}
.e-treegrid .e-toolbar-item .e-outdent::before {
  content: "\e35d";
}
.e-treegrid .e-treegridexpand::before,
.e-treegrid .e-treegridcollapse::before,
.e-grid .e-treegridexpand::before,
.e-grid .e-treegridcollapse::before {
  content: "\e848";
}
.e-treelistgrid.e-print-grid-layout .e-treegridexpand::before,
.e-treelistgrid.e-print-grid-layout .e-treegridcollapse::before {
  content: "\e848";
}
@media print {
  .e-treecell-child {
    width: 10px;
    display: inline-block;
  }
}
.e-treegrid .e-icons.e-none::before {
  content: "";
}
.e-treegrid .e-grid.e-default.e-draggable:not(.e-rtl) tr td.e-rowdragdrop.e-childborder:first-child:not(.e-dropbottom, .e-droptop),
.e-treegrid .e-grid.e-default.e-draggable:not(.e-rtl) tr td.e-rowcell.e-childborder:first-child:not(.e-dropbottom, .e-droptop) {
  border-left: 1px solid #e3165b;
}
.e-treegrid .e-grid:not(.e-grid-min-height) .e-gridcontent tr.e-row.e-summaryrow .e-rowcell:empty {
  height: auto;
}
.e-treegrid .e-gridheader .e-headercell .e-css.e-hierarchycheckbox {
  height: 20px;
  vertical-align: middle;
}
.e-treegrid .e-treegridexpand::before,
.e-treegrid .e-treegridcollapse::before {
  text-align: center;
  vertical-align: middle;
}
.e-treegrid .e-treecolumn-container .e-treecell-icon {
  width: 4px;
  display: inline-block;
}
.e-treegrid .e-treecolumn-container .e-treecell-child {
  width: 10px;
  display: inline-block;
}
.e-treegrid .e-expand-iconstyle {
  width: 16px;
}
.e-treegrid .e-print-layout {
  position: absolute;
  top: -9999px;
  left: -9999px;
}
.e-treegrid tr.e-childrow-hidden {
  display: none;
}
.e-treegrid .e-rowcell:not(.e-gridclip) .e-treecolumn-container {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.e-treegrid .e-rowcell:not(.e-gridclip) .e-treecolumn-container span.e-treecell {
  display: contents;
  overflow: hidden;
  text-overflow: ellipsis;
}
.e-treegrid .e-templatecell .e-treecolumn-container span {
  vertical-align: middle;
}
.e-treegrid .e-treegridexpand:hover::before,
.e-treegrid .e-treegridcollapse:hover::before {
  color: #000;
}
.e-treegrid .e-rtl .e-treegridcollapse {
  transform: scale(-1);
}
.e-treegrid .e-treegridexpand {
  transform: rotate(90deg);
}
.e-treegrid .e-treerowexpanded:not(.e-hiddenrow) {
  display: table-row;
}
.e-treegrid .e-treerowcollapsed {
  display: none;
}
.e-treegrid .e-treecheckbox-container {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.e-treegrid .e-treecheckbox-container :not(.e-treecheckbox) {
  white-space: nowrap;
}
.e-treegrid .e-treecheckbox {
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.e-treegrid .e-treecolumn-container span {
  display: inline-block;
  vertical-align: text-bottom;
}
.e-treegrid .e-templatecell .e-treecolumn-container span {
  vertical-align: middle;
}
.e-treegrid .e-cloneproperties .e-treecolumn-container span {
  vertical-align: text-top;
}
.e-treegrid .e-cloneproperties .e-rowcell:not(.e-gridclip) .errorValue .e-treecolumn-container {
  display: table-row;
}
.e-treegrid .e-hierarchycheckbox .e-frame {
  height: 18px;
  width: 18px;
}
.e-treegrid .e-checkselection .e-frozenheader .e-rowcell,
.e-treegrid .e-checkselection .e-movableheader .e-rowcell,
.e-treegrid .e-checkselection .e-frozencontent .e-rowcell,
.e-treegrid .e-checkselection .e-movablecontent .e-rowcell {
  line-height: 21px;
}
.e-treegrid .e-treegridexpand,
.e-treegrid .e-treegridcollapse {
  color: #000;
  cursor: pointer;
  font-size: 10px;
  height: 16px;
  padding: 0;
  text-align: center;
  vertical-align: text-bottom;
  width: 16px;
}
.e-treegrid .e-treecell {
  display: table-cell;
  line-height: normal;
}
.e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container, .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container {
  white-space: nowrap;
}
.e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container .e-treecell {
  display: inline-block;
  white-space: normal;
  word-wrap: break-word;
}
.e-treegrid .e-grid.e-wrap .e-cloneproperties .e-rowcell .e-treecolumn-container .e-treecell {
  display: inline-block;
  white-space: nowrap;
  word-wrap: break-word;
}
.e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container .e-treecheckbox {
  display: inline-block;
  white-space: normal;
  word-wrap: break-word;
}
.e-treegrid .e-grid.e-wrap .e-treecolumn-container span {
  vertical-align: middle;
}
.e-treegrid.e-grid.e-print-grid-layout .e-icons {
  display: inline-block;
}
.e-treegrid .e-treecheckselect,
.e-treegrid .e-treeselectall {
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 0;
}
.e-treegrid .e-detailheadercell,
.e-treegrid .e-detailcell-visible,
.e-treegrid .e-headercontent .e-table .e-detail-intent,
.e-treegrid .e-gridcontent .e-table .e-detail-intent,
.e-treegrid .e-table .e-detailrow .e-detailindentcell,
.e-treegrid .e-table .e-detailrowexpand,
.e-treegrid .e-table .e-detailrowcollapse,
.e-treegrid tr.e-detailrow.e-childrow-hidden {
  display: none;
}
.e-treegrid .e-table-cell::before {
  content: none;
  display: none;
}
.e-treegrid .e-table-cell {
  display: table-cell;
}
.e-treegrid .e-icons.e-errorelem {
  padding-left: 10px;
  display: inline-block;
  vertical-align: text-bottom;
}
.e-treegrid .e-errorelem::before {
  color: #e3165b;
  content: "\e22a";
  transform: rotate(180deg);
}
.e-treegrid .e-gridcontent td.e-childborder {
  border-color: #e3165b;
  border-width: 1px 0 0;
  box-shadow: 0 1px 0 0 #e3165b;
  position: relative;
  z-index: 1;
}
.e-treegrid .e-gridcontent td.e-childborder.e-leftfreeze {
  position: sticky;
}
.e-treegrid .e-gridcontent td.e-rowcell.e-childborder.e-dragborder,
.e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom.e-dragborder td.e-rowdragdrop.e-dropbottom.e-dragborder {
  box-shadow: 0 1px 0 0 #e3165b;
}
.e-treegrid .e-gridcontent td.e-rowcell.e-dragborder,
.e-treegrid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
.e-treegrid .e-gridcontent .e-rowdragdrop.e-dragborder {
  box-shadow: 0 0 0 0;
}
.e-treegrid .e-gridcontent td.e-childborder:first-child {
  border-left: 1px solid #e3165b;
  box-shadow: 0 1px 0 0 #e3165b;
  position: relative;
  z-index: 1;
}
.e-treegrid .e-gridcontent td.e-rowcell.e-childborder:last-child,
.e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
  border-right: 1px solid #e3165b;
}
.e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder {
  border-width: 1px 0;
}
.e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
  border-left: 1px solid #e3165b;
}
.e-treegrid .e-gridcontent td.e-dropbottom:first-child,
.e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom,
.e-treegrid .e-gridcontent td.e-dropbottom {
  box-shadow: 0 1px 0 0 #e3165b;
  position: relative;
  z-index: 1;
}
.e-treegrid .e-gridcontent td.e-dropbottom:first-child.e-leftfreeze,
.e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom.e-leftfreeze,
.e-treegrid .e-gridcontent td.e-dropbottom.e-leftfreeze {
  position: sticky;
}
.e-treegrid .e-gridcontent td.e-droptop:first-child,
.e-treegrid .e-gridcontent td.e-rowcell.e-droptop {
  border-top-color: #e3165b;
  border-width: 1px 0 0;
}
.e-treegrid .e-gridcontent td.e-lastrowcell.e-dropbottom {
  border-bottom-color: #e3165b;
}
.e-treegrid .e-gridcontent td.e-rowdragdrop.e-droptop.e-dragborder {
  box-shadow: 0 0 0 0;
}
.e-treegrid .e-gridcontent .e-gridheader .e-firstrow-dragborder {
  height: 1px;
}
.e-treegrid .e-gridcontent .e-lastrow-dragborder {
  height: 0;
}
.e-treegrid .e-gridheader .e-firstrow-dragborder,
.e-treegrid .e-droptop .e-lastrow-dragborder,
.e-treegrid .e-gridheader .e-firstrow-dragborder tr:first-child.e-dropbottom {
  height: 0;
}
.e-treegrid .e-treegrid-relative {
  position: relative;
}
.e-treegrid .e-gridheader .e-firstrow-border,
.e-treegrid .e-gridcontent .e-lastrow-border {
  background-color: #e3165b;
  bottom: 0;
  display: none;
  height: 1px;
  position: absolute;
  z-index: 1;
}
.e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowcell.e-childborder,
.e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-childborder {
  border-bottom: 1px solid #e3165b;
  border-top: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowcell.e-droptop,
.e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-droptop {
  border-top: 1px solid #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-childborder {
  border-bottom: 1px solid #e3165b;
  border-top: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-childborder {
  border-bottom: 1px solid #e3165b;
  border-top: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-dropbottom {
  border-bottom: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-droptop {
  border-top: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-dropbottom {
  border-bottom: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-droptop {
  border-top: 1px solid #e3165b;
  box-shadow: 0 0 0 0 #e3165b;
}
.e-treegrid .e-grid.e-rtl .e-gridheader .e-firstrow-dragborder,
.e-treegrid .e-grid.e-rtl .e-droptop .e-lastrow-dragborder {
  height: 0;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder {
  border-color: #e3165b;
  border-width: 1px 0 0;
  position: relative;
  z-index: 1;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder.e-leftfreeze {
  position: sticky;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-dragborder,
.e-treegrid .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
.e-treegrid .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
  box-shadow: 0 0 0 0;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder:first-child {
  border-right: 1px solid #e3165b;
  box-shadow: 0 1px 0 0 #e3165b;
  position: relative;
  z-index: 1;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-childborder:last-child,
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
  border-left: 1px solid #e3165b;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder {
  border-width: 1px 0;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
  border-right: 1px solid #e3165b;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-droptop:first-child,
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-droptop {
  border-top-color: #e3165b;
  border-width: 1px 0 0;
}
.e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-dropbottom {
  border-bottom-color: #e3165b;
}
.e-treelistgrid.e-print-grid-layout .e-icons.e-none::before {
  content: "";
}
.e-treelistgrid.e-print-grid-layout .e-treecolumn-container .e-icons:not(.e-frame) {
  display: inline-block;
}
.e-treelistgrid.e-print-grid-layout .e-treegridexpand {
  transform: rotate(90deg);
}
/* stylelint-disable-line no-empty-source */