Is it possible to use inline css functions in sass?

Question

The root of my problem is to use CSS4 variables with css functions that are overridden by SASS blends.

SASS overrides rgband rgba, to help, for example, pass hex to them. The problem is that I'm using the new CSS4 specification, which allows variables.

What I want to do:

background-color: rgba(var(--theme-color, 0.5)

Now this will work fine if SASS is not busy and does not expect another input.

So, can I somehow override this mixin, so I just get it as a normal css value?

Answer 1

Thanks to Justinas, who led me in the right direction on this.

, CSS SCSS, - , , .

: https://codepen.io/anon/pen/LydWMd

mixin, ( , , , , sass ) :

@function native-rgba($string, $opacity) {
  @return #{"rgba(#{$string}, #{$opacity})"};
}