consider this problem... two .scss sheets
*styles.scss*
@import _variables.scss
--app-color: rgb(0,0,0); //css variable
*_variables.scss*
$color: var(--app-color); //CSS to SASS variable
now we can everywhere use $color variable filled with CSS variable color and it works.
My problem is using this SASS/CSS variable to set opacity. Look at this =>
background: rgba($color, .1);
it will NOT work... because $color in this case will not be passed like common color value like I defined (
rgb(0,0,0)
) but like (
var(--app-color)
and function rgba() probably don't know how to handle this parameter.
rgba() can handle two parameters ($color, $alpha) which works perfectly, but not if $color/$alpha are filled with CSS variables values )
... any idea how to solve this? Am I wrong with how I understand it ?
Thank you