[interpolation] How to append Units ?

[justgook]

@value max-width: 1200;
@value min-width: 543;
@value font-min: 12;
@value font-max: 21;

font-size: calc(font-min"px" + (font-min - font-max) * ( (100vw - min-width"px") / ( max-width - min-width) ));

for some part i need units and for others not - so for me is just create raw + px-postfixed units that is totally same.. so i cannot found way how to append / clear units from values

[TrySound]

You better need to keep units in your value definition.

[theinterned]

Hi @TrySound I have the need to do this as well.

I see you have closed this, so there must be a resolution but I am not getting it.

I am not sure I understand what you mean by "You better need to keep units in your value definition"? What would that look like?

Thanks!

[TrySound]

Hi @theinterned I meant keeping numbers and units separatly doesn't make lot of sense.

@value text: 16px;

[theinterned]

ah okay ... so our use case is that we need to define values with units for use in our css modules, and share unitless values for use in javascript.

our "solution" for now is to use calc like so:

/* values.css */
@value lineHeight: 20;
@value lineHeightPx: calc(lineHeight * 1px);

// some.js
@import { lineHeight } from "values.css";

const myHeight = 3 * lineHeight;

/* some.css */
@value lineHeightPx from "values.css";

.someThing {
  line-height: lineHeightPx;
  margin-bottom: lineHeightPx;
}

etc...