Can not use the @menu-dark-arrow-color theme variable about antd-theme-webpack-plugin

[benjamingiraud]

#4 fixed the problem for me

[mzohaibqc]

@romangutkin No, this is beacuase there is no such variable @menu-dark-arrow-color0f6. This some bug which is adding this extra 0f6 at the end of @menu-dark-arrow-color variable.

Is this .ant-tag-pink your custom css class?

[romangutkin]

@mzohaibqc Thanks for replying! I think that once i defined the @menu-dark-arrow-color as a dynamic less variable in my webpack config (using antd-theme-webpack-plugin) then it cant be parsed when the color.less file is being created. .ant-tag-pink is not my custom css class, i believe it is being generated by antd.

[benjamingiraud]

Same with "@btn-primary-color"

[sli]

I'm having this issue with the same variable from #4 (@component-background), but I don't see a fix in that issue. I'm not using pure white or pure black anywhere, it's defined in variables.less, and it's listed in my rescripts config for use with react-app-rewire-antd-theme. The other variables I've configured are working, it's just that one that fails.

[sli]

I figured out what's happening.

If any of your custom colors start with a SUBSET of an already-defined color, this bug will trigger. That means none of your custom colors can start with #000 or #fff because those are already in use. So the tip to make a minor change to get around it (like using #fffffe) does not fix the problem, as that color value also triggered the bug. Changing the color value to #efffff made the variable start working.

This bug does not trigger when using window.less.modifyVars to switch themes, only on the initial colors defined in variables.less.

This is a major limitation.

[mzohaibqc]

@romangutkin @sli @benjamingiraud Thanks for reporting this issue. I know it's too late but I hope it will help you or at least others to avoid this issue. I've fixed and published a new version of this plugin

[email protected]

Or if someone is using core script it is [email protected]

[ygs-code]

So I can't use windo.less.modifyvars () to dynamically update my custom styles.
Because static style
Wiki - the title {
Color: red;
}.

covers
The wiki - the title {
Color: @ wiki - the title - color;
}
Dynamic style,

This is the antd-theme-webpack-plugin bug

[ygs-code]

So I can't use windo.less.modifyvars () to dynamically update my custom styles.
Because static style
Wiki - the title {
Color: red;
}.

covers
The wiki - the title {
Color: @ wiki - the title - color;
}
Dynamic style,

This is the antd-theme-webpack-plugin bug

[mzohaibqc]

@qq281113270 I'll be happy to help you but first you need to explain it well, what's the bug. Read your own comment and see if it makes sense or not. e.g.

The wiki - the title {
Color: @ wiki - the title - color;
}

Is neither a valid css nor a text that conveys something.

So kindly explain bit more.

As for as custom variable is concerned, it works, see the example. https://github.com/mzohaibqc/antd-theme-webpack-plugin/blob/master/examples/create-react-app/src/App.js

@secondary-color is a custom variable and not part of antd variables.