Tocss-dart: "Only 3 elements allowed, but 5 were passed"?

support
1

Hi, I am in the process of switching from SASS to vanilla CSS, now that all kinds of things I used to need the former for (like nesting, variables, relative colors) are available.
But then I got that message, which is absolutely opaque, since the line number it is refering to is wrong, the stylesheet there having nothing special. As indicated, it is still a .scss since a few things I copied from elsewhere, I don’t know for sure SASS or vanilla.

Error: error building site: TOCSS-DART: failed to transform “css/main.scss” (text/x-scss): “/home/drm/WEBSITE/assets/css/main.scss:391:21”: Only 3 elements allowed, but 5 were passed.

What does it mean ?
Here’s main.css.

2

The error is not great (but I think that comes from Dart SASS).

I suspect it’s this line:

background-color: rgb(from var(–frame-color) r g b / 50%);

3

According to caniuse.com, relative colors are still unsupported on Firefox and Opera.

4

But the syntax is correct, look. Could it just be a DART problem ?

// exemple from https://developer.chrome.com/blog/css-relative-color-syntax/
background: rgb(from lime r g b / 25%);
// me
background: rgb(from var(--frame-color) r g b / 50%);

And those are the custom property definitions:

:root {
	--frame-color: #3C3C3C;
	--frame: thin solid var(--frame-color);
	--color-link: Chartreuse;
	--emphasis-color : gold;
	--element-max-width: 50%;
	--element-max-height: 500px;
}

Might it just be a DART problem ? In any case, I find it weird that it’s failing the compilation entirely, instead of discarding the line and call it a day.

I usually don’t care about either browsers… But I’ll use a support at rule:

@supports not (color: rgb(from white r g b)) {
  /* fallback */
}
5

Ok, I jumped into the unknown… just get rid of DART and work from there. Now it seems to look identical. I swear a lot more than variables had to change, and I’m convinced nesting doesn’t work exactly identically. Well I read that much, but couldn’t understand/remember the details.

6

I would be surprised if it just discarded lines.

7

There’s at least one bug in FF that’ll be fixed with 121.

8

but that’s what css interpreters do. Although I agree that it’s terrible practice… I prefer a overly zealous Ada compiler to one that forgives gross semantic errors, leading to Ariane V exploding :joy:

9

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.