less - lesscss - which is the best way -

article {    // css code    //...    // end css code    h1 {       transition: 0.3s;    } }  body.active {     article {         h1 {            transform: translate(0, 10px);          }     }  } 

i try write better

body {     article {        // css code        //...        // end css code        h1 {           transition: 0.3s;        }     }      &.active article {        h1 {           transform: translate(0, 10px);         }     }  } 

and

body {     article {        // css code        //...        // end css code        h1 {           transition: 0.3s;        }     }      &.active article h1 {        transform: translate(0, 10px);      } } 

any suggestion ? want thing this

body {         article {            // css code            //...            // end css code            h1 {               transition: 0.3s;                // here, want write code h1 tag when body has active class in block            }         }       } 

see changing selector order, e.g.:

h1 {     transition: 0.3s;     body.active & {         transform: translate(0, 10px);     } }