Skip to content
PatternFly logo

Tree view

Examples

Default

With checkboxes

With icons

With badges

With action item

With non-expandable top level nodes

With selectable, expandable nodes

Guides

Compact

Compact, no background

Documentation

Accessibility

Attribute
Applied to
Outcome
role="tree"
.pf-c-tree-view__list
Identifies the ul as a tree widget. Place on the outermost ul only
role="group"
.pf-c-tree-view__list
Identifies the ul element as a container of treeitem elements that form a branch of the tree. Place on all uls except the first ul
role="treeitem"
.pf-c-tree-view__list-item
Hides the implicit listitem role of the li element from assistive technologies.
aria-expanded="false"
.pf-c-tree-view__list-item
For an expandable item, indicates the parent node is closed, i.e., the descendant elements are not visible.
aria-expanded="true"
.pf-c-tree-view__list-item.pf-m-expanded
Indicates the parent node is open, i.e., the descendant elements are visible.
tabindex="-1"
.pf-c-tree-view__list-item
Makes the element with the treeitem role focusable without including it in the tab sequence of the page.
tabindex="0"
.pf-c-tree-view__list-item
Includes the element with the treeitem role in the tab sequence. Only one treeitem in the tree has tabindex="0". When the user moves focus in the tree, the element included in the tab sequence changes to the element with focus.
aria-label="[button label text]"
.pf-c-tree-view__action
Provides an accessible name for the button when an icon is used instead of text. Required when icon is used with no supporting text

Usage

Class
Applied
Outcome
.pf-c-tree-view
<div>
Initiates the tree view container. Required
.pf-c-tree-view__list
<ul>
Initiates a tree view list. Required
.pf-c-tree-view__list-item
<li>
Initiates a tree view list item. Required
.pf-c-tree-view__content
<div>
Initiates a tree view node. Required
.pf-c-tree-view__node
<button>, <label>
Initiates a tree view node. Required
.pf-c-tree-view__node-container
<span>
Initiates a tree view node container. Required for compact variant
.pf-c-tree-view__node-content
<span>
Initiates a tree view node content container used to stack elements.
.pf-c-tree-view__node-count
<span>
Initiates a tree view node count.
.pf-c-tree-view__node-toggle
<span>, <button>
Initiates a tree view toggle.
.pf-c-tree-view__node-toggle-icon
<span>
Initiates a tree view toggle icon.
.pf-c-tree-view__node-title
<span>
Initiates a tree view node title.
.pf-c-tree-view__node-text
<span>, <button>
Initiates tree view text. Note: Use a <button> when the node is expandable and selectable.
.pf-c-tree-view__node-icon
<span>
Initiates a tree view icon.
.pf-c-tree-view__node-check
<span>
Initiates a tree view check.
.pf-c-tree-view__action
<div>
Initiates a tree view action wrapper.
.pf-c-tree-view__search
<div>
Initiates a tree view search wrapper.
.pf-m-guides
.pf-c-tree-view
Modifies the tree view to the guides presentation.
.pf-m-compact
.pf-c-tree-view
Modifies the tree view to the compact presentation.
.pf-m-no-background
.pf-c-tree-view.pf-m-compact
Modifies the tree view compact variant node containers to have a transparent background.
.pf-m-current
.pf-c-tree-view__node
Modifies the tree view node to be current.
.pf-m-selectable
.pf-c-tree-view__node
For use on nodes that are expandable and selectable, when the default click action on the node selects it instead of expanding it.
.pf-m-truncate
.pf-c-tree-view, .pf-c-tree-view__node-title, .pf-c-tree-view__node-text
Modifies the tree view title or text to truncate.

CSS variables

