If I have multiple classes that require the addition of !important
to their values, is there an efficient method for achieving this? As a beginner in scss, I apologize if this question has been previously addressed. Unfortunately, my searches have not yielded any answers.
Update:
I discovered a potential solution by creating a variable and appending it to each value as shown below:
$important: !important;
$button-background-color: #03A9F4;
$button-color: #fff;
.button {
border-radius: 2px $important;
color: $button-color $important;
background-color: $button-background-color $important;
-webkit-transition: all .3s $important;
transition: all .3s $important;
border: 0px $important;
padding: 0px $important;
&:hover {
background-color: lighten($button-background-color, 20%) $important;
}
&.primary {
height: 40px $important;
}
&.secondary {
height: 30px $important;
padding: 0 10px $important;
}
}
Would you consider this the most efficient approach?