slim icon indicating copy to clipboard operation
slim copied to clipboard

SCSS - how to insert ruby variable?

Open gapipro opened this issue 7 years ago • 6 comments

I am trying to inject ruby variable into sass but I can't find any help on how to do it.

If I use CSS engine then it can be done like so:

  css:
    .remodal-overlay:after {
      background-image: url(#{variables['palette-background-color']});
    }

But when I try to do same thing with SCSS I get error:

Invalid CSS after "...r : #{variables": expected "}", was "["palette-backg..."

And here is my scss:

  scss:

    $color : #{variables["palette-background-color"]};

    .remodal-overlay:after {
      background-image:$color;
    }

Should I set local variables in ruby before using them in scss?

gapipro avatar Sep 14 '16 14:09 gapipro

I'm trying to do the same and hitting the same "Invalid CSS after..." error. Would be great to have a solution without resorting to the CSS engine.

tetherit avatar Jan 22 '17 17:01 tetherit

@xanview @gapipro - any luck with this?

chrisweconect avatar Feb 24 '17 15:02 chrisweconect

This is not supported because of the way sass code is compiled right now.

minad avatar Feb 24 '17 16:02 minad

@minad - so this type of stuff won't work anymore?

- if @network.titlebar_image
  scss:
    .navbar-default {
      background-image: url(#{@network.titlebar_image.url});
      background-size: contain;
      background-position: center center;
      background-repeat: no-repeat;
    }

thanks...

chrisweconect avatar Feb 24 '17 16:02 chrisweconect

Just hit this today. Would be awesome to support ruby variables in the sass or scss filters.

averbs avatar Jul 30 '17 16:07 averbs

Nothing happens here. This one is still actual, though.

elmirill avatar Mar 10 '20 14:03 elmirill