[FIXED] Need to draw vertical lines in expand/collapse in p-tree

Issue

I am using p-tree from prime-ng, and need to draw the vertical lines(Highlighted with red pen) via css like this:

enter image description here

I have done the rest part and working fine, only vertical lines need to draw. My Implementation is looking something like below:

enter image description here

I just need to draw vertical lines below + and – icons.
Kindly Help!

Solution

You can do it by adding the following style:

::ng-deep .p-tree .p-treenode-children .p-treenode {
  border-left: 1px dashed black;
}

It might require some tinkering if you made some changes to the styling, maybe add margin-left to move the border a bit.

You can see a demo here.

Answered By – Shai

Answer Checked By – Willingham (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published