.pf-c-tree-view--pf-c-tree-view--PaddingTop
0.5rem
.pf-c-tree-view--pf-c-tree-view--PaddingBottom
0.5rem
.pf-c-tree-view--pf-c-tree-view__node--indent--base
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view__node--nested-indent--base
calc(calc(1rem * 2 + 1rem) - 1rem)
.pf-c-tree-view--pf-c-tree-view__node--PaddingTop--base
0.5rem
.pf-c-tree-view--pf-c-tree-view__node--PaddingTop
0.5rem
.pf-c-tree-view--pf-c-tree-view__node--PaddingRight
0.5rem
.pf-c-tree-view--pf-c-tree-view__node--PaddingBottom
0.5rem
.pf-c-tree-view--pf-c-tree-view__node--PaddingLeft
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view__node--Color
#151515
.pf-c-tree-view--pf-c-tree-view__node--m-current--Color
#06c
.pf-c-tree-view--pf-c-tree-view__node--m-current--FontWeight
700
.pf-c-tree-view--pf-c-tree-view__node-container--Display
contents
.pf-c-tree-view--pf-c-tree-view__node-content--RowGap
0.5rem
.pf-c-tree-view--pf-c-tree-view__node-content--Overflow
visible
.pf-c-tree-view--pf-c-tree-view__node--hover--BackgroundColor
#f0f0f0
.pf-c-tree-view--pf-c-tree-view__node--focus--BackgroundColor
#f0f0f0
.pf-c-tree-view--pf-c-tree-view__list-item__list-item__node-toggle--Top
0.5rem
.pf-c-tree-view--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX
-100%
.pf-c-tree-view--pf-c-tree-view__node-toggle--Position
absolute
.pf-c-tree-view--pf-c-tree-view__node-toggle--Color--base
#6a6e73
.pf-c-tree-view--pf-c-tree-view__node-toggle--Color
#6a6e73
.pf-c-tree-view--pf-c-tree-view__node-toggle--hover--Color
#151515
.pf-c-tree-view--pf-c-tree-view__node-toggle--focus--Color
#151515
.pf-c-tree-view--pf-c-tree-view__node-toggle--active--Color
#151515
.pf-c-tree-view--pf-c-tree-view__list-item--m-expanded__node-toggle--Color
#151515
.pf-c-tree-view--pf-c-tree-view__node-toggle-icon--MinWidth
1rem
.pf-c-tree-view--pf-c-tree-view__node-toggle-icon--Transition
transform 250ms cubic-bezier(.645, .045, .355, 1)
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--PaddingTop
0.375rem
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--PaddingRight
1rem
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--PaddingBottom
0.375rem
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--PaddingLeft
1rem
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--MarginTop
calc(0.375rem * -1)
.pf-c-tree-view--pf-c-tree-view__node-toggle-button--MarginBottom
calc(0.375rem * -1)
.pf-c-tree-view--pf-c-tree-view__node-check--MarginRight
0.5rem
.pf-c-tree-view--pf-c-tree-view__node-count--MarginLeft
0.5rem
.pf-c-tree-view--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor
#d2d2d2
.pf-c-tree-view--pf-c-tree-view__search--PaddingTop
0.5rem
.pf-c-tree-view--pf-c-tree-view__search--PaddingRight
0.5rem
.pf-c-tree-view--pf-c-tree-view__search--PaddingBottom
0.5rem
.pf-c-tree-view--pf-c-tree-view__search--PaddingLeft
0.5rem
.pf-c-tree-view--pf-c-tree-view__node-icon--PaddingRight
0.5rem
.pf-c-tree-view--pf-c-tree-view__node-icon--Color
#6a6e73
.pf-c-tree-view--pf-c-tree-view__node-toggle-icon--base--Rotate
0
.pf-c-tree-view--pf-c-tree-view__node-toggle-icon--Rotate
0
.pf-c-tree-view--pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate
90deg
.pf-c-tree-view--pf-c-tree-view__node-text--max-lines
1
.pf-c-tree-view--pf-c-tree-view__node-title--FontWeight
700
.pf-c-tree-view--pf-c-tree-view__action--MarginLeft
1rem
.pf-c-tree-view--pf-c-tree-view__action--focus--BackgroundColor
#f0f0f0
.pf-c-tree-view--pf-c-tree-view__action--Color
#6a6e73
.pf-c-tree-view--pf-c-tree-view__action--hover--Color
#151515
.pf-c-tree-view--pf-c-tree-view__action--focus--Color
#151515
.pf-c-tree-view--pf-c-tree-view--m-guides--guide--Left
calc(calc(1rem * 2 + 1rem) - 1.5rem)
.pf-c-tree-view--pf-c-tree-view--m-guides--guide-color--base
#d2d2d2
.pf-c-tree-view--pf-c-tree-view--m-guides--guide-width--base
1px
.pf-c-tree-view--pf-c-tree-view--m-guides--guide-left--base
calc(calc(1rem * 2 + 1rem) - 1.5rem)
.pf-c-tree-view--pf-c-tree-view--m-guides--guide-left--base--offset
calc(calc(1rem * 2 + 1rem) + 1rem / 2)
.pf-c-tree-view--pf-c-tree-view--m-guides__list-node--guide-width--base
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--before--Top
0
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--before--Width
1px
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--before--Height
100%
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--before--BackgroundColor
#d2d2d2
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--last-child--before--Top
1.125rem
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--last-child--before--Height
1.125rem
.pf-c-tree-view--pf-c-tree-view--m-guides__list-item--ZIndex
100
.pf-c-tree-view--pf-c-tree-view--m-guides__node--before--Width
1rem
.pf-c-tree-view--pf-c-tree-view--m-guides__node--before--Height
1px
.pf-c-tree-view--pf-c-tree-view--m-guides__node--before--Top
1.125rem
.pf-c-tree-view--pf-c-tree-view--m-guides__node--before--BackgroundColor
#d2d2d2
.pf-c-tree-view--pf-c-tree-view--m-compact--base-border--Left--offset
1rem
.pf-c-tree-view--pf-c-tree-view--m-compact--base-border--Left
calc(calc(1rem * 2 + 1rem) - 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--indent--base
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--nested-indent--base
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact--border--Left
calc(calc(1rem * 2 + 1rem) - 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--PaddingTop
0
.pf-c-tree-view--pf-c-tree-view--m-compact__node--PaddingBottom
0
.pf-c-tree-view--pf-c-tree-view--m-compact__node--nested--PaddingTop
0.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node--nested--PaddingBottom
0.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top
calc(1.5rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--BorderBottomWidth
1px
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--BorderBottomColor
#d2d2d2
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--before--Top
0
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--last-child--before--Height
calc(1.5rem + 0.5rem + 0.25rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--nested--before--Top
calc(0.5rem * -1)
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height
calc(calc(1.5rem + 0.5rem + 0.25rem) + 0.5rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--before--Top
calc(1.5rem + 0.5rem + 0.25rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node--level-2--PaddingLeft
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact__node-toggle--nested--MarginRight
calc(1rem * -.5)
.pf-c-tree-view--pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft
calc(1rem * -1.5)
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--Display
flex
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--PaddingBottom--base
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--PaddingTop
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--PaddingRight
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--PaddingBottom
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--PaddingLeft
0.25rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--nested--PaddingTop
1rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--nested--PaddingRight
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--nested--PaddingBottom
1rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--nested--PaddingLeft
1.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor
#f0f0f0
.pf-c-tree-view--pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom
0
.pf-c-tree-view--pf-c-tree-view--m-no-background__node-container--BackgroundColor
transparent
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset
0.5rem
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background--base-border--Left
calc(calc(1rem * 2 + 1rem) - 0.5rem)
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background__node--indent--base
calc(1rem * 2 + 1rem)
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base
3rem
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop
0
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom
0
.pf-c-tree-view--pf-c-tree-view--m-compact--m-no-background__node--before--Top
calc(1rem + 0.5rem + 0.25rem)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--guide--Left
calc(calc(1.5rem * 1 + calc(1rem * 2 + 1rem)) - calc(calc(1.5rem * 1 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(1.5rem * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--Left
calc(calc(1.5rem * 1 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__list-item--before--Top
calc(0.5rem * -1)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__list-item--last-child--before--Height
calc(calc(1.5rem + 0.5rem + 0.25rem) + 0.5rem)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:last-child--pf-c-tree-view--m-compact__list-item--BorderBottomWidth
0
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__node--PaddingTop
0
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__node--PaddingBottom
0
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__node-container--Display
flex
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__node--hover--BackgroundColor
transparent
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__node--focus--BackgroundColor
transparent
.pf-c-tree-view.pf-m-compact--pf-c-tree-view__list-item__list-item__node-toggle--Top
calc(1.5rem)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item.pf-m-expanded--pf-c-tree-view--m-compact__node-container--PaddingBottom
0
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingTop
0.5rem
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingBottom
0.5rem
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node-toggle--Position
static
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(1rem * 2 + 1rem)
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX
0
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__list-item--BorderBottomWidth
0
.pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node-container--PaddingBottom
1.5rem
.pf-c-tree-view.pf-m-compact.pf-m-no-background--pf-c-tree-view--m-compact__node--before--Top
calc(1rem + 0.5rem + 0.25rem)
.pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingTop
0
.pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingBottom
0
.pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--Left
calc(calc(3rem * 1 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(3rem * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view.pf-m-no-background--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor
transparent
.pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node-toggle-icon--Rotate
0
.pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node-toggle--Color
#6a6e73
.pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 1 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 1 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item.pf-m-expanded--pf-c-tree-view__node-toggle--Color
#151515
.pf-c-tree-view__list-item.pf-m-expanded--pf-c-tree-view__node-toggle-icon--Rotate
90deg
.pf-c-tree-view__node.pf-m-current--pf-c-tree-view__node--Color
#06c
.pf-c-tree-view__node .pf-c-tree-view__node-count .pf-c-badge.pf-m-read--pf-c-badge--m-read--BackgroundColor
#d2d2d2
.pf-c-tree-view__node:not(.pf-m-selectable):hover--pf-c-tree-view__node-toggle--Color
#151515
.pf-c-tree-view__node:not(.pf-m-selectable):focus--pf-c-tree-view__node-toggle--Color
#151515
.pf-c-tree-view__node:not(.pf-m-selectable):active--pf-c-tree-view__node-toggle--Color
#151515
.pf-c-tree-view__node-title.pf-m-truncate--pf-c-tree-view__node-content--Overflow
hidden
.pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-title--pf-c-tree-view__node-content--Overflow
hidden
.pf-c-tree-view__action:hover--pf-c-tree-view__action--Color
#151515
.pf-c-tree-view__action:focus--pf-c-tree-view__action--Color
#151515
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 1 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 2 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 2 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 2 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 3 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 3 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 3 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 4 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 4 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 4 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 5 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 5 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 5 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 6 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 6 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 6 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 7 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 7 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 7 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 8 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 8 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 8 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 9 + calc(1rem * 2 + 1rem)) - 0.5rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__list-item__list-item__node-toggle--Left
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view__node--PaddingLeft
calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-guides--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem)) - calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem)) + 1rem / 2))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact__node--PaddingLeft
calc(1.5rem * 9 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem)) - 1rem)
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft
calc(3rem * 9 + calc(1rem * 2 + 1rem))
.pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item--pf-c-tree-view--m-compact--m-no-background--border--nested--Left
calc(calc(calc(calc(1rem * 2 + 1rem) - 1rem) * 10 + calc(1rem * 2 + 1rem)) - 0.5rem)

View source on GitHub