How to make nested styles in sass through a loop?

Question

css

It is necessary to set a different level of shadow for the nested menu sub-items in the loop.
You can of course manually, but not hunting.

ul {
 li {
  padding-left: 10px;
  ul {
   li {
    padding-left: 20px;
   }
  }
 }
}

For example, in this code, with each nesting, the left indent will grow. How to do the same thing only in a sass loop.

Answer 1

if without animation, then bootstrap grid

Answer 2

In my opinion, flexbox will help you, look at the lessons on YouTube Or, as mentioned above, bootstrap, foundation and other frameworks with grids.

Answer 3

bootstrap