1

We have multiple lightning components which use Tokens for CSS styling. We observed that one of the tokens is not being applied in any of the components which is using this token. Instead another value is applied in the CSS automatically.

We have a CSS class

.THIS .char-counter {
    font-family: token(myFontFamily);
    font-size: token(fontSize11);
    font-color: token(colorRed);
}

All the styles in this class are applied except the one for font-size which uses fontSize11 token. In the HTML that is rendered, the font-size value changes to an rem value which is 2.625rem.

The tokens are defined in defaultTokens file. I have many other tokens created same way for other font sizes and they are working fine.

This is not happening in the production environment where the code already exists but in all the Sandboxes which are in the Summer '19 preview mode have this issue. I looked in the release notes to see if there are any affecting changes but haven't found anything.

Is anyone facing the same issue or can help me with this?

  • Could you provide an example with which we can replicate the behavior? – Raul May 22 at 6:30
  • BTW, the slds token value for fontSize11 in documentation is 2.625rem. Release notes does not contains changes on such a granular level. – Raul May 22 at 6:32
  • @Raul That makes sense. The fontSize11 that I have used is a custom token created in defaultTokens.tokens file. This was working fine earlier but has stopped working in this Summer 19 preview org. So is it possible that this token was introduced in Summer 19 release only which is why the custom token is ignored and standard value is being used? – ajinkyah May 22 at 14:47
  • Probably the token was already there, salesforce may have stricted the behavior to pick values from token. Ideally custom token name must not be same as the standard one. – Raul May 22 at 15:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.