Less - change Less Variables modifyVars()

1

Hello There, how i can change Less Variables after Render?

   import '../css/app1.less';
 export default (props, { $f7, $el, $theme, $on}) => {

  window.less.modifyVars({
  '@f7-theme-color': '#ffcc00'
});
...
}
2

You can not. Use CSS variables CSS Variables Reference | Framework7 Documentation

3

no, i cant, because the CSS property affects all other styles
@f7-theme-color: #176815;

4

This new Color comes from a Variable. i would like to replace it

`var style1=localStorage.getItem(‘stylecolor1’) //#ffcc00

window.less.modifyVars({
‘@f7-theme-color’: '+style1
});
`

5

Ok, now it works

static/plugin.js
registerPlugin({
install: function(less, pluginManager, functions) {
functions.add(‘appColor’, function() {
return ‘#176815’;// can read any cookies
});
}
})
css/app.less
@plugin “…/static/plugin.js”;
:root {
@f7-theme-color: appColor();
…
}