angularkendo-uikendo-panelbar

Kendo PanelBar Indent Children / Grand Children

Angular

I have a PanelBar with children / Grand Children. How can I make the children / Grand Children indent an extra 3em so that the children are moved to the right and appear under the parent, offset by a bit.

Right now the children / Grand Children are directly below their parent.

    <kendo-panelbar-item title="Orders">
      <kendo-panelbar-item title="Upload Orders"></kendo-panelbar-item>
      <kendo-panelbar-item title="Batch Summary"></kendo-panelbar-item>
    </kendo-panelbar-item>

enter image description here

Solution

  • You can achive that with simple css:

       .k-panelbar .k-group  {
       padding-left: 10px;
  }

    Example: PanelBar indent