0
@Color1 = #fff;
@Color2 = #b00;

h1 {
  color:@Color1;
  background:@Color2;
}

How can i change @Color1 and @Color2 with JS? This is my example code.

or 

.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper:before {
    right: -20px;
    border-left-color: #8AC0D9;
}

How can I reach the border-left-color JavaScript code? I have a dynamically changing color value. I have to apply this. How can I do it ?

EDIT

main.css // this my css file @Álvaro-gonzález

.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper,
.chat-wrapper .chat-message.chat-message-sender .chat-message-content {
    float: right;
}
.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper:before {
    right: -20px;
    border-left-color: #8AC0D9;
}
Erdem Aydemir
  • 389
  • 1
  • 6
  • 26
  • I don't think this is supported yet... You may use LESS for this. – Praveen Kumar Purushothaman Apr 21 '17 at 08:55
  • 1
    I don't think this is pure CSS. You're probably using some CSS preprocessor. If that's the case, the browser does not even see the original code, just the *generated* CSS. Please update the question to reflect the missing information. – Álvaro González Apr 21 '17 at 09:26
  • What is `@Color1`? –  Apr 21 '17 at 12:02
  • Example code @torazaburo – Erdem Aydemir Apr 21 '17 at 12:16
  • This is not how CSS works. You do not change property values in CSS rules. Instead, you add classes to elements so the right rule is selected. The only thing JS needs to do is add or remove the necessary classes. This is basic CSS. –  Apr 21 '17 at 12:20

1 Answers1

1

here is the answer to your question. So if you want to change value of any variable from linked question, you nee to do something like:

document.styleSheets[0].rules[0].style.setProperty("--red", "#FF0000");

Of course indexes of arrays must be double checked of iterated for finding corresponding selector

Community
  • 1
  • 1
Michael Stets
  • 98
  • 1
  • 8