Utiliser les fonctions SASS rgba dans le contexte de variables CSS ?

Question

Comment créer du SASS rgba 将 rgba(#4caf50, 0.1) 转换为 rgba(76, 175, 80, 0.1)lorsque le contexte est le côté valeur d'une déclaration de variable CSS ?

Pour plus de clarté, voici un exemple :

$green: #4caf50;

$green-rgba: rgba($green, 0.1);
@debug $green-rgba; // rgba(76, 175, 80, 0.1)

@debug 语句将记录 rgba(76, 175, 80, 0.1), c'est vrai.

Mais si nous essayons ceci :

test {
    --mat-mdc-button-ripple-color: rgba(#4caf50, 0.1);
}

Le résultat de la compilation est :

test {
  --mat-mdc-button-ripple-color: rgba(#4caf50, 0.1);
}

Des idées ?

Answer 1

Ok - après avoir regardé le code source du bouton Angular Material, le code ripple fait ceci et ça marche :

--mat-mdc-button-ripple-color:  #{rgba($color, 0.1)};