@grid: 1 with the JS Api fails

[patrikengborg]

Hi,

First of all, thanks for a great and very interesting lib!

I can't seem to get the grid to render when setting @grid to 1. I've tried all different combinations but nothing works until i change it to at least 2, or even 2x1.

The problem only seems to occur when using the JS Api to initialize and update the doodle.
If i place my doodle definition within the element, everything works as expected.

Would be grateful for a fix or workaround. Thanks!

[yuanchuan]

Hi, could you provide some code please?

The following code works as expected:

<script>
  let doodle = document.createElement('css-doodle');
  document.body.appendChild(doodle);

  doodle.update(`
    @grid: 1 / 300px;
    background: red;
  `);
</script>

[patrikengborg]

That actually fails for me, but I'm using Nuxt, so it's probably due to some SSR trickery then.

However, I found a workaround. If I'm adding the @grid definition to the element, and then doodle.update(...), it works.

<css-doodle ref="doodle"> @grid: 1 / 100%; </css-doodle>

I don't know what's going on here, but at least I got it working, so I'm happy.

Thanks for your reply!

[yuanchuan]

Should be fixed now in 0.15.0

[yuanchuan]

Closing it. Let me know if this issue is still there!