It's been fixed, Greg, thanks.
I'm missing some information to understand it, but "for now," solving it is
enough for me.
Hiedra
-----Mensaje original-----
De: Greg Dove <greg.d...@gmail.com>
Enviado el: miércoles, 16 de abril de 2025 22:44
Para: dev@royale.apache.org
Asunto: Re: royale-compiler error with css function "calc()"
It might be something to do with what css properties are expected to use calc
in the compiler. Not sure...
But in situations like this, I often try to convert the 'value' to a string
which seems to get around some compiler limitations, it might be enough to get
it working for you for now. Maybe try that:
flex: '1 1 calc(50% - 1.5px) !important';
On Thu, Apr 17, 2025 at 8:14 AM Maria Jose Esteve <mjest...@iest.com> wrote:
> I'm a little confused because I've been using the "calc" function in
> my *.css files (used via classname) and "style" properties for a while
> now, and everything works fine. Now, I've created an ItemRenderer in
> which I use classes like this:
>
> .hours-label {
> flex: 1 1 calc(50% - 1.5px) !important; /* I have tried separating
> the flex property into each of the grouped properties: flex-basis,
> flex-grow, etc. but the result is the same. */
> min-width: 50px;
> padding: 0px;
> box-sizing: border-box;
> text-align: center;
> }
>
> The application compiles correctly but in App.js a block like this has
> been inserted (marking an error):
> ...
> ".hours-label",
> function() {this["boxSizing"] = "border-box"; this["flex"] = [1.0,
> 1.0, unexpected value type: calc(50% - 1.5px), "!important"];
> this["minWidth"] = 50.0; this["padding"] = 0.0; this["textAlign"] =
> "center"}, 0, ...
>
> It can't be a general problem when interpreting the "calc" function
> because I use it in many other places, for example "in the same
> ITemRenderer":
>
> [1] <wp:LabelJwExt truncate="true"
> text="{!getReg?'':getReg.observaciones}" style="width:calc(100% -
> 37px);">
>
> I was telling you I'm confused because in App.js I don't find any
> references to other CSS classes where I use "calc()", nor do I see
> anything about [1] What are we including in App.js? Why is there no
> reference to any of the other CSS classes I use in the app that also
> use "calc()", but there is a reference to ".hours-label"?
>
> Any help would be appreciated.
> Thx.
>
> Hiedra
>
>
