In my resource folder, I have a CSS file that contains some values which I need to change or add based on certain conditions. However, I'm struggling to figure out how to achieve this.
Here is an example of the code:
triggers: {
clear: {
cls: 'Clear-Value',
hidden:true,
handler: function(){
//some code
}
}
},
The CSS for 'clear-value' looks like this:
.Clear-Value:before {
background-color:white !important; }
Now, I want to apply some changes in certain conditions, such as adding padding or something else.
I have been attempting to do this in the following way:
beforerender: function (cmp, eOpts) {
debugger;
var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
if(isFirefox){
this.triggers.clear.cls // Here I am getting Clear-Value
}
},
While I am able to retrieve my class, I need assistance with editing the CSS. Can someone help me resolve this issue?
Thank you.