How to Inherit non-overriden css pseudo-properties from the pseudo css classes

Viewed 34

I have a css pseudo class. i want to add some more properties in the same pseudo class only for few elements. eg:

<button class="left outline">
</button>
.left{
   ...
   ...
   &:after{
     content: url("img..."),
   }

   &:before{
     ...
     ...
   }
}
.outline {
   ...
   ...
   &:after {
     content: "",
     outline-width: 2px;
     outline-style: solid;
     outline-color: $outlineColor;
     outline-offset: $outlineOffset;
   }
}

In the above snippet, i don't want the .outline:after to only override the .left:after instead i want to inherit and override the props. Basically what i mean is, I want the image as well as the outline on the same element using pseudo class.

Can any one help me out on this?

Thanks in advance

0 Answers
Related