rekursive Sass in Tiefe

Question

Ich möchte Padding wie folgt anpassen.

es möglich ist, mit sass mixin oder eine andere Art und Weise mit @for Richtlinie

.list { 

    .item { 
    .text-box { 
     padding-left: 10px; 
    } 
} 

.list { 

    .item { 
     .text-box { 
      padding-left: 20px; 
     } 
    } 

    .list { 

     .item { 
      .text-box { 
       padding-left: 30px; 
      } 

     } 

     .list { 

      .item { 
       .text-box { 
        padding-left: 40px; 
       } 

      } 
     } 
    } 
} 

}

Answer 1

Was ist mit einer Schleife zu lösen?

$list: ".list"; 
@for $i from 0 through 3 { 
    #{$list} { 
    .item { 
     .text-box { 
     padding-left: (10px + $i*10px); 
     } 
    } 
    } 
    $list: append($list, ".list"); 
}