Nested List With Depth

  • Depth defines different layers of parent/children.
  • All elements with the same depth and parent(container) interact with each other.
  • Depth starts from zero and increases by one for the direct parent.
  • Depth is unlimited and connects children with parents which is done automatically.
  • In this example, you can switch between work/life tasks and between tasks in each category.


  • Boring mtg
  • Another boring mtg


  • Hit the gym
  • Finish eps 120